fitbusy
Stay fit anywhere anytime
CASE SUMMARY
CHALLENGE
SOLUTION
BUSINESS OPPORTUNITIES
Our fitness app has several business opportunities, including capitalizing on the growing demand for fitness and wellness, generating revenue through subscription-based models and in-app advertisements, establishing strategic partnerships with fitness influencers and gyms, and collecting valuable user data for analysis and sale to third-party companies.
Although the fitness app market is saturated, users still encounter challenges, such as setting and achieving goals, tracking and managing data, generic fitness plans without personalized guidance, a lack of in-app coaching support, struggling to stay motivated and engaged, privacy and security concerns with personal data, and difficulty integrating the app with other tools and services.
A Responsive fitness app that offers personalized meal plans, activity and food tracking, and a certified trainer connection. By prioritizing user convenience and personalization, an intuitive and easy-to-use app that provides progress tracking, personalized coaching, and motivation to help users achieve their fitness and nutrition goals effectively.
PROJECT OVERVIEW
Fitbusy is designed to help users improve their overall health and wellness. The app offers a range of features including activity and food tracking, personalized meal plans, and a certified trainer connection. Designed with a user-first approach, the app is convenient and easy to use, providing users with personalized meal plans based on their fitness goals and dietary preferences. Users can track their progress and connect with certified trainers for personalized coaching and guidance. With a focus on convenience, personalization, and motivation, this web app is an effective tool for improving overall fitness and nutrition.
MY ROLE
TOOLS USED
UX Researcher &
UI/UX Designer
Balsamiq, Figma, Marvel,
Optimal Workshop, Miro
Usability Hub
DURATION
PROJECT
~ 8 months
Responsive web app
Note* This is a conceptual mobile app, fitbusy is not a real company.
.png)
01
EMPATHIZE
MARKET RESEARCH
I used a user-centered design approach, researched user needs, created personas and user stories, and tested low, mid, and high-fidelity prototypes. I conducted usability tests, heuristic evaluations, and A/B tests to refine the design based on feedback and data. Finally, I collaborated with fellow students to ensure the design implementation aligned with the design specifications and user experience guidelines. The final design aligns with user experience guidelines, is user-friendly and visually appealing, and meets business goals.
COMPETITOR ANALYSIS
I analyzed the competition in the fitness app market by evaluating its features, UI, and user experience. I also conducted a SWOT analysis and gathered user feedback to identify areas for improvement and create a unique value proposition for my app.
USER RESEARCH
I used qualitative and quantitative methods to gather information about users' demographics, usage patterns, and pain points. This included an online survey and in-depth interviews with a subset of users. I used affinity mapping to analyze and synthesize the data, grouping it into themes and patterns to identify key insights and prioritize design features.
USER SURVEYS & INTERVIEWS
Surveys and interviews were carried out via Google Forms.
16 participants were recruited for the survey.
7 persons were recruited for interviews
In both cases, each participant was asked a set of 11 questions.
KEY INSIGHTS
-
The majority of users require a solution to take care of their health without interfering with their hectic schedules because one of the most common struggles is finding enough time to do healthy things for their bodies.
-
Users want to consult experts and be directed by them.
-
Many different motivational strategies are preferred by users.
-
To stay motivated, users want to see improvements in their health.
-
Users demand access to tailored information depending on their current situation.
-
Users want the ability to rearrange the features according to their preferences.
-
Most of the users want an ad-free, free subscription.
-
The majority of users are worried about giving their medical information, but we can reassure them by explaining our privacy policy.
-
The majority of consumers are more worried about their physical health than their mental health. So, physical fitness will be our major priority.
-
Users want an app that is easy to use, not too complicated, and aesthetically beautiful.
-
Users need an app that accurately records their present routines and aids in the development and maintenance of new ones.
02
DEFINE
USER RESEARCH
I created two user personas based on data from interviews and surveys. These personas represent distinct user groups with unique goals, pain points, and behaviors. By designing for these personas, I created a user-centric experience that meets their specific needs and preferences. I continually referred to these personas throughout the design process to ensure effectiveness, efficiency, and enjoyment for my target users.
USER JOURNEY
I created a User Journey to empathize with my user persona, Bryan. The journey visually depicts a typical day for Bryan, who works in a stressful atmosphere and wants to book a call with experts to seek advice on quick physical activities and wholesome recipes to stay fit and energized despite his busy schedule.
USER FLOW
I created two user flows to reflect the primary tasks of my target audience. The first flow allows users to quickly and easily book a call with their preferred personal trainer, specifying their preferred time, date, and payment details. The second flow is designed to track user activity, helping to motivate and engage them on their fitness journey by providing a streamlined way to monitor progress and view activity history. Both flows prioritize simplicity, clarity, and ease of use for the user.
03
IDEATE
SITE MAP
I generated potential solutions by designing a sitemap and using a digital open card sorting test to evaluate ideas. Participants sorted cards into groups, helping me create a well-structured and intuitive app framework.
Based on the insights gathered from the card sorting test, I implemented a revised sitemap, which allowed me to refine the navigation and improve the user experience of the app.
I created an initial sitemap at the beginning of the design process, which helped me organize the app's content and navigation elements.
To evaluate and refine the structure of the app, I implemented a digital open card sorting test in my case study, where participants were asked to sort cards into groups that made sense to them and create titles for each group, providing valuable insights into user preferences and behaviors.
SITE MAP
CARD SORTING
REVISED SITEMAP
REVISED SITEMAP
WIREFRAMES
SKETCHES
I created low-fidelity wireframes to quickly visualize the key screens and features of the app. This approach helped me identify potential usability issues early on and make informed design decisions before moving on to more detailed designs.
MID-FIDELITY WIREFRAMES
I used mid-fidelity wireframes to refine the visual layout of the app's key screens and features, adding more details to the design. These wireframes helped me gather user feedback on the app's usability and aesthetics, enabling me to make informed design decisions and ensure that the app met users' needs.
04
PROTOTYPE & TEST
USABILITY TESTING
I conducted moderated remote usability testing with six participants from my personal network to evaluate the prototype's navigation and user journeys. The participants were given a set of scenarios and asked to complete tasks using the app. The test script is linked here.
I used Hangouts to record the screen and audio, which helped me capture valuable feedback and body language cues. The testing session lasted longer than expected, but it provided me with useful insights and suggestions for improvement. All participants showed interest in the app and scrutinized each component and page. The testing process was informal and comfortable, allowing participants to ask questions and provide detailed feedback.
ISSUES & SOLUTIONS
ISSUE 1: Confused navigating the food plan (High)
I renamed ‘Food’ on the homepage to ‘Add Food’ and ‘Food’ on the navigation bar to ‘Plans’
ISSUE 2: Replace find trainer button and move the trackers upward (High)
Firstly, I added an icon with the label "trainers" to the navigation bar (as previously there were 4 icons on the navigation bar). Then on the homepage, I moved the trainer button downward and brought the trackers upward. These modifications were aimed at enhancing the user experience by improving the ease of navigation and accessibility of the trainer and tracker functionalities.
ISSUE 3: The summary box needs to be more appealing and understandable (High)
To make the summary box more visually appealing and comprehensible, I sought inspiration from other apps and updated the design accordingly. The new design was aimed at enhancing the overall user experience by providing a clear and concise overview of the information presented in the summary box.
ISSUE 4: Unsatisfied with the accuracy of activity tracker (High)
The app was previously only taking input about the duration, which resulted in users expressing dissatisfaction with its accuracy. To address this, I incorporated two additional input fields for speed and distance to provide more accurate results and increase user confidence in the app's accuracy. By adding these new fields, users can now provide more comprehensive input, which will result in more precise and trustworthy output.
ISSUE 5: Confused about where the appointment will be saved (Medium)
To enhance the user experience, I made two modifications to the appointment booking process. Firstly, I added a confirmation message to reassure users that their call with a trainer had been successfully booked. Secondly, I displayed the appointment on the trainers' page, above the list of available trainers. This change was aimed at increasing user convenience by providing easy access to their scheduled appointments and reducing the likelihood of any confusion or scheduling errors.
05
REFINE
Refining my design involved several iterative processes. I started by applying Gestalt's law, which helped me to organize the design elements in a way that would be easily understandable to users. I also paid attention to accessibility design, making sure that my design would be usable by everyone, regardless of their abilities.
Next, I focused on responsive design techniques, to ensure that the design works seamlessly on different screen sizes and devices. I also incorporated material design principles, creating a consistent design language that aligns with modern design trends.
But my work didn't stop there. I knew that collaboration was key to refining my design, so I shared my app with my peer group to gather feedback and make improvements. They suggested me some necessary changes to create a user-friendly and visually appealing experience.
Through this journey, I learned the importance of continuously refining the design, listening to feedback, and working collaboratively with other stakeholders. These practices not only made my design better but also improved my skills as a UX designer.
DESIGN SYSTEM
LOGO
The logo contains text with the font Zen dot and a kettlebell. For use in large screen headers and any other applicable web or print materials.
Dimensions: The logo may be resized according to need but should never deviate from the below aspect ratio or be stretched or compressed to fit a container. The logo will have a fill of Hex white and brand colors against a dark background #1A1B1E. It may also have a white fill against a background of linear background #EF1A40, #DC0386, #A200E0.
TYPOGRAPHY
Archivo Black is the main typeface used when available. The hierarchy of font is shown through size, boldness, and emphasis on type.
Archivo Narrow is the secondary typeface used when available. The hierarchy of font is shown through size, boldness, and emphasis on type.
Inter is the body typeface used when available. The hierarchy of font is shown through size, boldness, and emphasis on type.
COLOR SCHEME
STACKED CARDS
NAVIGATION BAR
The navigation bar is placed at the bottom of the App. Within the navigation bar, the icons change color from White (#FFFFFF) to Green Accents (#03DAC5), if the relevant Section is opened. The background of the Navigation bar is Grey (#2F3032).
HORIZONTAL CARDS
LANGUAGE TONE & GUIDELINES
Fitbusy language has a causal tenor while nevertheless being informative. It is friendly and welcoming, free of profanity, allowing users to feel at ease while working on their fitness. Many of the displays are light on text and use simply readable language to maintain a light app. Although it should be simple to understand and translate for readers in various nations, the material itself should still have a formal language.
TONE OF VOICE DO'S/DON'T
DO:
Have the tone throughout light and friendly.
Keep it clear and direct.
DON'T:
Use a tone that is abrasive or arrogant.
Use expletives or anything derogatory
ACCESSIBILITY GUIDELINES
TEXT
-
The text should be readable with the help of assistive technologies such as screen readers, etc.
-
There should be a good amount of weight while using semantic badges.
ATTRIBUTES
Use a label with every component and use a default value on initialization.
.png)
.png)
.png)
MY APP IMPRESSION
Please enjoy the video guide of my app, and take some time to explore it. Keep in mind that it's still a work in progress, but it should provide you with a good sense of the app's functionality and purpose. I'm always open to feedback and would love to hear your thoughts on the experience!"
Next Steps
-
Track the metrics listed on the right-hand side to gauge the app's effectiveness.
-
Further develop the desktop version.
-
Incorporate additional screens into the app, including user profiles, leader board, progress, guided exercises, calls with trainers, and recommended food recipes.
-
Collaborate with gyms to monetize the app by offering memberships and allowing users to purchase credits to access gym classes and communicate with trainers.
Reflection
During the UX case study for our app design, I've come to realize that user experience is at the heart of everything we do. Through this process, I've learned the importance of truly understanding our users, their needs, and their behaviors.
As a UX Designer, I've had the opportunity to conduct extensive research, including user interviews, surveys, and user testing. This research allowed me to gain insights into what my users want and need from my app, and I was able to make informed design decisions based on their feedback.
Creating user flows and wireframes was a significant part of this process. I learned that it's important to keep the user journey in mind when designing and to create intuitive and easy-to-use interfaces that meet their needs.
Throughout the design process, I continually tested my prototypes with real users, which helped me identify areas for improvement and ensure that my designs were meeting the needs of my users.
Overall, this UX case study has taught me that designing a successful app requires a deep understanding of the users, their needs, and their behaviors. Through research, testing, and iteration, I was able to create an app that provides a great user experience and meets the needs of our users.