ABOUT THE PROJECT
The 1st MVP development for Financial Planning & Analysis web platform
CONTEXT
For this opportunity, our team worked with Rockhopper, in particular, the founders Sebastian Lawrence & Andrew Luu. The startup was on a mission to reimagine how Financial Planning & Analysis (FP&A) process and empower both finance & non-finance professionals to easily plan, iterate, and collaborate around business simulations and real-time financial impact. To accomplish this, the founders came to us to conceptualize and embody their idea on the 1st MVP.
problem
How might we create a more efficient FP&A solution that eliminates manual data cleaning, reduces errors, and fosters seamless collaboration between finance teams and product managers, enhancing transparency in the process?
Role
Lead Product Designer
Team
Myra S. (UX Researcher)
Sandra L. (UX Researcher)
Andrew & Seb (Subject matter experts)
client
Duration
7 weeks
August - September 2022
achievement
High client & user satisfaction
We received positive feedback from the client & users, they were highly satisfied with the quality of the deliverables, and our design will be implemented as a baseline for the 1st MVP.
Task success rate
"Our venture, Rockhopper, was lucky to have the contributions of Kate in the development of our platform. Her efforts were instrumental in bringing the product to life and realizing the vision of Rockhopper."
-Seb & Andrew (client)
“I did like how easy it was to update total revenue, it was quick.”
-Mihir
“With more features it will be a great product”
-Kunar
01
Research
Before we could dive into talking to finance professionals, we first needed to break down the language barrier between finance. None of our team had prior finance knowledge, so we conducted extensive research to gain a basic understanding of financial terms, the scenario planning process, and competitors, and by collaborating closely with the client, who served as the subject matter expert on FP&A.
Competitor Research
We analyzed the competitor landscape to understand the market and recognize common UX patterns. We assessed the pros and cons of various products, evaluating their flexibility and collaborative capabilities
Competitor landscape
User Interviews
To better understand what challenges our users were facing we conducted virtual 1 on 1 interviews. We spoke to a total of 5 finance users roles ranging from the manager to CFO and 3 non-finance users.
5 finance users
3 non-finance users
02
Problem & Insights
From talking with two user groups, we discovered two big patterns from what users were saying.
Current FP&A tools lack flexibility or standardization
Finance professionals are spending too much time on data processing and aligning on assumptions
Disconnect & language barrier between non-finance & finance teams
Lack of collaboration and financial literacy are preventing non-finance teams from fully participating in analyses
03
Meet our users
04
Feature prioritization
How does our solutions fit into user journeys?
I facilitated a workshop with the client to share discoveries from research and brainstorm solutions and feature prioritization.
We asked questions about how to provide a sweet spot between flexibility and standardization. And we created user journey maps to see where our ideas could solve user pain points.
Finance user journey map
Finance user journey map
05
Design
Focused on 3 key flows
Due to timeframe, we focused on 3 major task flows, which were, creating scenario, comparing scenario, and using scenario calculator.
Task flow of creating scenarios
Task flow of comparing scenarios
Task flow of using scenario calculator
06
Test & Iterate
We received positive feedback from the client & users, they were highly satisfied with the quality of the deliverables, and our design will be implemented as a baseline for the 1st MVP.
Tested with 5 users with high task success rate
Tasks
Upload the baseline to the system & create a new scenario analysis
Create a comparison view of different scenarios and share
Create a new forecast by using scenario calculator
93%
Task success rate
Confusion on Icon
Most of the users were having difficulties understanding what each icon meant on the global navigation. To resolve this we added clear annotations when users hover over the icons.
Need for different ways to adjust drivers & assumptions
Adjusting drivers on a light-box can be inefficient as in real situations, users would update more than one driver with different values. Clicking into each row of cells is counterproductive and may lose track of the process. To create a more holistic view and an one-stop place where users can make the change, we created an 'Assumption' feature, where slider appears when users click the CTA button.
Clear Affordance for the Canvas
When asked to add graphs for the scenario comparison, all of the users had difficulties finding the canvas and down the page due to a lack of annotation and affordance. To solve this matter, we changed the layout to side by side view, and made it collapsible if needed.
07
Iterate & Refine
Updated task flow
With learnings from usability tests, we brainstormed with clients on identifying the friction point and providing solutions to capture the needs of both finance and non-finance folks. The below task flow shows how we refined our wireframes on 'Data upload & mapping' & 'Assumption' features.
Updated task flow of creating new scenario
08
How might we improve FP&A process to be more flexible, standardized, and collaborative?
Easy assumption update
To provide a flexible tool, we have designed the scenario planning page to resemble Excel, enabling users to edit to the cell level and includes an Assumption feature where users can easily add or edit assumptions. With this feature, users can also have a holistic view of the file and the assumption stacks.
Simple update on scenario comparisons
Furthermore in scenario comparison view, users can easily add & edit metrics and has quick access to each scenario for live edit.
Reducing manual process through auto data mapping
Collecting and flushing through files that have inconsistent formats drives manual work, to address this pain point, we designed Smart File Uploading flow, where users can choose a template and review & edit auto mapped data.
09
Visual Identity
Reliable and trustworthy
As Rockhopper is a finance tool adhering to professional business use, I chose ‘blue’ as the primary color to express a reliable and trustworthy brand image. And ‘turquoise’ shades as a secondary, which convey harmony and balance.
Clean minimal layout for data & action point to stand out
FP&A process is complex with vast data and need for diverse features. To deliver this without overwhelming our users, we adopted a clean and minimal layout and color scheme, allowing the focus to be on the data and essential action points
Dashboard layout
Scenario and Scenario Comparison page layout
10
What did I learn?
Focus on the Minimum Viable Product
It is tempting to design more features and come up with solutions to problems. But, it’s vital to get the first version of your product out as soon as possible to understand your users and iterate.
Get comfortable with ambiguity
The 7 weeks of building new financial planning have been a foreign but valuable experience for my team and me. I learned how to be comfortable with the uncharted area of expertise and how to navigate through blockers to move forward and deliver. I want to thank my team and clients, Seb and Andrew for a humbling experience and for teaching me so much about finance and business planning.
Thank you for taking the time to read!