biocoach - The world’s first gps for your health

Dorian Knezevic

UX Designer

Product Designer

UI Designer

Atlassian

FigJam

Figma

Health Care

The client

BioCoach aims to support the many people whose poor metabolic health has already caused or is now causing obesity, diabetes, prediabetes, and other chronic health concerns. It offers practical solutions for analyzing one's health, taking charge of it, and never looking back.

The challenge

In tackling BioCoach's assignment, our primary goal was to refine their digital presence comprehensively. This involved meticulous research, strategic planning, creative design, and iterative prototyping. We aimed to position BioCoach as a leader in metabolic health while ensuring accessibility for all users, including those with visual impairments. Through in-depth user research and persona development, we gained insights into the needs of individuals managing conditions like obesity and diabetes: our user-centric design prioritized inclusivity, intuitive navigation, and accessibility features. Incorporating feedback from diverse user groups and conducting usability testing created a seamless and empowering experience for all BioCoach users.

The solution

Our solution for BioCoach centered on a mobile app to revolutionize metabolic health management, emphasizing simplicity, clarity, and innovation. We prioritized functionality and usability through iterative design, integrating gamification elements for enhanced engagement and motivation. Concurrently, we collaborated on brand identity to create a cohesive user experience, empowering BioCoach to transform lives and promote holistic well-being.

Research

During the research phase, we conducted market research and user interviews to understand metabolic health management, uncovering user preferences and pain points. This informed our feature development, leading to a mobile app addressing immediate concerns with innovative solutions. We also performed a competitive analysis to benchmark BioCoach against market solutions. We created a customer journey map to streamline workflows and enhance usability, ensuring a seamless user experience from onboarding to ongoing engagement.
Business Problem
Challenges hindering the company's ability to achieve its goals or objectives.
Issues related to revenue generation, market competitiveness, or operational efficiency.
Obstacles impacting customer retention, brand reputation, or market expansion.
Problems requiring strategic solutions to drive business success and growth.
Design Problem
Specific challenges related to a product or service's design and user experience.
Issues with usability, accessibility, aesthetics, functionality, or overall user satisfaction.
Problems requiring innovative design solutions to enhance the user experience.
Opportunities to improve the design and usability of the product or service to better align with user needs and business objectives.

Customer Journey

In our customer journey analysis, we meticulously mapped out the various touchpoints and interactions from initial awareness to engagement and retention. By immersing ourselves in the user experience, we identified key moments of truth and delight, allowing us to effectively tailor the user experience to meet users' needs and expectations.

Layout

In designing the layout, we prioritized simplicity, clarity, and accessibility by using a hierarchy to guide users through the app. We focused on essential information and actions, optimizing content presentation and minimizing visual clutter to create a visually appealing and intuitive interface that enhances user engagement and usability.
Information Architecture
BioCoach's information architecture emphasized simplicity and intuitiveness, creating a logical hierarchy for easy navigation. We ensured clear pathways to relevant information through thorough analysis, focusing on streamlined labeling and scalability for future growth.
Wireframes
In the wireframing phase, we translated our research findings and information architecture into skeletal outlines of the app's key screens and functionalities. These wireframes served as blueprints for the app's layout and interactions, visually representing the user interface elements and content hierarchy. By focusing on functionality over aesthetics, we refined the user flow and interaction design, ensuring that each screen effectively fulfills its intended purpose in guiding users through their metabolic health management journey.

Visual Design

With Visual Design, we created an aesthetic aligned with BioCoach's brand, focusing on simplicity, clarity, and modernity. We enhanced usability by using vibrant colors, intuitive icons, and spacious layouts while adhering to accessibility standards. We achieved a visually engaging and user-friendly mobile interface through iterative refinement and user feedback.
Octalysis framework
Incorporating the Octalysis framework enriched our understanding of human behavior and motivation by exploring eight core drives. We tapped into users' desires for accomplishment and social interaction by strategically implementing gamification elements like progress tracking and achievements. Balancing challenge and reward, we created an engaging experience that motivated users to participate actively in their metabolic health journey.

