How I designed FitCoach App Daily Workout Page (Mini Case Study)

Hello everyone!

I've completed task #062 for #UIX101. The mission was to design a daily workout page.

Situation:

The task was to design a daily workout page for a mobile gym/workout tracking app. Users create a profile by answering questions about their fitness background and goals. Based on this information, a personalized workout plan is generated by Victor.AI, the app's virtual coach.

Task:

The design needs to clearly communicate the daily workout details, including duration, exercises, and required equipment. Additionally, the interface should be intuitive for users of all experience levels, even those unfamiliar with fitness terminology.

Action:

• Clear Information Display: The workout details are presented prominently, with estimated duration, exercise names, and equipment icons. This eliminates the need for users to constantly read explanations.

• Visual Cues: Icons are assigned to each exercise, allowing users to quickly identify the movement without relying on text.

• Video Support: Each exercise is accompanied by a video demonstration, catering to beginners and those unfamiliar with specific terms.

• The bottom navigation bar provides access to additional app features:

  • Home page icon

  • Achievements section for gamification and motivation

  • Challenge section to connect with other users

  • Settings for profile management, theme customization, and notification preferences

Result:

The design aims to provide a user-friendly experience for individuals at all fitness levels. The clear presentation of information, visual cues, and video support empower users to confidently follow their personalized workout plan.

Edit After User Feedbacks

Following user feedback, it was determined that the icons located on the lower tab are not clear and understandable enough. Therefore, text support has been provided for these icons.