Evergreen
An easy way for employers and independent shoppers to find health insurance plans.
Prototype
Overview
Evergreen is a project a developer and I collaborated on.
Our main focus was to create a User Interface library.
I decided to take it a step further by creating a fictional insurance company to showcase how our design library would flow for the users.
My role as a UX/UI Designer
I designed the user interface library for default and dark mode.
I designed Evergreen’s logo and interface.
I researched insurance competitors to understand what worked.
I also conducted user research to get an understanding of how they shop for insurance and what they wanted from their health insurance.
Tools
Figma, Whimsical, Optimal Workshop, Google Suite, Zeplin
Challenges
The user interface library needs to flow easily from default to dark mode.
Accessibility for both default and dark mode.
People want an easy and stress-free way to find insurance that fits their needs.
They want to be able to do this without straining their eyes.
Goals
Design the user interface library first then show it in the design.
Create a dark mode home page.
Make sure the design is accessible to all types of users.
Design a flow for signing up for insurance as an employer.
EMPATHIZE
Competitor Analysis
I researched health insurance to study their design and how a user would move through the website. Then I looked into other types of insurance companies to see if their designs had the same aesthetic. I found that medical insurance designs focused on information while auto, renters, and pet insurance focused on modern designs.
User Research
I created a survey of questions and conducted usability research to help me get started. I learned that hospitals, doctors, specialists, medication, dental, and vision matter most, and alternative medicine and gym coverage mattered the least. Coverage and monthly cost persuade them to pick a plan.
100% have a balanced lifestyle.
87.5% read testimonials, while the rest do not.
87.5% get health insurance in case of emergency, and the other 12.5% have health issues that are too expensive to maintain without insurance.
50% want family coverage, 37.5% get insured through their employers, and 12.5% want independent coverage.
62.5% say green is the most trustworthy color when thinking about health, 25% trust blue, and 12.5% trust orange.
Information Architecture
After going through the research results, I conducted card sorting to help me figure out what is considered coverage vs additions.
These results surprised me because I thought that specialty visits would be part of the main coverage and dental and vision would be additional coverage.
The research also supported my theory that gym memberships and alternative medicine would be considered additional coverage.
DEFINE
User Story
Tim is the CEO of a startup company and is in need of finding health insurance for his staff. Since his company recently expanded, finding insurance options is a new process for him to practice. He knows that many of his employees have families and he also wants them to be able to tailor their insurance to their needs, however, at this time, he’s only able to cover the basics. Tim decides to use Evergreen because its design is simple, easy, and has options. With those options, Tim is able to cover a portion of his employees’ basic coverage while allowing them to add additional coverages on their own. Being able to see other customers’ testimonials helps him feel confident in choosing Evergreen.
Task Flow
While I had intended my design to be for employees to independently shop for insurance, my mentor suggested I design the task flow based on how an employer would sign up for insurance for the employees.
I decided to explore that but also my design as simple as possible.
IDEATE
Logo
When thinking of a logo, I wanted to pick something that would look trustworthy. I decided to go with a tree icon to represent the tree of life. I made a few changes to the tree icon I found. Then I named the insurance after the Evergreen tree.
User Interface Library
The developer and I decided to focus this collaboration on the user interface library for both default and dark mode. I first created the default mode and made sure the color palette would be accessible. Then I create the dark mode’s color palette and designed the elements to match.
Low Fidelity Wireframes
Once I completed the user interface library, I decided to design a home page to show how users would interact with my design elements. I based my placement decisions on user research.
My first goal was to get users to sign up for health insurance in a simple way. Next, I wanted to design a path for either an employer or someone who is independently searching for coverage. Last, I wanted to include testimonials from customers.
High Fidelity Wireframes
I wanted the overall color palette to remind users of health and wealth to help build trust with the product. Since I wanted my design to be simple yet informative, I chose to use 3D illustrations of relatable actions to help build a connection with the user. I also chose to use a gradient to help guide users from one section to the next. Last, I chose a solid pop of brand color for the testimonial background because it encourages users to trust Evergreen while being separate from the task flow.
I started with the default mode first and made sure it would be accessible, then I focused on dark mode to make sure the design was cohesive and still accessible.
Default Mode
Dark Mode
Task Flow Mock Up
I wanted to show how an employer would walk through my design and sign up for insurance for his employees.
Prototype
REFLECTION
This project was about learning how designers and engineers work together. I learned that communication is key and I also learned how to hand off my designs. This was a little tricky at first, but after many conversations, we were able to figure it out. I was able to hand off my Figma file for him to work on the code. I also learned how to use Zeplin and InVision. Overall, I’m proud of our collaboration. It was fun to understand what we wanted to focus this collaboration on as well as learn how to communicate our expertise with one another.