Compt

Providing "Fun and Delight"

Compt is a fringe benefits program that promotes inclusivity, belonging and personalization. It is a third-party platform that’s an addition to employer’s HR platform.

The Goal was to redesign aspects of the existing product to give users a trusted platform to comfortably navigate, be engaged, encouraged and involved, knowing their reimbursements are looked after and cared for by the company.

User Research,

Interaction, Visual

design, Prototyping &

Testing

I worked with 2

other designers

Tiffany Yang &

Tom Workman

Role

Product Designer

Tools

Figma

Miro

Trello

Otter

Zoom

Google Docs

Duration

3 Weeks/ 3 Time Zones

Before

After

We began our research by doing 5 Usability Test on the existing product, with both new and current users.We partnered with our stake holders to recruit users for this test. Our users thoughts on the existing product were...

Clunky UI
Make icons clearer or necessary
Remove the clock
Show claim that was submitted on activity page once claim is submitted
Consider adding onboarding
Stipend Clarification

We Continued with 6

User Interviews

from existing Copt Users

and our main takeaways are...

I like reminder
I like having stipends
I appreciate simple and straight forward
I want an easy way to submit my claims
I care about my money

I chose to focus on the user's Emotional Response and timing, observing the most effective times to encourage and reward the user along the way.

Research showed that smaller completed tasks, when combined with a bigger end-reward was the most effective process.

What I learned was, the more visually designed a product, the more user friendly and emotional trust it built.

This pointed us in the direction to allow us to focus more on the improving UI's visuals and the UX.

Now it was time to split up, while my partners worked on task analysis I turned my attention to Competitive and Comparison Analysis

I continued our research on Benepass, Blueboard Thrive Gusto, and Mailchimp to name a few. We learned that they used...

Clear and fun language.
Engaging graphics, icons and images.
Error recognition.
Recognition of a “boring” task.
Easy to read navigation to make their platform more engaging and enjoyable

By synthesizing our analysis it be came clear that our Solution is, by adding emotional trust and a cleaner more linear design flow to the platform, Compt’s Users will be more engaged by the fun and delightful nature of the platform while being reimbursed.

Our Persona is Kristin, who has been working remotely since the covid-19 pandemic started She has received stipends from her employer, allowing her to spend money on different perks, such as health and wellness, her dog, or on coffee and snacks.

Using the MoSCoW prioritization
method, our team determined what to focus on for the MVP, defining what the app Must have, Should have, Could have, and Won’t have.

Compt’s User Flow was already pretty smooth so we just tweaked the claims flow and added an additional onboarding feature. We just enhanced and clarified the flow to keep the users on the "Happy Path".

Once we had synthesized our research we remotely did a Design Studio to sketch and collaborate our findings.

Cleaning up the UX became our focus on Low-Fi Wireframes.

I began by...

Combining the stipend cards together
Scaling the submitting flow down to bite size pieces
Made the claims page more dynamic and legible

We Failed, by trying to redesign the flow we made it more clunky and hard to navigate. We did find success with renaming the summary page to “My Perks” to create a more personal feeling. I also started to hone in on the error states.

The cards were too big, impairing the user friendliness. Too much

scrolling plus with unsightly check mark indicators just ended up

confusing the user

Continuing on to our Mid-Fi Wireframes ideation we felt we had a smart grasp on the flow. Although it forces the user to perform in steps, it leaves little chances of errors and accidental submissions. Also by adding playful error messages, the user can follow information and be gently coerced to go in order.

Positive responses on the layout and user flow
Added color/ added the wrong color
There were issues on where to find certain stipends

Most users found the Compt brand green hard to read, so I exchanged it for a darker accessible color to make things more readable. I added perk icons to the stipend selection screen to make it more clear what the user had available to them when selecting their stipend. My partners worked on making a simple onboarding flow and the activities page more consistent.

After our third round of usability testing it was time to create our Hi-FI Wireframes

Changed the colors (more accessible)
Removed unnecessary and confusing icons
Focused on error states and success notifications
Added onboarding feature
Created clear, dynamic and recognizable icons

for a more user friendly interface

We held a total of 12 Usability Testing participants for the updated designs, with four participants in three rounds of testing — low-fi, mid-fi, and hi-fi.

Testing Scenario: You are a Compt user and have just been gifted a stipend from your company to apply towards perk benefits.

Overview of Main Tasks:

Submit a claim for a commute

Submit a claim for a cellphone bill

Edit your claim information and amount

Low-Fi Results:

Users found that there was too much scrolling on the claim form and we changed the form layout as a result.

Users made mistakes when attempting to submit claims, so we added error states for required fields.

Mid-Fi Results:

Most users found the Compt brand green color ratio hard to read, so exchanged it for a dark accessible color to make things more readable.

We added perk icons to the stipend selection screen to make it more clear what the user had available to them when selecting their stipend.

Hi-Fi Results:

Users found the progress circle on the My Perks page slightly confusing, so we adjusted the days lefts to make it more clear how much time they had to spend their stipend money.

Our client Compt was very pleased with our work, stating we tackled all the issues they were aware of and more. Compt is implementing our designs into there newest version.

Working with 2 other partners and stakeholders was an amazing experience that I'm excited to continue.

When there are FUTURE ITERATIONS, I would like to focus on...

Adding a short onboarding video.
Make it more accessible for ADA.
Giving companies the ability to edit category descriptions.
Giving more color scheme options.
Make the progress circle change color based on days left.
Making the website more responsive to mobile devices.