UI/UX Case Study: Fitted

Fitted’s goal is to provide a way for people on the go to make time to exercise. On a tight schedule, it can be difficult to stay motivated so people look towards fitness apps, like Fitted, to hold them accountable and show them easy, accessible exercises they can do anytime, anywhere.

Role

User flows | Wireframing | Prototyping | Usability Testing | Affinity Mapping | Animation | Competitor Research

Tools

Invision | Illustrator | Photoshop | Marvel

Project

Challenge

Design a responsive fitness application that people, who are new to fitness, can learn exercises and join challenges, while being able to add these to a personal schedule.
ProblemPeople with tight schedules, including professionals, parents and students, barely have time to dedicate to exercise, let alone learn how to do them. They need the option to save time and exercise at their convenience.

Approach

Through user-centered design, the application will focus on gamification and in-app member community to keep users motivated through rewards and competition. To maintain convenience, the content, such as educational videos, can be digested in seconds and offering workouts that can be performed in mere minutes. These aspects will be tested to guide the ideation process.

Fitted Features

•    browse exercise videos, based on type, intensity and skill level
•    schedule exercises and join challenges based on personal needs
•    create user account and share content with friends
•    earn achievements and track personal progress 

Low-fidelity prototype set the foundation to create basic functions and element interactions. Specific task flows and elements were laid out, based on user flows.

Mi-Fi Prototype

The lo-fi prototype was fleshed out to include placeholder copy and block content. I began to test our typography and appropriate color schemes that fit the mood of the app.

Confirmation copy and social media sharing was added. In empty state and search functions screens, confirmation copy helps users learn how to use the app (progressive onboarding) and confirm their actions were successful. Social media sharing is a convenient and conventional option that most users expect from modern apps.

For navigation, modal windows help to simply quick actions taken throughout the app. For example, applying filters or watching content videos would not take users to a new screen. Rather, a pop-up window that can be closed without navigating to a new screen.

High Fidelity Prototype

Responsive Design

From mobile to desktop, Fitted is designed to be responsive. Users can access the application, virtually anywhere, from home to the office.

To view a clickable prototype, please click here.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.