Outset Wellness: Re-designing an onboarding for better user engagement
Outset Wellness: Re-designing an onboarding for better user engagement
Role
Sole UX/UI Designer
Timeline
Oct 2024 - Dec 2024
Industry
Health & Wellness
Team
1 UX Designer
1 Illustrator
2 Developers
Role
Sole UX/UI Designer
Timeline
Oct 2024 - Dec 2024
Industry
Health & Wellness
Team
1 UX Designer
1 Illustrator
2 Developers
About Outset Wellness
Outset Wellness helps users build lasting wellness habits while staying true to its mission of making fitness an enjoyable and achievable in everyday life. The app offers tailored wellness plans, goal tracking, and mindfulness resources to encourage users to prioritize their physical and mental well-being.
Outset Wellness helps users build lasting wellness habits while staying true to its mission of making fitness an enjoyable and achievable in everyday life. The app offers tailored wellness plans, goal tracking, and mindfulness resources to encourage users to prioritize their physical and mental well-being.
My role and impact at Outset Wellness
Research:
Research:
Analysed industry trends and competitor onboarding strategies, synthesizing insights into actionable design strategies to address user pain points and opportunities.
Analysed industry trends and competitor onboarding strategies, synthesizing insights into actionable design strategies to address user pain points and opportunities.
Usability Testing:
Usability Testing:
Iterated designs based on user feedback to optimize engagement and retention.
Iterated designs based on user feedback to optimize engagement and retention.
Design:
Design:
Led the on-boarding redesign process, developing wireframes and high-fidelity prototypes to ensure an intuitive and engaging user experience. Prepared detailed design files for seamless developer handoff.
Led the on-boarding redesign process, developing wireframes and high-fidelity prototypes to ensure an intuitive and engaging user experience. Prepared detailed design files for seamless developer handoff.
Dev Handoff:
Dev Handoff:
Prepared detailed design files, interaction specifications, and documentation to ensure a smooth transition from design to development, facilitating clear communication and implementation.
Prepared detailed design files, interaction specifications, and documentation to ensure a smooth transition from design to development, facilitating clear communication and implementation.
Why redesign the onboarding flow?
Users found the onboarding process cluttered and confusing, leading to lower retention and reduced motivation to explore Outset Wellness’s offerings.
Users found the onboarding process cluttered and confusing, leading to lower retention and reduced motivation to explore Outset Wellness’s offerings.
The onboarding experience failed to provide a seamless introduction to the platform. Users were presented with too much information at once, making it difficult to absorb key details. Instead of feeling encouraged to engage with the platform, they often skipped through or abandoned the process altogether.
The onboarding experience failed to provide a seamless introduction to the platform. Users were presented with too much information at once, making it difficult to absorb key details. Instead of feeling encouraged to engage with the platform, they often skipped through or abandoned the process altogether.
For this project to succeed, I needed to identify clear pain points that would guide my design decisions and ensure meaningful improvements in the user experience.
For this project to succeed, I needed to identify clear pain points that would guide my design decisions and ensure meaningful improvements in the user experience.
It always starts from the people
I conducted virtual usability testing sessions for previous onboarding with each participant individually, completing 5 session in total.
I conducted virtual usability testing sessions for previous onboarding with each participant individually, completing 5 session in total.
Usability testing sessions
User Pain Points
Through usability testing and user feedback, I uncovered key issues:
Through usability testing and user feedback, I uncovered key issues:
The value of the app and its benefits was not communicated effectively.
The value of the app and its benefits was not communicated effectively.
The onboarding flow did not effectively highlight the app's personalization features.
The onboarding flow did not effectively highlight the app's personalization features.
Users skipped reading important content and rushed through selections.
Users skipped reading important content and rushed through selections.
Research & Competitive Analysis
To better understand the landscape, I conducted a competitive analysis of leading wellness apps.
To better understand the landscape, I conducted a competitive analysis of leading wellness apps.
Noom
Noom
Gentler Streak
Gentler Streak
Calm
Calm
Headspace
Headspace
Key takeaways included:
Key takeaways included:
Progress indicators improved onboarding completion rates.
Progress indicators improved onboarding completion rates.
Concise and engaging microcopy enhanced user understanding.
Concise and engaging microcopy enhanced user understanding.
Well-structured and visually distinct options made decision-making more intuitive and effortless.
Well-structured and visually distinct options made decision-making more intuitive and effortless.
Auditing the current onboarding
Navigation
The onboarding flow follows a linear progression, making it easy to follow. However, some steps feel lengthy and require high cognitive effort, especially when users are asked to input their wellness goals and preferences.
The onboarding flow follows a linear progression, making it easy to follow. However, some steps feel lengthy and require high cognitive effort, especially when users are asked to input their wellness goals and preferences.
Functionality
A core functionality issue is the calendar integration setup, which is introduced during onboarding but lacks context on how it benefits users. Users may hesitate to sync their calendars without understanding how it enhances their wellness experience within the app.
A core functionality issue is the calendar integration setup, which is introduced during onboarding but lacks context on how it benefits users. Users may hesitate to sync their calendars without understanding how it enhances their wellness experience within the app.
Visual Design
The colour palette and typography align well with the wellness theme, creating a calm and inviting atmosphere. However, the onboarding screens are heavily text-based, which can make the experience feel tedious. A more balanced mix of text and visuals could also reduce cognitive load and improve comprehension.
The colour palette and typography align well with the wellness theme, creating a calm and inviting atmosphere. However, the onboarding screens are heavily text-based, which can make the experience feel tedious. A more balanced mix of text and visuals could also reduce cognitive load and improve comprehension.
So what to do about it?
Translating Insights into User-Friendly Interfaces
Translating Insights into User-Friendly Interfaces
With key insights from research, the next step was to envision how the improved onboarding experience would take shape. A major consideration was designing within the existing framework of the Outset Wellness app while enhancing clarity and engagement.
With key insights from research, the next step was to envision how the improved onboarding experience would take shape. A major consideration was designing within the existing framework of the Outset Wellness app while enhancing clarity and engagement.
The blueprint for better designs
Shaping the onboarding with low-fidelity wireframes
Shaping the onboarding with low-fidelity wireframes
Low-fidelity wireframes were designed to outline the core elements and interactions crucial for a seamless onboarding experience.
Low-fidelity wireframes were designed to outline the core elements and interactions crucial for a seamless onboarding experience.
Adding icons to selection options to improve visual appeal and make the decision process more intuitive
Including user testimonials with names, ages, and profile photos to add credibility and foster connection
Displaying real-time updates while preferences are being saved to help users understand the progress and reduces uncertainty
A subtle gradient effect adds a sense of exclusivity and highlights the unlocking process for premium features
A visual timeline explains the trial period, helping users better understand the value and flexibility of their plan
Providing an option to sync with the user's calendar while allowing them to skip ensures a seamless yet non-intrusive experience
The blueprint for better designs
Shaping the onboarding with low-fidelity wireframes
Low-fidelity wireframes were designed to outline the core elements and interactions crucial for a seamless onboarding experience.
Adding icons to selection options to improve visual appeal and make the decision process more intuitive
Including user testimonials with names, ages, and profile photos to add credibility and foster connection
Displaying real-time updates while preferences are being saved to help users understand the progress and reduces uncertainty
A subtle gradient effect adds a sense of exclusivity and highlights the unlocking process for premium features
A visual timeline explains the trial period, helping users better understand the value and flexibility of their plan
Providing an option to sync with the user's calendar while allowing them to skip ensures a seamless yet non-intrusive experience
FInal Solution - Part 1
Enhancing onboarding for a personalized wellness experience
Enhancing onboarding for a personalized wellness experience
I wanted to ensure that users understood the value of Outset from the very first interaction. The integration of engaging visuals and interactive elements made the journey more intuitive and motivating.
I wanted to ensure that users understood the value of Outset from the very first interaction. The integration of engaging visuals and interactive elements made the journey more intuitive and motivating.
Landing Screen
Landing Screen
Clear messaging and visual elements help users understand how Outset can assist in building a personalized wellness plan, reducing the friction in the onboarding process.
USP Videos
USP Videos
To effectively communicate Outset’s unique value, we incorporated a dynamic video walkthrough.
Welcome Screen
Welcome Screen
A friendly and engaging welcome screen sets the tone, encouraging users to take the first step in their wellness plan.
Initial iterations - Part 1
Some of the initial iterations and the reasons why they didn't work
Some of the initial iterations and the reasons why they didn't work
I mapped out the flow and conducted concept testing via Google Meet sessions, uncovering the following issues.
I mapped out the flow and conducted concept testing via Google Meet sessions, uncovering the following issues.
The design felt static, missing elements that could enhance clarity and engagement.
Before
After
The integration of engaging visuals ensured that the value of Outset was conveyed on the first interaction.
The integration of engaging visuals ensured that the value of Outset was conveyed on the first interaction.
Initial iterations - Part 1
Some of the initial iterations and the reasons why they didn't work
I mapped out the flow and conducted concept testing via Google Meet sessions, uncovering the following issues.
The design felt static, missing elements that could enhance clarity and engagement.
Before
After
The integration of engaging visuals ensured that the value of Outset was conveyed on the first interaction.
FInal Solution - Part 2
Guiding users with a thoughtful onboarding journey
The onboarding experience was crafted to reduce friction, build trust, and inspire action.
Understanding the struggles
By presenting relatable challenges in a clear and structured way, we help users recognize how Outset can support their wellness goals, making the onboarding experience feel relevant and personalized.
User testimonial
Incorporating user testimonials with engaging visuals reinforces credibility and provides reassurance, fostering a sense of community and motivation from the start.
Building a routine for the users
A thoughtfully designed flow encourages users to build their wellness routine step by step, reducing friction and making the process feel natural and achievable.
Initial iterations - Part 2
Bringing clarity and engagement in onboarding
Designing a more visually engaging and intuative selection experience
Through iterative design improvements and user feedback, we refined the onboarding experience to make it more intuitive, visually engaging, and aligned with user needs.
The initial design relied on plain checkboxes, making the interface feel static and less engaging. Users found it difficult to connect with the content.
Before
After
Introduced visual enhancements, such as icons and interactive buttons, to create a more dynamic and user-friendly experience.
Version 1
Traditional checkbox format, offering minimal visual engagement.
Version 2
Shifted to card-based selections, improving clarity but needing better hierarchy.
Version 3
A polished version with a clear structure, better spacing, and improved interaction.
FInal Solution - Part 3
Optimizing the process for engagement
By integrating guided progress indicators, tailored wellness plans, and user-specific recommendations, it makes easier for users to take action from the very first interaction.
Loading screen
This screen reassures users that their preferences and availability are being considered while their personalized wellness plan is built.
Weekly activities plan
A timeline format enhances clarity and usability and Interactive elements allow users to preview and adjust their schedules.
Plan selection
A step-by-step guide explains when users will be charged, eliminating ambiguity.
Initial iterations - Part 3
Refining plan selection details for clarity and ease
By improving visual hierarchy and adding clear step-by-step guidance, we ensured users could easily understand their options and make confident choices.
Originally, the step-by-step process was positioned at the bottom, but it wasn’t easily accessible for users with smaller screens.
Before
After
To enhance accessibility and provide a clearer overview of the free trial at first glance, we repositioned it at the top in the final iteration.
FInal Solution - Part 2
Guiding users with a thoughtful onboarding journey
The onboarding experience was crafted to reduce friction, build trust, and inspire action.
Understanding the struggles
By presenting relatable challenges in a clear and structured way, we help users recognize how Outset can support their wellness goals, making the onboarding experience feel relevant and personalized.
User testimonial
Incorporating user testimonials with engaging visuals reinforces credibility and provides reassurance, fostering a sense of community and motivation from the start.
Building a routine for the users
A thoughtfully designed flow encourages users to build their wellness routine step by step, reducing friction and making the process feel natural and achievable.
Initial iterations - Part 2
Bringing clarity and engagement in onboarding
Through iterative design improvements and user feedback, we refined the onboarding experience to make it more intuitive, visually engaging, and aligned with user needs.
The initial design relied on plain checkboxes, making the interface feel static and less engaging. Users found it difficult to connect with the content.
Before
After
Introduced visual enhancements, such as icons and interactive buttons, to create a more dynamic and user-friendly experience.
Designing a more visually engaging and intuative selection experience
Version 1
Traditional checkbox format, offering minimal visual engagement.
Version 2
Shifted to card-based selections, improving clarity but needing better hierarchy.
Version 3
A polished version with a clear structure, better spacing, and improved interaction.
Initial iterations - Part 2
Bringing clarity and engagement in onboarding
Designing a more visually engaging and intuative selection experience
Through iterative design improvements and user feedback, we refined the onboarding experience to make it more intuitive, visually engaging, and aligned with user needs.
The initial design relied on plain checkboxes, making the interface feel static and less engaging. Users found it difficult to connect with the content.
Before
After
Introduced visual enhancements, such as icons and interactive buttons, to create a more dynamic and user-friendly experience.
Version 1
Traditional checkbox format, offering minimal visual engagement.
Version 2
Shifted to card-based selections, improving clarity but needing better hierarchy.
Version 3
A polished version with a clear structure, better spacing, and improved interaction.
FInal Solution - Part 3
Optimizing the process for engagement
By integrating guided progress indicators, tailored wellness plans, and user-specific recommendations, it makes easier for users to take action from the very first interaction.
Loading screen
This screen reassures users that their preferences and availability are being considered while their personalized wellness plan is built.
Weekly activities plan
A timeline format enhances clarity and usability and Interactive elements allow users to preview and adjust their schedules.
Plan selection
A step-by-step guide explains when users will be charged, eliminating ambiguity.
Initial iterations - Part 3
Refining plan selection details for clarity and ease
By improving visual hierarchy and adding clear step-by-step guidance, we ensured users could easily understand their options and make confident choices.
Originally, the step-by-step process was positioned at the bottom, but it wasn’t easily accessible for users with smaller screens.
Before
After
To enhance accessibility and provide a clearer overview of the free trial at first glance, we repositioned it at the top in the final iteration.
Initial iterations - Part 3
Refining plan selection details for clarity and ease
By improving visual hierarchy and adding clear step-by-step guidance, we ensured users could easily understand their options and make confident choices.
Originally, the step-by-step process was positioned at the bottom, but it wasn’t easily accessible for users with smaller screens.
Before
After
To enhance accessibility and provide a clearer overview of the free trial at first glance, we repositioned it at the top in the final iteration.
Outcomes
Enhanced clarity & engagement: The refined onboarding experience made it easier for users to understand and interact with the app, leading to a smoother first-time experience.
Stronger user adoption: By integrating interactive elements and personalization, the design fostered a sense of connection, making it more likely for users to stay engaged.
Enhanced clarity & engagement: The refined onboarding experience made it easier for users to understand and interact with the app, leading to a smoother first-time experience.
Stronger user adoption: By integrating interactive elements and personalization, the design fostered a sense of connection, making it more likely for users to stay engaged.
Reflections
Navigating ambiguity in a fast-paced startup: The product vision evolved rapidly, requiring me to stay adaptable while ensuring that design decisions aligned with user needs and business goals.
Managing shifting priorities: With new insights emerging frequently, priorities often shift. I focused on maintaining clarity by documenting decisions, facilitating discussions, and ensuring alignment across stakeholders to prevent design drift.
Iterating based on real-world feedback: Unlike a traditional design process, this project required constant iteration based on immediate feedback from stakeholders and potential users. This taught me to work in a more agile, iterative manner while keeping the broader product vision in mind.
Navigating ambiguity in a fast-paced startup: The product vision evolved rapidly, requiring me to stay adaptable while ensuring that design decisions aligned with user needs and business goals.
Managing shifting priorities: With new insights emerging frequently, priorities often shift. I focused on maintaining clarity by documenting decisions, facilitating discussions, and ensuring alignment across stakeholders to prevent design drift.
Iterating based on real-world feedback: Unlike a traditional design process, this project required constant iteration based on immediate feedback from stakeholders and potential users. This taught me to work in a more agile, iterative manner while keeping the broader product vision in mind.
2025
Designed by Manasi with passion, late nights, and an endless obsession with the little details.
2025
Designed by Manasi with passion, late nights, and an endless obsession with the little details.
2025
Designed by Manasi with passion, late nights, and an endless obsession with the little details.