LOOKS GREAT

ON ANY DEVICE.

 

I'm a paragraph. Click here to add your own text and edit me. I’m a great place for you to tell a story and let your users know a little more about you.​

Using myself as the persona

Being I was pushed for time, I decided to use myself as the Ideal end user. In doing this, I created a quick persona with some of my primary goals, needs, and wants.

Problem

As a new member of a gym, you’ve just downloaded their native app and have signed in to it. The gym wants you to get to know you a bit better so they can tailor your experience. My task was to design the initial onboarding process. The goal was to limit my efforts to a day worth of work, aka 8 hours or less.

Competitive analysis: Planet Fitness

I did some quick research and downloaded a few gym and fitness apps. My goal was to capture their process so I could get a better feel for the information needed to create a successful onboarding tutorial. While Planet Fitness is a popular household name, I found more things I wanted to avoid doing then borrowing when creating my onboarding experience. 

Competitive analysis: Bod Bot

Bod bot Is a service that allows users to customize their workout routines based on their preferences and equipment. Their onboarding process while easy to follow and straightforward. It never gave me a sense of how long the process was going to take which left me with a frustrated feeling. I got to the point where all I wanted to do was skip the experience and do it later.

Brainstorming…

I wanted to break down the information needed from my end user into three steps.

1. User Stats:  Full name, gender, weight, height, body fat %, etc.


2. User Goals:  Ideal weight, body fat %, BMI, and other goals.


3. User Preferences: Trainer gender, Days and Times a user typically works out, Preferred workout styles, and Muscle groups a user wants to focus on.

Journey mapping

Journey mapping was easy after I established the information needed from the user.  I wanted a frustrated user to be able to skip the onboarding process.  Allowing them to experience the app immediately, but giving them the benefit of onboarding on their own time and in context of the app experience.

Wireframing

Being I was limited to a day, I decided to skip my usual onboarding method and stick to my tradition pencil and paper techniques.

First attempt

My first attempt consisted of threes steps, designed almost one to one with the wireframes I had created. I made the header into a navigation bar which helped set a users expectations, letting them know which step they were on and how many steps were next in the flow. I also included ways for users to manually prompt permissions like calendar integration etc.

Second attempt

I wasn't satisfied with my first attempt. I felt I could further condense the number of steps in my process from 3 to 2. So in doing this, I decided to combine both the Users Goals and Preferences into one step. I also wasn't happy with my Initial right-hand friendly approach and wanted to make my text fields more accessible while cutting down on the overall amount of possible user errors

Onboarding in context

If a user was to skip the Onboarding process, we show them in-app prompts that help them onboard in context. If they complete the onboarding process users are shown prompts that help them learn the app, and it’s many benefits.

Sign-in page

Being I had the time I decided to bring things full circle by designing the member sign-in page. This page almost acts as a storefront view of the entire app experience. I also took the time to create a slight brand for this project, including the logo and color scheme.

  • Behance
  • LinkedIn - Black Circle

My work

Forward Fitness Onboarding
Pypestream web widget V1
Pypestream mobile app concept
Pypestream web widget V2 concept
Pypestream Pype Manager
Prototypes & Animations
Pypestream Bot studio
Blipit messenger
Blipit search
Peep self service booking
About me
Resume
My Process
Show More