Figma, Adobe Illustrator, Adobe AfterEffects
UI / UX Design Case Study
I created a kiosk experience that improves a gym user’s motivation to consistently work out.
Process Doc*
*Adobe Acrobat PDF VIewer - no download required :)
What is it?
This design consists of one main kiosk located at the front of the gym (front desk area) and several corresponding kiosks attached to each individual machine or free weight area. A member can scan their bar code to generate their routine and follow through with it with the help of the screens.
Large Main Kiosk Screens
Blue is the color of New York. Blue excelsior and blue flag. I chose these blues because New York is sometimes a beautiful place with not the most beautiful weather.
Default Start Screen - Where the journey begins
A darkened video in the background of exercises and videos of said gym will be playing in the background. This encourages familiarity and an added friendliness to welcome new and returning users.
First time user? Get started with a quiz to figure out your capabilities and preferences.
A gym membership is assumed there is information attached (specifically name) is attached to the users account. Preview those questions so there are no surprises.
Let’s get started with the first question.
The options are a drop-down scrollable menu to input your birth month, year, and day. The user is unable to go to the next question until this question is answered.
Scrollable wheel for question 3 format.
The user can move their finger up and down on the screen to scroll to their exact height to the nearest inch.
Multiple choices question format.
The selected states are highlighted white and “select” is changed to “selected”.
Finishing the quiz.
Each routine is chunked into what days the user will be working out and what exercises to do for the day. This assumes the user will start their workout the same day of creating their routine.
What if the user is a returning user?
The user will be prompted with the routine that is needed to be finished on the same day they scan in to start, along with the list of exercises, what they work, and a short description.
Small Kiosk Screens - screens next to the machines
How the user goes through their entire workout for the day at each machine.
Default Start Screen - user flow through using the squat rack
Main screen information.
The user can pause, start, and stop their workout. They have access to help, recommended weight and last weight used, tips, a playing video of a person doing said exercise, what set the user is on, and how many reps they need to do.
Pausing the workout.
This gives the user time to get water, go to the bathroom, and exit the workout. The user can also view which exercise they are on and the next ones up.
The user finished the exercise at this machine.
This shows the user what the next exercise is and where it is.
CONCLUSION AND REFLECTION
Users go into using technology expecting it to carry you through the process.
An easy experience complemented with a challenging workout makes it more welcoming and less daunting to start their fitness journey.
The best way to keep the user informed is constantly letting them know where they are at and what to do next.
Especially with exercise, the user has a lot to think about, and that is what the kiosks are meant to do: to take the mental load off the user to focus on their workout.
How does this impact the user in a positive way?
A trusted and efficient way for users to reach their fitness goals.
Since the kiosk creates a routine based on preferences, each routine is unique to each user. This added customization creates a sense of control.
Motivation to keep coming back to the workout.
New and recurring users will be enticed with the option to customize a workout without the effort of actually doing so.
What are some setbacks?
Lack of user testing.
I was not able to use real users to test out how the device works, which I believe is an important step in being able to connect and learn from them to create a kiosk that is better suited for my intended audience.
Time constraints limited ideas.
In the course of 15 weeks, I planned, prepared, ideated, and created this kiosk. There are parts and ideas in the wireframes and workflow that I was not able to include in the final compositions.
Final Animated Prototype
Corina Lougie
corina.lougie@gmail.com