Final Design

The BioCoach application's final design reflects thorough research and user-centric principles, boasting intuitive navigation and a calming color palette for accessibility. Gamification elements, including progress tracking and social sharing, enhance engagement, while a consistent design system ensures scalability and collaboration efficiency. With a responsive layout for seamless performance, BioCoach epitomizes our dedication to exceptional user experience, poised to impact users' health journey positively.
We developed a personalized journey for BioCoach's onboarding process that begins with questions to understand the user's health goals, lifestyle, and preferences. Leveraging this data, our system dynamically places users into tailored programs designed to prevent type and how to deal with diabetes. This approach ensures that each user receives a customized experience aligned with their needs and maximizes the effectiveness of BioCoach's intervention programs.
For BioCoach's Home tab, we used gamification and the Octalysis framework to prompt users to complete daily milestones. The Coach feature provides personalized guidance, while the Shop directs users to BioCoach's webshop for health products. The Activity Log is a progress tracker, showing past activities and milestones.
In the Learn tab, users receive education and guidance on managing pre-diabetes and diabetes, adhering to CDC of United States government guidelines. Additionally, users can access the Bonus Collection feature to complete additional tasks and challenges. The design aligns with the CDC's recommendations, ensuring comprehensive support and adherence to established standards for diabetes management.
Users can monitor their health metrics in the Track, integrating with popular health services like Apple Health or Samsung Health for seamless data synchronization. Users can input various readings manually, including glucose levels, weight, mood, ketones, and A1C, and visualize their progress over customizable timelines. This data serves as valuable insights for the coaches, who utilize it to provide personalized recommendations and support. Additionally, users can access a comprehensive view of their data to effectively enhance their health journey.
Users can customize their meal plans in the Food tab according to their dietary preferences, weight goals, and budget through a questionnaire. They receive personalized meal suggestions for at least a week, complete with recipes tailored to their needs. As a convenience, users can opt for instant delivery through Instacart, BioCoach's partner, ensuring groceries are delivered straight to their doorstep.
In the Community section of BioCoach, users can join groups based on their health interests to connect, discuss, and support each other. This section encourages participating in challenges, sharing progress, and celebrating milestones. It's a welcoming space that fosters well-being and motivates users on their health journey.

The result

The BioCoach app's design was key in attracting users and securing a $12.5M CDC Cooperative Agreement. Our user-centric approach created an intuitive interface, enhancing user adoption and satisfaction and positioning BioCoach as a leader in metabolic health. The app continuously evolves, integrating user feedback and advanced technologies to support diabetes prevention and management. Addressing the needs of over 34 million Americans with diabetes and 88 million with pre-diabetes, BioCoach offers a holistic solution focused on healthy habits and personalized feedback. Unlike pharmaceutical interventions, BioCoach emphasizes sustainable lifestyle changes and community support, helping millions lead healthier lives.
Web Guidelines Color Exploration Design System Guidelines Visual Language + Art Direction
Human Experience Design Product Design Prototype Components
Development Developer Handoff Developer QA Prototype Evaluation QA Testing
Deliverables Information Architecture Competitive Analysis Wireframes Design System and UI Kit
Like this project
0

Posted Feb 21, 2025

Application to support people with metabolic health, which has already caused or is now causing obesity, diabetes, and other chronic health problems.

Likes

0

Views

1

Timeline

Jun 21, 2022 - Ongoing

Clients

BioCoach

Tags

UX Designer

Product Designer

UI Designer

Atlassian

FigJam

Figma

Health Care

RentDodo - A hassle-free way to manage rental applications
RentDodo - A hassle-free way to manage rental applications
Optifly - The Ultimate Schedule Optimization Tool for LCCs
Optifly - The Ultimate Schedule Optimization Tool for LCCs