Peak
Case Study of Creating the Peak Responsive Website
Peak allows women to
feel empowered through fitness, nutrition and wellness whenever and wherever
they go.
Sulaksana Sabaratnam
Brand Management
UX Designer
01/25 - 02/25
Launch Date TBD
The Peak platform was initially introduced through a mobile app designed to offer personalized online training programs, wellness resources, and ongoing support for women aged 18-60. The app focuses on empowering users to achieve a holistic sense of wellness through fitness, nutrition, and mental health.
​
Following the success of the mobile app creation and its branding, this project extends the Peak experience by developing a responsive website. The goal is to ensure seamless user interaction across medium, large, and extra-large screens while maintaining the core principles of accessibility, intuitive design, and motivational content.
​
Key Highlights:
-
Designing a fully responsive website that adapts to multiple screen sizes (medium, large, and extra-large).
-
Ensuring intuitive navigation and accessibility to enhance the overall user experience.
-
Delivering motivational, actionable content to support users’ fitness, nutrition, and mental health goals.
-
Transferring and expanding the established branding and design from the mobile app to a web-based platform.
01 The Problem & The Goal
I was initially responsible for developing the branding and design for the Peak mobile app, which focused on helping busy women manage their fitness and wellness goals despite hectic schedules. Building on the previous project, this current phase involved extending the user experience to a responsive website that includes additional features to enhance the overall service.
The Problem
Busy women who are consumed by taking care of their families, school, household chores or their career find achieving their fitness and wellness goals near impossible with constantly changing schedules.
The Goal
To create a fitness and wellness application that will let users have 24 hour access to online educational material along with follow along workouts which will allow users to exercise and experience self-care whenever and wherever it is most convenient to them. The platform will have a number of tools and features to help keep users motivated and accountable for their fitness and wellness journey.
02 Research & Pain Points
A study was conducted in the initial phase of the project through a focus group of five women to assess the demand for a community-driven platform where users and clients could purchase programs, access educational content and tips, and follow workouts at their own convenience. The research findings confirmed that the platform's features would meet the needs of a broad audience of women.
Identified Pain Points
Programs & One-on-One Training is Too Expensive
1
Hard to Stay Motivated and Accountable
2
Lack of Guidance for Exercise Programs & Self Care Strategies
3
Lack of Direction after Purchase
4
"I wish more things revolved around my schedule!"
"I can't afford to keep doing personal training."
"These programs are so hard to follow and there is never enough support to keep you going."
Just wait till you try
Who is it for?​​​
Peak is for ​women who...
Have busy schedules
Want to feel better about their bodies
Don't want to break the bank
Want to improve their nutrition and mental health
03 Wireframes & Prototypes
First, I created paper wireframes for various screen sizes, including small screens for mobile devices, medium screens for tablets, and large/extra-large screens for laptops and desktops.
Then, I transitioned to creating digital wireframes in Figma, utilizing the Bootstrap grid system to ensure a consistent layout across all screen sizes. This allowed me to refine the design and focus on delivering a seamless, intuitive user experience. ​
04 Usability Study & Findings
Digital wireframes were created in Figma, refining the design to ensure a smooth and intuitive user experience.
An unmoderated usability study remotely with a pool of five women.
The Goal
To evaluate the website's user-friendliness, assess whether it provided enough tools to support users, and determine if it helped with accountability through easy access to a variety of guided workouts and supportive material.
​
Findings
1
Navigation was very easy, but found the chevrons to be too small to click
2
Platform has great tools and users would use the app to attain fitness goals
Goal
Make action points more user friendly.
05 Mock-Ups & Hi-Fi Prototype
Based on the insights gathered from the usability study, I refined and developed the final mockups, adjusting the high-fidelity prototype to address key user pain points and improve the overall user experience.
06 The Takeaway
The biggest takeaway from this project was the value of having thoroughly completed the mobile app in the earlier stage. This initial phase, rooted in a mobile-first philosophy, allowed me to address many of the challenges and fine-tune key aspects of the design, which made the transition to the responsive website much smoother.
By focusing on the mobile app first, I ensured that the core features and structure were optimized for smaller screens, which later made it easier to expand and adapt those elements for a larger screen layout. With the added space of the website, I could focus on organizing and prioritizing the most important information, creating a more spacious and intuitive design, while maintaining the functionality and user experience established in the mobile app.