How we designed Oscar 2.0
In the fall of 2016, I shut down my first company and joined Oscar. Oscar’s mission is to bring health insurance into the 21st century. My task was to carry out a redesign of our mobile properties, built from scratch, in react native.
The whole process took a ton of exploration, prototyping, testing, and development. In the end, we came up with a solution that we feel makes health care easier to understand, more accessible, and convenient.
Here’s what it took to make it happen.
Auditing and taking inventory
When I got to Oscar I quickly began scheduling 1 on 1’s with all our internal product teams to better understand the member and provider apps.
What I found was that the previous version of the app hadn’t been updated in over two years. In that time, Oscar had built up some serious technical and design debt. Our iOS app was put together by 1/3 Obj-C, 1/3 Swift, and 1/3 React native.
After meeting with everyone, I began to put together a mobile map of the iOS and Android apps in Sketch. All in all, I ended up with about 50 to 60 screenshots that had to be pieced together. The goal was to better understand the product and see where inconsistencies existed. Since we were rebuilding both apps in React Native, it was also helpful to take inventory of all our UI components and see where we had size discrepancies.
One thing I noticed right away was that Oscar’s visual brand and identity had also evolved. The mobile app no longer felt consistent with our site and marketing materials and we wanted to make sure the new mobile design aligned well.
Fortunately, I was lucky to be working with some really talented folks on the brand side. Shout out Maxwell, Emili and the entire Output team. The delightful and satisfying branding elements you’ll see throughout the app were done in collaboration with them and it really brought the app to life.
Taking a step back and setting goals
Once we had the big picture, we began putting together a roadmap and setting broader goals for the redesign. Right away we new that we wanted to make it easier for people to find care, talk to a doctor, and access all their health information in one place.
We also wanted to drive usage of under-used features like messaging with Concierge and appointment booking. Accessibility was going to be improved by introducing larger font sizes and darker colors with higher contrast to improve readability.
A related goal was to rethink the app’s information architecture to accommodate for new features down the road. We have some exciting new features coming out over the next year and we needed more room to scale.
Trust the process
After setting up a roadmap and aligning our objectives, Adam Karnas and I began setting up a handful of internal interviews. We chatted with each of Oscar’s product teams to get a sense of where the key member friction points were within the existing app. We also used online reviews and support tickets to gather direct member feedback.
After consolidating notes, Adam and I put together a full design brief that outlined the project goals, stakeholder comments, user stories, and key deliverable dates for the project. We reviewed it with the engineering team and made sure that everything we outlined was in scope and possible for V1.
When we got to a good spot, we put together three different designs to test. One that changed dynamically based on location and available services (Option A), a WYSIWYG version where all our core features were accessible from the home screen (Option B), and one that was more curated by us in order to guide members to things we wanted to them complete or engage with (Option C).
Next, we conducted a preliminary round of user testing with Oscar members. We showed them all three prototypes and got feedback over the course of an hour. All interviews were recorded and documented so that we could go back and study behaviors and reactions.
Some of the members who came in weren’t 100% convinced of the designs we showed them. Others gave us critical feedback and said they were cheering for us. There were also members who were very familiar with the app and others who had hardly used it at all.
After processed all the feedback from the first round of tests, we quickly realized that Option B was winner. We then went back and began refining interactions, navigation patterns, and visual design for this prototype, making sure everything would work consistently across iOS and Android devices.
Welcome home
Three things we wanted to emphasize on the home screen: Finding care, talking to a doctor, and talking to your Concierge. The illustration also changes dynamically based on the city you’re in.
Care at your fingertips
A big theme in this redesign was accessibility. We wanted members to have context behind our services and take advantage of benefits that were free to them.
Improved telemedicine
Talk to a Doctor and Concierge are two of our most important features. We wanted to create a more personalized experience and make talking to a doctor less intimidating.
All your health history in one place
Health insurance is insanely complicated. A big win for us was being able to distill our members most important health information into one view. Your plan, lab results, prescriptions and history should always be accessible.
Improved on-boarding
Education is one of the most important pieces to our product. We wanted to teach our members how to take advantage of our new services and benefits that were covered under their plan.
Delightful experiences
Make an experience enjoyable. Syncing step counts was one of our most used features. So, we decided to reward members when they hit their daily goal.
Member attachment uploading
This was another feature we built from scratch during the process. It allows members to add contextual images or documents when they talk to their Concierge. This helps us better suit your needs.
Seeing results
We released the app update last week and have been carefully tracking member engagement and behavior. Here are some early numbers from the past 7–10 days. Really excited to be pulling in data and using it to make more informed design decisions.
Key takeaways
As a team, we learned a lot about the redesign process and best practices for moving from design to development. Here are some of the key takeaways:
- Cognitive overload is real. Members preferred a more progressive flow of information with fewer options at each stage. Don’t overwhelm people with too many options right away.
- Naming matters. Standard industry terminology such as Health Survey isn’t intuitive for members. Where possible, it’s best to use explanatory, relatable language instead.
- Always group relevant information. By consolidating related health plan information into a single tab we made it clear and easy for members to access.
- Personalization matters. Members responded well to real photos of their Concierge team members and a geo-targeted background illustration.
- React Native is the bees knees. While it took a little longer to refactor the entire app in React Native, it’s given developers more time to build new features instead of maintaining separate versions of the app.
Future updates
In the coming months, the team will be rolling out additional updates that help members save preferred doctors, medical centers, and Concierge team members in one place. All while helping them make more informed decisions about which doctors to see and when.
We’ve also begun to systemize our design process by building UI as components as part of our mobile anatomy in React Native. This allows to quickly iterate, speed up dev time, and maintain design consistency.
Excited to see where it goes.
Shout out to the entire Oscar design team for helping make this happen. Frank G, Maxwell Holyoke-Hirsch, Gabe Schindler, Josh Long, Adam Karnas, Gabbie Williams, Anthony Zhang, Emili Hsu 🙏🏼
P.S. Sorry for the load time on these GIFS, tried all kinds of compression and still nada 😩
