Mei Yi Tan

Mei Yi Tan

Menu

Project Summary

This project focused on refinement and development of an insurance mobile and web app. I came in as an adapter to existing designs to ensure that development would be quick and smooth.

The project’s success was contingent on my ability to leverage mobile-first design thinking and convert the designs into one, responsible and adaptable design.

Roles

Sole UI design contributor & High level planning of work flows alongside a team of developers

Duration

8 weeks

Project Type

Client Project at a Consultancy

Tools

Google Suite

Figma

Zoom

Slack

Teams

Define

Background

EvryHealth is an insurance company that focuses on the modern mobile workforce. Evryhealth’s mission is to make healthcare affordable, transparent, and of the highest quality by providing expanded benefits at a reasonable price.

Project Objectives

The project was only 8 weeks and required my team to develop both their web app and mobile app. We opted to create a responsive web app that would double as their mobile one. 

Project Concerns

Evryhealth had existing designs from a previous vendor that did not fit the new requirements. I was in charge of adapting the old mobile app designs and modifying the web one. 

Problem Statement

How might we efficiently design a consistent experience across web and mobile that highlights the company’s services?

User Flow

To ensure everyone was on the same page, I created a high level overview of the full extent of the paths a user could take in the app. Color coding the paths allowed my coworkers and the client understand how actions would be groups into potential pages or stages of the workflow the customer would go through.

Ideate

Design Iterations

The project required fast turnaround so I leveraged the existing design to modify. However there were many modifications due to updating business requirements so the designs went through many iterations.

This did not hinder the timeline however, as the team stayed in constant contact and ensured I was getting the most updated information. In turn, I made sure all styling stayed consistent to lessen the development burden and ensured a quick turnaround.

Web App

For example, the company wanted to introduce a new feature that showed a user how they could earn discounts in a gameified manner. While my initial idea worked, the company wanted to display as many items possible so I had to balance readability and condensing information.

Old Rewards on Homepage Structure

Before condensing information, the rewards section was more spaced out to provide better readability.
Before condensing information, the rewards section was more spaced out to provide better readability.

Updated Rewards on Homepage Structure

The updated version of the home page
The final design feature more robust interactions for the user.

Mobile App

Since we intended to streamline the workflows to have one experience become responsive, I wanted to keep the experience as consistent as possible. This helped the developers code faster as they could reuse components and reinforce brand messaging.

The major problem was that the mobile app had a completely different brand from its web counterpart. It also was not as robust in its features, covering the functionality of about 50% of the web app.

Old Mobile App Design

The original design had a lot of hidden features that required further user interaction to view and did not robustly cover the features reflected in the desktop verison.

Updated Mobile App Design

The final design reflected the desktop experience.

Prototype

The final product condensed as much information as possible in an easily readable format. It was used as a user-facing interface for the company’s clients for both web and mobile.

Key Takeaways

  1. Desktop and Mobile were one experience that provides customers consistent messaging.
  2. New features to encourage customer participation and investment were easily accessible.
  3. Detailed and large amounts of information were condensed in an easily readable format.

The app is now available for user across web, iOS, and Android.

Get the App
The horizontally structured desktop experience displays all relevant information to its user.
Its mobile counterpart aims to have all the same information, condensed and arranged vertically for a consistent experience that does not favor a single platform.

Reflection

My experience on this project gave me the priority of focusing on a consistent user experience across platforms. Although I was able to fulfill this business requirement, we didn’t have enough time nor resources to test to ensure real users would think the same.

  • Had we been given more time to maintain the project rather than just create it, we would have benefited from incentivizing users to give their feedback on the experience for both desktop and mobile.
  • We didn’t have access to any server logs or client data. Had we been permitted to, we would have taken those into consideration as well