FITTED

Create an exercise routine that suits your level, schedule, and interests. 🏋🏼‍♀️

OVERVIEW

PROJECT BRIEF

Motivate people into an exercise routine that suits their level, schedule, and interests.

Finding exercise routines for your level can be difficult, especially if you want to try something new. This responsive web app aims to help people get into an exercise of their choice by holding their hand a bit and providing routines, guides, interactive examples, and info. Finding routines that fit into your schedule is not easy. The web app is designed to encourage people who want to exercise to get into an easy routine for physical activities. This means fitting in as little as a 5-minute routine.

OBJECTIVE

Create Fitted’s UX foundations, UI & Style Guide, and high fidelity prototype for the web app

RESPONSIBILITIES

UX Deliverables, Wireframes, Prototype, UI & Design System

TOOLS Figma, Miro

METHODOLOGY Lean UX

TIME 2021

UX foundation

From the Project Brief, I crafted logical & pragmatic UX deliverables so I could define the features and function of each wireframe.

Created persona from research

User stories & flows

Task flows search, save, & share features

Share management

USER STORY: As a frequent user, I want to be able to share routines with my friends who may also be interested

ENTRY POINTS: Specific video of interest

TASK COMPLETED: When User presses "send"& signaled the action was completed

Search & save

USER STORY: As a new user, I want to learn about different exercises so I can figure out what is best for me.

ENTRY POINTS: Home Page

TASK COMPLETED: When User starts or marks video for saving

Information architecture

Low fidelity wireframes

UI Design

Requirements

Style Requirements: Easy, informative, fun; orange & black

Key Branding Messaging:

“Exercise is something anyone can pick up, find something they love, & fit it into their daily schedule”
“Getting back into exercise doesn’t have to be an ordeal”
“Track your progress to see how a little effort goes a long way”

Mood Boards

Creativity comes from ideation and play. I created two UI visions in a quest to find an appropriate & promising UI style.

Style 1

Style 2

Outcome

Our users want to feel happy to find fun new ways to exercise, & feel motivated to stick to a great routine. The first style is clean, with high contrast to wake up the senses. We want exhilaration with the chaos. The second style is electric & lively with a warm color story. I chose the first moldboard to keep in spirit with high energy, fresh energy.

STYLE GUIDE

Color Palette

Rationale

Based on my research on emotional associations to certain colors, blues convey trust and create an inviting atmosphere. With sensitive fitness issues like self-image or health issues, the users should feel safe and stable using our product. Orange communicates warmth and fun energy is a motivator for this product. The two colors align with Fitted’s user needs.

Fortunately, blues and oranges make a complementary color scheme - avoiding muted and light blue and orange to keep the excitement high.

Logo Design

Iconography

Typography

Elements

Imagery

Brilliant and based in real life - the shapes of the human bodies are in motion and create interesting angles which are intended to inspire users to move and get started. The imagery is grounded in real-life scenarios with realistic approaches to fun and exciting workouts. This makes the experience more human, immersive, attainable, and familiar for the user. Alternatively, imagery shouldn’t show post-workout exhaustion, commentary on weight, cartoony, or gimmicky. Emotionally, the imagery embodies satisfying engagement, determination, focus, & clarity.