styleguide copy.png

Visual design work

23andMe

 

About the projects

A constant challenge for creating new content in the 23andMe product is the lack of engineering resources. To circumvent that, we often create templates so that non-technical people or designers can create new content.

My role

I worked on the templates, visual designs, and specs for the homepage feed, social sharing, and various icon work.


Homepage feed

We redesigned our homepage to be more dynamic and content-driven. Our whole design team worked together to design and user test two versions of the page. After we got user feedback and stakeholder buy-in, we needed to fill out details on how the page would work. I took on the tasks of working with product to define page content, spec-ing out the page content and interactions, defining responsive behavior, and working with the developers.

Homepage feed templates

I defined four distinct feed types and spec-ed them out for both desktop and mobile. These four types were flexible and comprehensive enough that we’re still using them today.

 Template types

Template types

 Template types with real content

Template types with real content


Social sharing templates

I created research insight social sharing templates for Facebook and Twitter. These templates were a hybrid between our product and marketing style. The template files could be edited by other designers or product managers who wanted to change the copy.

 
 

Various icon work

I created various icons for use in our product.

 
 Illustrations I created for an instructional in a Research survey.

Illustrations I created for an instructional in a Research survey.