Perks & Rec

Financial Well-Being Software Redesign


 Introduction

*As I am under an NDA with the company I worked with, I will refer to the brand as “Perks & Rec” throughout this case study.*

Today’s leading companies are constantly losing top talent for various preventable reasons. One major factor that contributes to an individual’s job change is insecurities regarding their personal finances. Furthermore, employers offer company perks in the form of discounts and reimbursements to alleviate some of the stresses around personal finance. Perks & Rec is the next-generation financial wellbeing software that gives enterprise organizations a new way of empowering - and retaining - their teams.

Perks & Rec.jpg

My Role

I was one of four UI/UX Designers on a team working closely with the CEO & Co-Founder of Perks & Rec. My role focused solely on the Cashflow Tracker feature of the Perks & Rec platform. My responsibilities included:

  • Understanding the current platform and business goals

  • Analyzing key competitor

  • Conducting user interviews and usability tests

  • Synthesizing the findings and providing design recommendations

  • Designing new high fidelity screens

  • Building a high fidelity prototype


Research

Understanding the Current Platform & Business Goals

Due to our tight timeline of 4 weeks and the complexity of their vision, Perks & Rec provided a lot of key insights regarding their enterprise customers and use cases for the Cashflow Tracking feature of the software. According to the CEO, the primary goal of this feature is to help match company benefits/perks to employees’ financial wellbeing.

We need to understand the full list of employer’s benefits and alert users that they need to take advantage of a perk when we catch something in their cash flow that matches to a benefit. But how do we do this?
— Jenn S. (CEO)

Competitor Analysis

To get a better understanding of the competitive landscape, I analyzed the Nerdwallet platform, a popular personal finance management tool, using three of the usability heuristic principles as defined by the Nielsen-Norman Group. Due to the strict time constraint, we selected these three heuristics so that we can deliver our analysis to the company in a timely manner.

Aesthetic and Minimalist Design

The commitment to a very minimalist aesthetic is very evident immediately upon entering the Nerdwallet platform as their onboarding screen is incredibly simple and straightforward. This design decision keeps the focus on the essentials and makes it difficult to get distracted from the intended purpose of each screen. 

Recognition rather than Recall

What I found particularly appealing about the Nerdwallet tool is the ability to save certain screens, contents, and items to be viewed again at a later time. This list of saved items is always found in the navigation tab. Providing access to the pages recently visited and searches performed in the near past can help users recognize and resume tasks that they left incomplete and that may have a hard time recalling.

Consistency and Standards

All pages are designed with internal and external consistency: they all have the same general layout that is organized by interactive cards. This design allows users to quickly understand what the important information is on each screen as they immediately know where to look. Additionally, Nerdwallet uses visuals and terminology that are consistent with what people are accustomed to from using other financial tools. As a result of these design decisions, users face little to no barriers to gain the necessary insights quickly.

 User Interviews

After learning more about the Perks & Rec platform, their business goals, and the competitor landscape, I wanted to hear directly from the people that would potentially use this software. I conducted five one-on-one interviews with employees of enterprise organizations who have changed jobs at least once during their career thus far. 

Goal

  • Understand the target audience’s pain points, behaviors, and objectives relating to employee financial wellbeing.
  • Understand how aware the target audience is of the perks that their company provides.
  • Understand the factors that played a role in people’s decision to change jobs and see if company perks played a role in their decision-making.

Key Insights

  • Interviewees primarily use banking websites / apps (eg. Citi, Chase) as their sole financial tool. Some have used third party services like Mint, but abandoned them out of frustration.
  • A top priority of the average user is being able to see a snapshot of all their accounts & transactions as conveniently as possible.
  • When it comes to cash flow, people want to quickly know how much they have left to spend.
  • Finding out about company perks & benefits is frustrating and inefficient. It is generally reliant on different websites, email, paper mail and word of mouth. These are a barrier to taking advantage of potential perks. These barriers to access could be improved if information regarding perks and benefits was centralized and more clearly stated.
  • Interviewees placed the most value on health, dental, and vision insurance benefits, but these benefits are typically siloed across different insurance firms and accessing them is a frustrating experience.
  • Perks and benefits are a minor factor in interviewees' decision to change jobs. Salary, work environment opportunities for advancement, and new cost-of-living are more important factors.
I don’t care to be shamed for decisions I make with my own money.
— Clara J. (Participant)

The insights I gleaned from the user interviews had a significant impact on my design decisions as it shed light on the importance of providing users with a comprehensive, easy to understand quick view of their cash flow situation. Additionally, it became evident that I needed to design a solution that would not only allow users to easily see and understand a company’s perks & benefits, but also show users how the perks impact their cash flow.

Usability Tests

I also conducted several usability test sessions with the current designs and prototypes built by the Perks & Rec team. 

Goal

  • Assess that the Cashflow feature is intuitive and easy to use
  • Uncover any usability issues or areas of confusion
  • Add more data points to my user research
  • Determine the best opportunities for design improvements

Key Insight

  • Users found information to be organized well, but the sheer amount of information is slightly overwhelming
  • Users found the amount of different colors too vibrant and overwhelming
  • Users were not sure why this feature is called a Cashflow “Calculator”
  • Users were not sure what piece of information is the most important

Original Cashflow Calculator as designed by the team at Keep Path


Design

Low Fidelity 

Synthesizing the insights I have gained from the research phase, I began to reimagine the Cashflow feature of Keep Path.

Goals:

  • Simplify the Cashflow screen to eliminate any barriers from quickly understanding one’s cash flow situation

  • Design a screen that allows users to quickly identify how much money they can still spend

  • Help users identify company perks as a way to help them save more money  

With these goals in mind, I designed a low fidelity screen on figma. 

Cashflow Low Fidelity Mock 1.jpg

Although we decided as a team to go in a different direction, the data visualizations and transactions ledger that I implemented in my low fidelity design helped shed light on the best way to simply inform the user on the critical pieces of financial information. For example, my low fidelity design focuses on informing users on how much money they have left to spend out of their monthly budget. I decided to communicate this information by not only displaying the dollar amount, but also by providing a progress bar to visually see how close users are to their limit. Additionally, I included a ledger of recent transactions so that users can easily refer to their purchases when the “Cashflow Advice” educates users on where they can save on their spending. 

High Fidelity & Prototype

Upon solidifying the low fidelity designs for the Cashflow feature as a team, I designed the high fidelity mock-up screen and implemented the necessary interactions to create a high fidelity prototype on figma.

Learnings

It was an incredible learning experience working on Perks & Rec’s Cashflow feature. Here are some key takeaways I learned from working on this project:

  • Understanding the business goals of a client is critical when designing solutions that are not only user friendly, but also satisfies the business needs of the company.

  • Never forget to be empathetic. It became apparent through user interviews that the pieces of financial information the team believed to be most important was rather secondary for actual users. 

  • While it is very exciting to come up with endless design ideas and recommendations, and you can say that “design is never done,” but it is important to always consider the resource and time constraints within a company, such as the number of engineers and due dates on deliverables.

Previous
Previous

GalleryPal