23andMe iOS and Android

23andMe

mobile_app_header.png

The Goals

The mobile team's goal was to release an iOS app along with 23andMe's product relaunch at the end of 2015. The Android app launched a year later in December 2016. Although the iOS and Android apps were not worked on concurrently, they both had the same goals:

  1. For MVP, translate the contents and features of the desktop website into a native app, limited to the Reports and Research sections.
  2. Create iOS and Android style guides with reusable components that also adheres to the new 23andMe brand guidelines.
23andMe's mobile app in 2012

23andMe's mobile app in 2012

The Challenges

Because 23andMe is a government regulated product, and because we are a true scientific research company, the mobile apps had to undergo scrutiny by the Institutional review board (IRB) and the FDA. To get the apps launched, I was in constant communication with the IRB, Survey, and Reports teams to make sure that the designs were in compliance. This often slowed down development because I needed to rework and resubmit designs for approval.

 

Developing the iOS and Android Style Guides

I worked very closely with the mobile app engineers to create and implement the 23andMe iOS and Android style guides. The style guides define styles, rules, and reusable components that align to interaction patterns unique to each OS. While the iOS app has a very "flat" design, the Android visual styles have more material design influence.

As the lead designer of the mobile apps, I enforce style guide patterns among the design team and also develop new ones when needed.

What I Learned

From leading the design of the mobile apps I have learned a lot about the differences and similarities between the iOS and Android platforms. I also learned the intricacies of the different types of specs engineers need for each. 

iOS screens

iOS screens

Android screns

Android screns


The iOS app was released in 2015 and the Android app in 2016.


23andMe iOS and Android

23andMe iOS and Android

23andMe Research

23andMe Research

Simplified Homepage

Simplified Homepage

Exposure: Supply Chain Risk Management

Exposure: Supply Chain Risk Management

Social Supply Chain: Comment, Follow, Share

Social Supply Chain: Comment, Follow, Share

Exposure: User Onboarding

Exposure: User Onboarding