Mobile App UX/UI Design Academic Project

Designing a habit, not just an app

End-to-end UX design for a fitness tracking app, from empathy research through to polished mobile screens. A self-directed academic project to demonstrate the full UX process.

ContextAcademic UX Project
RoleSolo Designer, Full Process
Year2019–2020
ScopeResearch, Personas, IA, Wireframes, Visual Design, Hi-Fi Screens
3
User personas built from primary research interviews
12+
High-fidelity mobile screens across all key flows
Full process
Empathise, Define, Ideate, Prototype, Test
3
Core feature areas: track, goals, community
Motivate fitness app
01 · The Problem

A crowded space with a habit problem

The fitness app market is saturated with technically capable products that feel clinical, overwhelming, or joyless. Most are built around data collection rather than behavior change. The result? Apps people download, open twice, and abandon.

The real challenge isn't tracking fitness. It's helping people build a lasting relationship with it. That required understanding not just what users do, but how they think and feel about exercise before a single screen was designed.

Feature overload
Too many options cause decision fatigue and discourage daily use.
No emotional hook
Clinical UX fails to motivate. Users need encouragement, not just data.
One-size-fits-all
Beginners and experienced athletes have completely different needs.
Habit formation gap
Apps track activity but don't support the psychology of building a routine.

"The best fitness app isn't the most feature-rich. It's the one people actually open every day."

Before any wireframe was drawn, I spent time understanding real people's relationships with fitness. I conducted interviews across fitness levels: complete beginners, gym regulars, and lapsed exercisers. The goal was to map emotional journeys around motivation, habit formation, and barriers.

Key themes emerged quickly: people don't fail because they lack information about fitness. They fail because the tools don't match how motivation actually works in the real world.

User interview session
User interview documentation
Research notes and synthesis
Affinity mapping and synthesis notes
02 · Research

Listen before designing

03 · Personas

Three users, three different stories

My research surfaced three distinct user archetypes. Each persona shaped a specific design decision, from onboarding length to notification tone to workout discovery.

Persona 1
Persona 1
Persona 2
Persona 2
Persona 4
Persona 3
04 · Information Architecture

Structure before screens

With three personas and their distinct navigation patterns mapped, the next step was defining the app's structure. The IA needed to serve both the time-poor beginner and the data-driven regular without overwhelming either.

I built the site map around three core pillars: tracking daily activity, setting and managing goals, and community accountability. Every nav decision was tested against each persona's mental model.

App site map overview
App site map built around three core user journeys
Onboarding and goal-setting flow
Onboarding and goal-setting flow
Tracking and community flow
Tracking and community flow

Wireframing started with hand-drawn sketches to rapidly explore layout ideas without commitment. Three key flows were sketched first: activity logging (the highest-frequency interaction), goal creation, and workout discovery.

After several rounds of paper iteration, I built digital lo-fi wireframes in Figma and tested them with users. I refined navigation patterns and content hierarchy based on observation, not assumption.

Hand-drawn activity screen sketch
Activity logging flow
Hand-drawn goals screen sketch
Goal-setting flow
Hand-drawn workout screen sketch
Workout discovery flow

Hand-drawn sketches for activity log, goal-setting, and workout discovery flows

05 · Wireframes

Sketches to tested flows

06 · Visual Design

Energy without anxiety

Most fitness apps default to dark, aggressive aesthetics that signal intensity over support. Motivate deliberately goes the other direction: warm, energetic, and calm enough to open on a low-motivation day without feeling like a challenge.

Typography was chosen for scannability during movement. Large, high-contrast numbers for metrics. Generous line height in body text. A color system built around energy without pressure.

Ink
#171B2C
Depth
#414D70
Slate
#5B6687
Focus
#707BFF
Energy
#EE3861
Progress
#F9A100
Focus Energy Progress Grounded
07 · Final Product

12 high-fidelity screens across all key flows

Click any screen to expand. All screens designed for iOS, covering the full user journey from first open to daily habit.

Login screen
Login
Sign up step 1
Sign Up (1/3)
Sign up step 2
Sign Up (2/3)
Sign up step 3
Sign Up (3/3)
Activity level screen
Activity Level
Fitness goals screen
Fitness Goals
Calendar view
Calendar
Workout screen
Workout
Tone up workout
Tone Up
Heart rate tracking
Heart Rate
Progress tracking
Progress
Side menu
Side Menu
08 · Outcomes

What this project proved

Full Design Thinking Process
Demonstrated end-to-end methodology from empathy interviews through to tested, polished screens.
Mobile-First Thinking
12+ screens designed for mobile context: touch targets, one-handed use, glanceable metrics mid-workout.
Research-Driven Decisions
Every UX decision anchored in findings from user interviews and persona insights, not assumptions.
Coherent Visual System
Consistent color, type, and component system built to scale to a full production app.
You've seen the work
Back to the full portfolio
Back to Portfolio