Finito: Simple Goal Setting and Tracking
UX / UI Design Case Study
People often fail to achieve their goals because they don’t write them down revisit them, or schedule time to work on them. In the swirl of our busy lives, it’s easy to let existing priorities take center stage. But failing to write down and revisit our goals makes it harder to achieve them. During my UX/UI course at Ironhack I designed Finito to give people a tool to record their goals, track their progress, and receive reminders if they forget.
UX / UI Designer
2-week Sprint (7/18)
About the Client
For this course project, I was challenged to design an app for the National Wellness Institute, a real business that sells certifications and training to wellness professionals. Sales of NWI memberships were down and they hoped a suite of new wellness apps would help them boost sales.
How Finito Helps People Reach Their Goals
A Central Hub For Life Goals
The main Goals screen allows users to see all their goals in one central location.
Much of daily life follows a weekly rhythm, so Finito encourages users to schedule work on a weekly basis.
When life gets hectic, people forget their goals. To help them get back on track, Finito sends reminders.
Statistics and charts allow users to see their achievements in context.
I wanted to learn how people set and manage goals, so I conducted 125 online surveys with men and women across the US. I also conducted five face-to-face qualitative interviews with men and women in South Florida.
Defining the Problem and Hypothesizing a Solution
I created a persona—”Busy Beth”—to define the main target user’s needs, goals, and frustrations.
User Journey Map
Then I created a journey map to visualize Beth’s pain points and responses across time, which helped me identify opportunities for solutions.
Defining the MVP
I used the MOSCOW method to define the app’s initial features. Since this sprint lasted only two weeks, I decided to focus on goals, reminders and basic progress statistics.
TASK FLOWS AND Site Map
Next, I created user task flow diagrams and a site map.
Rapid Prototyping and User Testing
For the low-fidelity prototype, I hand-sketched rough wireframes of the main screens, then created a clickable prototype in Marvel.
After testing the low-fidelity prototype, I created a set of mid-fidelity wireframes in Sketch.
Usability Testing Results: Low-Fidelity Prototype
I wanted to understand if people could easily understand and successfully use the low-fidelity prototype, so I tested it with 5 people, then integrated results from the low-fidelity prototype into the mid-fidelity prototype.
Style Tile / Atomic Design System
After creating the mid-fidelity prototype, I designed a style tile that included core elements of the user interface in high-fidelity.
I wanted to see how users emotionally responded to the style tile, so I conducted desireability tests with 5 people to validate my design.
After validating the style tile, I created a set of high-fidelity wireframes, updating the mid-fidelity wireframes with UI elements from the style tile.
Usability Testing Results: Mid and High-Fidelity Prototypes
After the style tile, I conducted usability tests on the mid and high-fidelity prototypes. I tested each prototype with 5 people.
Explore the High-Fidelity Prototype