project overview

Website analytics and user research showed that people wanted to use this site on their mobile devices.

The goal of this project was to make the live beta family health history site responsive since it was completely blocked from mobile traffic.

A secondary goal was to do this fast within the month of the holidays.

A tertiary goal was also to redesign some areas of the flow that had known usability issues.

My role in this project was user research, interaction and visual design. I worked on this with another designer, product manager and engineering. Stakeholders included product marketing. 


user research

User research showed heavy cognitive load, banner blindness and flow problems on this page where you chose conditions in your family. This page was an important step towards getting value on the site.

Current design prior to this project shown.



Quickly sketched ways we could improve the conditions picker page and how the site could flow into mobile.


Took the best ideas from sketching and translated into wireframes. Shopped around internally and narrowed down to some flows to test. 

An example wireframe that performed well in user testing.



version 1

Iterated on different visuals and tested on mobile devices to see which interactions could be improved per platform and browser.


card system

Created new card system to support this design.


header styles

Explored different header styles and tested which visual system was most clear on the phone.



tablet example

Iterated quite a bit on visual styles, for example the cards below, to explore the best UI for the interactions of selecting conditions and provide solutions based on scope.


phone example

One screen of the final visual style for the phone and all of it's state.



future state

For the desktop version, thought a drag n’ drop interaction might make adding conditions for family members easier.