Our team, reconnecting after 1.5 years of COVID lockdown, talked about the challenges we faced during COVID. One common challenge was appearance-related anxieties due to limited physical activity. Inspired, we decided to build a wellness app to help others with similar struggles.
Many people have physical features they dislike, but for some, this dissatisfaction becomes an overwhelming obsession, leading to severe anxiety and loss of self-confidence. This can escalate into Body Dysmorphic Disorder (BDD), where individuals become fixated on perceived flaws in their appearance, significantly disrupting their personal, social, and professional lives.
Empower individuals suffering from Body Dysmorphic Disorder (BDD) by providing accessible tools and resources to help them understand, manage, and overcome their appearance-related anxieties. We aim to connect users with professional guidance while fostering a supportive environment for personal growth and self-acceptance.
We started off with primary research by carrying out a thorough literature review of 20 papers on the topic. We then shifted our focus towards secondary research, conducting 10 semi-structured interviews, 7 contextual inquiries, 1 survey, and a couple of focus groups.
Studies consistently showed that social media's portrayals of idealized physiques significantly influence body dissatisfaction in both sexes.
While most previous work has done great work in diagnosing BDD, often using different methods, there was not significant focus on its treatment or intervention strategies.
Impact on Daily Life: Many participants shared that their BDD symptoms deeply affected their routine.
Social Isolation: In focus groups, several participants highlighted that they avoid social gatherings because they constantly feel judged.
Influence of Social Media: During contextual inquiry, some people in the gym felt a tendency to keep comparing themselves with bigger people.
Barriers to Seeking Help: Interviews revealed a reluctance to seek professional support and preferred something more private.
We came up with the features that will be included in our product according to the needs of the users.
After brainstorming, we came up with 3 design alternatives: a Web application, a smartwatch, and a mobile application.
To ensure a seamless link between users and the product, we created scenarios & storyboards to illustrate potential user interactions with our product.
Sam sees a social media post of a “perfect male body” and feels insecure. After researching workout apps, he finds ours and chooses a plan suited to his goals. He follows the plan daily and eventually notices positive changes in his body, which boosts his confidence.
Sasha, a 21-year-old student, feels insecure about her nose and searches for ways to cope. She finds and downloads the app, choosing the self-assessment option. After completing the questionnaire, she learns about BDD, how her symptoms align with it, and where she stands on the BDD scale. Informed about her condition, Sasha receives recommendations for overcoming BDD, making her feel more empowered.
After developing a proper understanding of user needs and what our product will entail, we developed a lo-fi paper prototype which efficiently checked and tested the functionality of our app.
We tested 5 workflows by asking the users to complete each task with the think-aloud protocol. We observed user frustrations and measured different metrics - one of them was average task completion time in seconds. Post-testing, users were asked to rate their overall experience for each task and suggest improvements. The insights from user testing enabled us to refine and improve our workflows and designs.
For this project, Figma was used to design the high-fidelity prototype, ensuring a smooth and responsive user experience. Based on feedback from usability testing, adjustments were made to the interface, such as improving navigation flow and refining button placements. The prototype adhered to material design guidelines for consistency and accessibility. A clean inter typeface was chosen for readability, and a calming color pallete of green on white was selected to create a non-intrusive atmosphere.
SOS Button: Placing the SOS button in the top right corner ensures it’s visible yet not overly intrusive. This decision balances accessibility for emergencies without making it the focal point, to avoid adding stress for users unless they need it.
Features Grid: The choice to display the tools in a grid format keeps the home screen organized and minimizes cognitive load. Each tool has a clear, distinct icon, allowing users to quickly recognize each function. The simplicity of the grid structure also makes it easier for users to locate specific features without needing to scroll.
Upcoming Reminders: Presenting upcoming activities directly on the home screen supports users in staying organized with their wellness routines. By including a “Log Details” button, users can record their progress or make changes effortlessly, promoting regular engagement with their plans and support activities.
Bottom Navigation Bar: The icons chosen for the bottom navbar follow standard conventions for “Home”, “Calendar”, “Community”, and “Settings” sections, making navigation more intuitive. This design choice leverages familiar icons to reduce learning time for new users, aligning with usability principles.
Search & Filter: The search functionality allows users to quickly locate a specific nutritionist by name, while filters can help narrow down results by rating or other criteria. This decision simplifies the experience for users with specific preferences.
Profile Cards: Each nutritionist is presented with a small card that includes their photo, rating, and reviews. These cards allow users to get an overview and make comparisons without needing to open each profile. This compact, card-based approach saves time and streamlines the decision-making process.
Profile Information: Key metrics like experience, number of treatments, and star rating are displayed prominently to help users quickly assess the nutritionist’s expertise. This decision supports users in making confident choices without needing to scroll or search further.
Calendar Layout: A calendar view allows users to see a broad view of available days at a glance, making it easy to choose an appointment date. This design choice avoids the need to scroll through multiple options, enhancing efficiency.
Time Slot Selection: Time slots are displayed in individual buttons, with unavailable slots grayed out, making it clear which times are open. This intuitive design helps reduce decision fatigue.
Optional Note Section: Adding a “Note” section encourages users to prepare for their appointment by specifying topics or concerns they want to address. This feature not only personalizes the experience but also enhances communication between users and professionals.
Primary Action Button: The green “Join Support Group” button uses high affordance and stands out against the background, encouraging new users to join with a clear, actionable CTA. This design aligns with conversion-centered design principles by drawing attention to the primary action.
Post and Reactions Layout: Each post includes the user’s profile picture, timestamp, and reactions, following social proof practices. This design mimics familiar social media interfaces, which promote intuitive usability by leveraging users’ existing mental models for interaction.
Engagement Indicators: Reactions are displayed with icons and counts, adding interactivity and fostering a sense of community within the group. The placement of these icons below each post enhances visual flow and makes it easy for users to engage with content.
Post of the Day: Featuring a “Post of the Day” at the bottom of the screen is a great way to highlight positive content and maintain user engagement. The expandable “see more” text helps
manage content density, allowing users to read more if interested without cluttering the screen.
New Group CTA: The floating action button (FAB) for creating a new group is positioned at the bottom right, consistent with other screens in the app. This persistent CTA allows users to easily start a new group, enhancing user empowerment and control.
