Overview of the project

FitnessPlans is an innovative app that offers tailored fitness plans from verified trainers to help users achieve their desired goals. It allows professionals to create, update and monitor each plan’s progress. The goal of the project was to create a simplified fitness solution that increases user motivation, and aids in achieving fitness goals through improved UX.

  • Industry

    Fitness

  • Platform

    iOS, Web, SaaS

  • Location

    USA

  • Services

    Design Strategy
    UX Design
    UI Design

Problems identified by FitnessPlans

  • check-mark-fitness-icon

    Disorganized fitness tracking

    Ineffective fitness plan tracking results in decreased motivation and goal obstruction. A streamlined system is required for for proper progress tracking and organization.

  • filter-fitness-icon

    Delayed plan modifications

    A lack of prompt notifications in the plan modifications makes it difficult for users to adapt and align their efforts. This calls for a solution ensuring timely updates for smoother adaption to revised plans.

  • sealcheck-fitness-icon

    Finding verified trainers

    The challenge to find certified trainers on various platforms creates uncertainty in users to confidently select a suitable trainer and fitness plan. This calls for crafting a trustworthy verification system.

Our Approach

Insights from the collaborative discovery sessions

By engaging in discussions with company stakeholders, we were able to identify essential features and functionalities for the FitnessPlans app, revealing valuable user insights.

  • Displaying the progress made in the fitness journey through plans is crucial for motivating users.
  • Users should have a streamlined experience without feeling overwhelmed by excessive information.
  • Trainers should have seamless plan creation and performance tracking capabilities.
Seamless Section Right Animation
Seamless Section Right Animation

Information architecture

infomation-architecture-img

Plan Creation Flow

Plan Creation Flow Image

Structuring user journey through wireframing

We created wireframes to visualize the platform’s layout and structure, providing a clear representation of its navigation and user interface. Wireframing helped us to identify potential usability issues to be addressed before development begins, resulting in a more user-friendly experience.

FitnessPlans_Wireframe_Image
FitnessPlans_Wireframe_Image
FitnessPlans_Wireframe_Image
FitnessPlans_Wireframe_Image
FitnessPlans_Wireframe_Image
FitnessPlans_Wireframe_Image
FitnessPlans_Wireframe_Image
FitnessPlans_Wireframe_Image
FitnessPlans_Wireframe_Image
FitnessPlans_Wireframe_Image
FitnessPlans_Wireframe_Image
FitnessPlans_Wireframe_Image

Setting the visual tone

In the visual design stage, we explored various design options and experimented with different layouts, colours, fonts, and other visual elements. Throughout the visual design stage, we regularly took feedback from stakeholders. The feedback helped us refine and deliver final visuals that meet clients’ requirements.

Key screens of trainee app

Image of the categories page in the mobile application of fitness plans
Image of the categories page in the mobile application of fitness plans

Explore plans of different categories

User can find plans based on different categories to achieve their fitness goal

Find verified trainers

Verified trainers have a tick marked profile so the trainees can discover their plans easily

Image of verified trainers page on mobile application of fitness plans
Image of verified trainers page on mobile application of fitness plans
Image of a plan for the customer in the mobile application of fitness plans
Image of a plan for the customer in the mobile application of fitness plans

Understand potential outcomes of a plan

With detailed plan descriptions and Reel Results, users can gain a clear perspective of achievable outcomes.

  • FitnessPlans_VisualDesign
  • FitnessPlans_VisualDesign
  • FitnessPlans_VisualDesign
  • FitnessPlans_VisualDesign
  • FitnessPlans_VisualDesign
  • FitnessPlans_VisualDesign
  • FitnessPlans_VisualDesign
  • FitnessPlans_VisualDesign
  • FitnessPlans_VisualDesign
  • FitnessPlans_VisualDesign
  • FitnessPlans_VisualDesign
  • FitnessPlans_VisualDesign
  • FitnessPlans_VisualDesign
  • Key screens of trainer application

    Track the performance of your plans

    Trainers can analyze the data to extract valuable insights regarding plan performance and make necessary changes

    Image shows the performance tracking page on the fitness plans smartphone app.
    Image shows the performance tracking page on the fitness plans smartphone app.
    Image of customising plans for customers on the mobile application of fitness plans.
    Image of customising plans for customers on the mobile application of fitness plans.

    Step by step guide to create a plan

    Tool tips and easy to follow step-by-step instructions helps trainers to create their plans easily

    Tools to help with better reach

    Designed a range of sales and marketing tools to help trainers in expanding their reach to a wider user base

    Image of the marketing tools page on the fitness plans mobile application
    Image of the marketing tools page on the fitness plans mobile application
  • FitnessPlans_Trinerapp
  • FitnessPlans_Trinerapp
  • FitnessPlans_Trinerapp
  • FitnessPlans_Trinerapp
  • FitnessPlans_Trinerapp
  • FitnessPlans_Trinerapp
  • FitnessPlans_Trinerapp
  • FitnessPlans_Trinerapp
  • FitnessPlans_Trinerapp
  • Web App for trainers

    We strategically designed a web app for trainers to enhance their marketing capabilities and enable wider audience reach for their fitness plans.

    Image of the finess plans website login page
    Image of the finess plans website login page

    Actions & updates

    Keep track of the actionable items and latest updates

    A screenshot of the fitness plans web dashboard page
    A screenshot of the fitness plans web dashboard page
    Image of the plan analytics page on the fitness plans website
    Image of the plan analytics page on the fitness plans website

    Plan analytics

    Check the performance of each individual plan to take necessary actions

    Market & Sell

    Utilize the power of social media and marketing campaign tools to expand your reach

    Image of market and sell page on fitness plans website.
    Image of market and sell page on fitness plans website.
    left-animation-round
    left-animation-round

    UI kit

    By developing a UI Kit, we established a consistent visual design and user experience across the platform for all users. It will also help in simplifying the integration of new features and functionalities.

    • Typography
      Typography
      fitnessplan-mobile-typogrphy
    • Colors
      fitnessplan-typography-desktop
      fitnessplan-mobile-typogrphy
    • Components
      fitnessplan-component-desktop
      fitnessplan-mobile-typogrphy

    What we delivered

    Several revisions and Zoom calls later, we delivered the final designs with confidence.

    • 240+ hrs

      Focused design work

    • 30+ hrs

      Discovery sessions and feedback meetings

    • 70+

      Screens designed

    • “UXTeam provided exceptional design work that exceeded my expectations. They were professional, responsive, and highly creative in translating my vision into a visually stunning and functional design. I highly recommend their top-quality services.”

      author-thumb
      Garrett Marshall
      CEO, FitnessPlans

    Have a fitness project or idea in mind?

    Let’s connect and understand how we can collaborate to take it to the next level!