CHALLENGE
A Stealth DNA company needed to take its idea to investors and build an MVP with a cohesive brand and UX/UI approach. The goal was to create a website product that is warm and friendly and less clinical looking than most Clinical Genetic sites. The website and images needed to meet guidelines for visual and hearing impairment as well as ensure the customer felt secure in the process of learning about their medical genetic information. There are two sections of the website, the public pages and the secure area where personal information and a genetic report is accessed. The process of ordering, collecting, and reporting on the customer DNA findings required the customer knows where they are in the process at all times. The secure parts of the website needed to feel different from the main areas but work together cohesively with the entire visual theme.

12 Image grid of StartUp DNA website design

ACTIONS

  • Created brand narrative and design presentations of the website and brand for key stakeholders along with a strategy for the website design and DNA report for investment proposals using XD, Illustrator, Photoshop, and utilizing design tools such as MIRO for the UI/UX workflows and site flows.
  • Communicated and followed the team’s protocols in JIRA and later inside Confluence Project Management System
  • Developed and delivered a comprehensive website design and UX template in XD with a set of recommendations rooted in a clearly defined strategic priority for the design strategy.
  • Reviewed and picked a design methodology workflow for

RESULTS

  • A comprehensive StyleGuide and set of reusable components that work inside the NEVE WordPress theme design built inside Adobe XD.
  • A Genetics medical website with a warm and friendly feeling and aimed towards a female audience.
  • UI Design and UX site flows that met the requirements of the scientist
Grid Image of DNA Startup Website Design
DNA Startup UX Stylesheet
An extensive stylesheet with all the fonts, colors, buttons, designs and icons, and more needed to direct the site.