Redefine

UI Design

Role: UI Designer

Tools: Sketch, Principle, Invision

UI for UX Designers course project at CareerFoundry

A workout app that makes you want to come back to it

Redefine is a mobile-first web app built for people who are new or returning to fitness. Workout routines can seem daunting or challenging to many people. It’s a popular new year’s resolution but continued discipline plummets as January passes.

Problem

It takes a lot of mental effort to go to the gym either early before work or after a full day of work
The gym can be intimidating for those who aren’t familiar with the equipments
The gym can be intimidating being surrounded by regular gym-goers & body builders

How might we hone in on behavioral psychology research to create a product that can help people incorporate exercising into their lifestyles?

Mindfulness is a tool that allows people to be more aware of their physical and emotional conditions without getting bogged down in self-criticism and judgment.

Ariane Machin, Ph.D., sports psychologist:

I think women want to be involved in fitness, but they want to do it in a way that is not punishing or punitive or just to lose weight. We want to go beyond a superficial aesthetic payoff and find more meaningful benefits.

Panteleimon Ekkekakis, Ph.D., associate professor of kinesiology:

When you end a session in a tough, unpleasant place, you may take that with you. But when your sweat session finishes with a portion of less intensity, you’re more likely to walk away feeling groovy, not just glad it’s over.

Low fid > Mid fid > Usability tweaks

To lay out the app’s information architecture, I created the initial site map

… and drafted up low fidelity screens using Balsamiq. At this stage, I focused on the onboarding screens, where users would input their preferences and data for the app to curate sensible workout routines.

Low fidelity wireframes

Mid fidelity wireframes

After refining the low fid screens, I made some adjustments to some of the touchpoints for reasons stated below. It is essential to remove any friction points during the onboarding process to increase conversions.

Mad eye for the moods

After crafting 2 different mood boards, I chose Moodboard 1 because:

The light or dark wash with one pop of color gives it a subtle seriousness about redefining workout
It nicely compliments the focus on practicing mindfulness while exercising
It draws inspiration from modern gyms that are made of concrete walls and has one splash of highlight color that runs through their bricks and mortar.