Bencium / Product Design & User Experience Consultant
Bespoke & Different.
ios fitness app dark.jpg

iOS Fitness App [2-day Design Sprint]

OVERALL CONCEPT, BRANDING AND UX/UI DESIGN
Research • User Interviews • Competitor Analysis • Logo and Visual Identity • Naming • Wireframing • Prototyping

(2014)

Userflow and Wireframes

Userflow and Wireframes

Please note, this project has been created as a design task during a Fjord/Accenture job application. It was a 2-day sprint from start to finish. The focus was on strategy, monetisation and concept.

Based on research findings and competitor analysis, I started ideating new features

User Interviews

User Interviews

Two main observations:

1) Reason for deleting fitness apps: battery drain
Solution: energy saving feature has to be highlighted in the App Store feature list

2) Easy to use fitness apps tested = they really work intuitively as advertised

Competitor Analysis

Competitor Analysis

I tested the leading apps while cycling to work: fitness, tracking, health and coaching apps like FitBit, Strava, Couch to 5K, MyFitnessPal, Lifesum.

UI Design Moodboard

UI Design Moodboard

As searching for the ideal concept, I found award winning, innovative applications like SoundCloud, Flickr, Monument Valley and AirBnb

Branding

Branding

Good examples for strong branding and carefully selected colour palette in app UI design

Naming Options

Naming Options

Looking at the leading apps I realised that many of them have confusing names and just a few stands out as STRAVA

STIMULI: “A thing that rouses activity or energy in someone or something; a spur or incentive.”

It sounds a bit foreign and hopefully will be remembered by the users.

Font Research

Font Research

Visually strong typeface design, good legibility
Avoiding overused typefaces
Typeface should support the app’s overall concept
Screen optimised

App Icon / Logo

App Icon / Logo

Goal: to create a unique shape that stands out on the user’s Home Screen and in the App Store.

Legible in small sizes to be used in social media as profile pictures

Number Eight <> Infinite Loop

Number Eight <> Infinite Loop

The overlap of the letter 'S' and number 8: eight-week programme, the shape can be used as an hourglass, there are further possibilities in promotion visuals.

Unique Features

Unique Features

• Inspirational images pulled in from nearby running routes
• Battery saving mode: detects battery charge level
• Food intolerance/allergy, non-dairy, halal and vegan settings

Onboarding

Onboarding

Inspirational images set the user in the right mood

Home Screen

Home Screen

Swiping up reveals more information on the challenge

Challenge examples:

• eat no sugary food for one month

• 20000-step weekend

• run home from work • run to work
• run at lunchtime
• fastest 3K

• sponsoring possibilities with retailers like Strava/Rapha partnership

Home Screen Top Bar

Home Screen Top Bar

Progress constantly visible:
tapping on the top progress bar tells the user how much time left to finish

Menu

Menu

INSPIRE button:
showing evidence for the positive impact: face will
look healthier, feel warmer all day, better sleep, circulation, weight loss, reduced nervousness, better food, better mood, nicer body

Social/Group Activity:
joint training with friends / local and remote

Screen during Workout

Screen during Workout

• Enhanced button legibility during running

• Inspirational images are pulled in from image server based on user’s location

• Progress graph: showing current location and route map

• Clean UI: focussing only one item while running

Screen during Workout

Screen during Workout

Progress graph option: animated performance graph

Screen during Workout

Screen during Workout

• Swiping left or right reveals further inspirational images about the area

• These images might be one of the biggest motivation to get up and go running

Home Screen during Workout

Home Screen during Workout

Animated performance graph

Achievement Overlay

Achievement Overlay

• Voucher codes, credit points can be also gained: building partnerships with retailers and other brands

• Social/Group Activity: Sharing achievments

Stats Dashboard

Stats Dashboard

• No geeky tables and stats

• Only friendly and clear infographics

Feature: Behavioural Change Detection

Feature: Behavioural Change Detection

1 Fitness Level
Tracking the progress as a normal running tracker app. Based on special algorithm (speed, distance etc), it is able to detect performance gain

2 Eating Habits
Food quality change based on purchased food list