Menopause Care Web App Redesign
The Cusp
Menopause Care Web App Redesign
The Member Experience Redesign is a project focused on improving The Cusp’s web app for our Hormone Test Kit members. Our goal was to guide our members more effectively through their Hormone Test Kit journey, from purchasing the kit to meeting with our Providers, and encouraging them to become monthly members.
Note: The Cusp closed in Dec 2020
Problem
How might we provide a clear, concise Hormone Test Kit (HTK) member experience, that guides them through every step, so that they feel confident and supported and have opportunities to upgrade to monthly membership?
Business Objectives
Drive 30% conversion from post-hormone test kit visit into monthly membership directly from the platform.
Reduce support customer questions by making the hormone test kit member journey more clear.
Make becoming a member more accessible.
Prioritize Experiences
Because our goal is to convert Hormone Test Kit Members to the monthly membership, we focused on improving the experience for Hormone test Kit Members.
Understanding the Current IA
In order to understand how to incorporate the HTK journey into the app and find all possible pain points, we audited our current IA.
Team
My Role: Product Designer & Illustrator
Lead Designer: Maurita Antoinette
Product Manager: Jenny Ma
UX Researcher: Miriam Ahn
Scope
Company: The Cusp
Timeline: 5 weeks
Platform: Progressive Web App
Tools: Figma, Miro, Survey Monkey
The Research Process
Using Past Research
In the past, many of our Hormone Test Kit members were purchasing kits and not completing the tests. Our researcher had performed 4 user interviews to understand why and their potential frustrations.
Research Findings
Make sure to clearly set HTK users’ expectations about the process
Members are sending back collection cards that don’t have enough blood
Provide clear delivery status updates
Showcase The Cusp educational services throughout their journey: Articles, Webinars, Open clinic hours
Empathizing with Our Clinical Team
We looked through 82 member support tickets and interviewed our Clinical team, gathering information about where Hormone test kit members struggle the most in the Web app during the Hormone Test kit Process.
Research Findings
Members are in the dark about the Timeline of the HTK and results.
Members can't find the health forms
Members can’t figure out how to Join Video Visit
Members have trouble uploading Medical Documents
Enhance Chat: Members communicate with Clinical Team in the Chat
Competitive Analysis
Based on research findings, our competitive analysis focused on how to approach IA, navigation, booking visits, and tracking. We looked at Curology, Maven, Ginger, Carbon Health, Doctor on Demand, Lemonaid Health, and Gennev.
Card sorting to Help Us Define Our New IA
We reached out to 65 members / non members and got 15 responses for our Open Card Sort Test. The card sort helped us understand how members group pages in the existing app and begin ideating how we might name tabs in the new more efficient navigation.
Usability Testing: IA and Navigation
Because the new navigation would lay the groundwork for the pages we design, we wanted test our first design’s accuracy through usability tests with members.
Research Findings
Data showed us that we didn’t need a home, and that users grouped My Visits, My Treatments, and My Results underneath My Health/My Care.
Making the My Care tab the new “home” made the navigation more clear and clean.
The Design Process
Research Finding
Members are completely in the dark about the Timeline of the HTK and results. This may be creating anxiety or a feeling of distrust.
Solution: Show Where HTK Member is in Their Journey
Instead of members searching through the app, the new homescreen screen immediately shows what step the members is on in their HTK journey and is an overview of the member’s entire care plan.
My Next Steps Card Indicates HTK Progress
The icon changes depending what step the member is on.
The final two steps have a yellow icon indicating the completion of the journey and a special moment for the member.
The progress bar at the bottom of the card is a quick view of the member’s progression.
“Become a Member” is the Final Step
Making Become a Member the final step, naturally guides members into conversion and continuing care with us.
Research Finding
Make sure to clearly set HTK users’ expectations about the process
Solution: Notifications and Shipment Tracker
Because members were frustrated by the lack of delivery status updates, I created a shipment tracker that the Lead Designer suggested would queue a global notification to the member, as the kit’s delivery process progressed.
Research Finding
Members are in the dark about the Timeline of the HTK and results.
Members can't find the health forms
Members can’t figure out how to Join Video Visit
Solution: Enhanced Comprehensive My Visits Screen
Previously, we did not clearly represent when Hormone Test Kit Members could book their one visit. In the new design, the My Visits screen includes all the information they need to know about visits; when and how they can book a visit, join a visit, and what forms are needed prior.
Solutions: Informing members when to book and join visits
Previously, we did not clearly represent when Hormone Test Kit Members could book their one visit or join their visit. In the redesign we provided copy and inactive CTA’s to inform members how and when visits could be booked and joined.
While You Wait: enjoy our other services
Through out the HTK process, members wait (for the kit to arrive, for the lab results, to book a visit) This “While you Wait” module shows members all our Resources and services they can use while they wait, preventing anxiety and making the experience more self driven.
This also is a great opportunity for them to learn more about the benefits of membership.
We are Always Here For You
Based on insights from competitive analysis, I created this “Have questions?” module that is intentionally placed through out the app, so members feel they can always ask for help.
Research Finding
Members are sending back collection cards that don’t have enough blood on them to be processed by the lab.
Solution: SUCCESS AND ERROR MODALS
Adding these success and error modals makes it more obvious that the member needs to retake the test and can be triggered no matter where the member is in the app.
Providing Moments of Celebration and Delight
The HTK process is long, 7 steps. Acknowledging moments of completion for the member helps motivate them to continue, and clearly provides the next step.
Research Finding
Showcase The Cusp educational and preventative services throughout their user journey: Articles, Webinars, Open clinic hours.
Solution: Making the Resources Section Fun and Inviting
In order to draw attention to all these benefits, I made each resource icon distinctive and fun, almost like social media icons. This style is meant to be welcoming and encourage the member to explore their own self driven menopause education.
Services Tab: providing clarity
Previously, we did not have a Services" section in the web app. Adding in this tab makes it clear what services the HTK member can enjoy while they wait for their HTK results. It is important for members to learn more about the value we provide, during these waiting periods, to prep them for conversion.
Providing Opportunities for Members to Convert Easily
Throughout the redesign, we intentionally encourage HTK members to become monthly members. Optimal times to encourage conversion are when members are waiting and at the end of the process.
Making the Journey More Delightful
Because the Hormone Test Kit Process is long, 7 steps, I created a number of on brand illustrations and icons for the member experience, for error states, empty states, moments of celebration, and banner images, making the experience more enjoyable.
Reflections and Next Steps
Unfortunately, the Cusp closed before we developed the redesigned web app, but from this experience I learned a lot about how to improve my design process. I learned that we the Product Team, should have prioritized needs and clarified to what level we intended to “redesign” the web app. This lack of clarity is why we were not able to gauge an accurate timeline.
I also learned that close communication and frequent check ins with the Product Manager at the beginning of a project is important, especially in the case of a “redesign”. It is at this time, project solutions are the most open, therefore when I need to proactively seek alignment.
Next Steps
In order to improve my design process, I signed up for a Certified Scrum Product Owner course, to better my ability to prioritize needs and turn them into features that provide authentic value.