Role
User Research
Product Strategy
UI Design
Interaction Design
Usability Testing
Tools
Figjam
Notion
Maze
Figma
Timeline
5 weeks
The Problem
Existing users of the Wim Hof application faced challenges navigating the app, particularly in completing the 20-day Cold Shower Challenge. Moreover, the application failed to adequately showcase the Wim Hof Method, further complicating the user experience and ultimately deterring existing users from upgrading to the Premium version.
The Solution
To address these challenges, I streamlined the navigation process and restructured the app hierarchy, with a focus on highlighting the Wim Hof Method. As part of this project, I also reorganized educational content and eliminated unnecessary pop-ups, resulting in a more efficient and user-friendly experience.
Usability Review
Through a comprehensive usability review of the Wim Hof application, I identified several pain points and moments of delight. It became apparent that there were several additional pain points that made it challenging for existing Wim Hof users to navigate the application.
Business & User frustrations
After conducting a thorough usability review, it became evident that the Wim Hof mobile application failed to effectively promote its paid subscription services to users, while also presenting an overall overwhelming user experience.
Primary Frustration
The UI layout of the 20 day Cold Shower Challenge was found to be confusing and resulted in users facing difficulties while navigating, leading to incomplete challenges.
Secondary Frustration
The Wim Hof mobile application lacked clear information hierarchy and did not effectively showcase the Wim Hof Method, resulting in difficulty for users to navigate the app and leading to information anxiety. This ultimately caused users to abandon the application, resulting in lost opportunities for paid features provided by Wim Hof.
Competitor Benchmarking
As part of the competitor benchmarking process, I conducted a comparative analysis of two direct and two indirect competitors to the Wim Hof app.
Direct Competitors:
Cyro cold shower mobile application offered an easy-to-use interface with a swift onboarding process, and a hot and cold shower timer with audio cues.
The Cold Shower Therapy (CST) mobile application provided quick access to the Cold Shower Challenge, although it limited users to one timer setting.
Indirect Competitors:
Habitbull mobile application presented appealing visuals and tracked users' habits with a welcoming color scheme.
Productive mobile application provided an effortless tracking system that allowed users to monitor their progress with custom habits.
Problem Space
After conducting a thorough usability review and competitor benchmarking analysis, I identified the primary challenge to be the intricate and cumbersome process of accessing the cold shower feature.
This lead to How Might We…
Re-create a system that provides an easy 20 day Cold Shower Challenge process?
Design a feature to track the 20 day Cold Shower Challenge?
Help the users navigate the app and complete the 20 day Cold Shower Challenge?
Ideation
During the ideation stage, I utilized various ideation techniques, including Crazy 8's challenge, mind mapping, and priority matrix to generate and evaluate numerous ideas. These exercises enabled me to rapidly ideate and prioritize the most feasible and effective concepts.
What can we add
Add an animated timer to provide users with visual cues during the Cold Shower process and integrate a guided voice command feature to assist users with disabilities that may prevent them from completing the challenge independently.
What can we improve
Redesign the landing page hierarchy with an improved user interface and color scheme to enhance user experience. Additionally, update the badge system to promote user satisfaction.
User Flows
After the ideation stage, I conducted a user flow analysis to evaluate the current flow of the Wim Hof mobile application. The analysis revealed that irrelevant pop-ups were causing delays for users accessing the Cold Shower Challenge. Therefore, I developed a revised user flow that provided users with quicker access to the challenge.
Original User Flow
Revised User Flow
Rapid Prototyping
As I progressed through the project, I proceeded to the rapid prototyping phase. During this stage, I utilized wire framing techniques to enhance both the Cold Shower process and the home screen interface.
Styles & Components
In selecting the design elements, I leveraged the Stark app to identify an accessible color palette. Additionally, I opted for the modern Inter typeface to convey a contemporary tone. To ensure consistency across pages, I also created components for each page as part of the design system.
Iteration 1: High Fidelity Prototype
After creating a design system and UI components, I proceeded to develop a set of interactions aimed at enhancing the user experience. This led to the first iteration of the Wim Hof Mobile Prototype, which incorporates the aforementioned components.
Usability Testing
I utilized Maze as an unmoderated testing tool to gather user feedback on the Wim Hof mobile application. The heat maps revealed that users were successfully navigating to the 20 Day Cold Shower Challenge. Additionally, the users provided positive feedback on the application and suggested ways to further enhance the user experience.
Test outcomes
After testing the prototype, it was observed that users preferred a simplified interface while navigating the home page, leading to improved user retention and satisfaction.
Next steps and Final High Fidelity Prototype
Herein presented is the final version of the High Fidelity Prototype, which underwent multiple iterations based on user feedback. The resulting improvements include the following:
Uniform sizes of header images.
Better spacing and alignment throughout the application
Improved accessibility of text in the navbar.
Enhancement of Guided Cold Shower overlay.
Three key learnings
1. Gaining an understanding of the user and business pain points enabled a more clear and insightful approach to finding a solution.
2. Ensuring uniformity in UI components and layouts holds great importance in enhancing accessibility for users.
3. The interface's simplicity was positively received by a significant number of our users.