Progress App Case Study
To help therapists better manage their caseloads, the Progress App was created. It serves as a platform for managing their practice as well as communicating with their clients.
This was my first project for the Google UX Design Certificate.
Project Duration
May 2022 - July 2022
My Role
UX designer designing a client management app from conception to delivery
My Responsibitlities
Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, and iterating on designs
The Problem
Busy therapists need more time to complete accurate progress notes and have organized case files
The Goal
Design an app that has an updated DSM 5 database that makes it easy for users to complete client documentation
Understanding the User
USER RESEARCH - PERSONAS - PROBLEM STATEMENTS - USER JOURNEY MAPS
User Research Summary
I conducted interviews, collected data from a survey, and created empathy maps to understand the users I’m designing for and their needs. A primary user group identified that current client management apps had outdated DSM databases that led to inaccurate client files.
This user group challenged initial assumptions. Research also revealed that there was not much consistency amongst client management practices. Other user problems included communicating with clients outside of therapy time and personalizing notes and communications.
User Research Pain Points
Therapists want to spend more time in the present with their clients
Current platforms have outdated diagnosis databases that make it difficult to update client reports
Onboarding to new systems lacks support
Therapists want to add a personal touch to their communications with clients
Starting the Design
PAPER & DIGITAL WIREFRAMES - LOW FIDELITY PROTOTYPE - USABILITY STUDIES
Paper Wireframes
For my first time creating wireframes, I found the process to be very enjoyable. I took time to draft iterations on paper to ensure that the elements that made it to digital wireframes would address user pain points. I prioritized having the main features be accessible from the homepage.
Digital Wireframes
As the initial design phase continued, I became more excited to try Figma for the first time. I made sure to base screen designs on feedback and findings from user research.
Low-Fidelity Prototype
The low-fidelity prototype connected the primary user flow of adding a diagnosis to a client and updating their file, so the prototype could be used in a usability study with users.
Usability Study Findings
I conducted two rounds of usability studies. Findings from the first study helped guide the designs from wireframes to mockups. The second study used a high-fidelity prototype and revealed what aspects of the mockups needed refining.
Round 1 Findings
Users wanted easier access to “Add Diagnosis” feature
Users wanted better cues for important features
Users wanted back buttons that went to the correct page
Round 2 Findings
Users wanted more color variation
Users appreciated the streamlined process of updating client files
Refining the Design
MOCKUPS - HIGH FIDELITY PROTOTYPE - ACCESSIBILITY
Mockups
Early designs had similar-sized buttons to get to the main features, but after the usability studies, I added a navigation bar to the bottom to make room for easy-to-access tasks.
Accessibility Considerations
Added Accessibility button for users that need more options when navigating the app
Added icons to help make navigation easier
Used high contrasting colors
Going Forward
TAKEAWAYS - NEXT STEPS
