UX Design
UI Design
User Research
Mobile App
Conceptual
Project Overview
Everybody Pilates is an expanding small studio based in Sydney. As a conceptual exercise, I created a product in the form of a mobile app as a tool for users to schedule classes easily. I had to also incorporate the existing business strategies of the studio such as tracking client attendance to reward small gifts and the different styles of classes offered.
Role
UX researcher, UX designer, UI designer
Deliverables
Preliminary user research.
Defining user flows and information architecture.
Paper and digital wireframing and iteration of lo-fi UI.
Usability testing with lo-fi prototype.
Reworking of designs into high-fidelity mockups following analysis of user testing results.
The problem
Scheduling of classes were done through direct messaging with the studio Founder. As the studio expanded with more clients, a more efficient method of reserving classes and keeping track of a user’s attendance was required.
direct messaging the studio Founder to schedule classes is inefficient and unmanageable
class content could not be properly communicated to users
no formal tracking of users' attendance to receive reward gifts
The solution
A formal platform for scheduling classes in the form of a mobile app is proposed. The studio’s current selection of classes offered and the business model of rewarding clients for their continuing attendance is to be retained.
easily schedule classes
inform users well of what each class entails
user attendance tracking to receive rewards
Understanding the Users
Preliminary User Research
Firstly, I undertook preliminary user research to understand the reason behind why users would want or need to attend pilates classes. I interviewed 3 current clients of Everybody Pilates to find out their motivations. I used this research to identify the current pain points of users to then shape the product and its features. The research summary is as below:
User Flow Mapping
Scheduling a class is the ultimate goal of the product. A user flow mapping exercise allowed me to understand the basic and minimum steps to achieve this goal.
Ideation
Information Architecture
Following the user flow mapping exercise, I was able to work out a basic information architecture for the mobile app focusing mainly on the necessary elements for the critical path. Other pages required to supplement the critical path addressing user pain points were also thought of.
Paper Wireframing
Quick sketches were done to brainstorm ideas for screens along the critical path. These focussed more on quantity of ideas rather than quality of content.
Lo-Fi Prototype
Taking the best ideas from the paper wireframes, I created digital wireframes. Completed with all other connecting screens, this led to a lo-fi prototype of the mobile app which is used for a usability test.
Usability Test
Test Details
5
Online
10min
I conducted a usability test using the lo-fi prototype focusing on the flow and features of the product. A set of questions were asked to all participants such as:
What do you think of the overall navigation and flow of the app?
What are some features you liked?
What are some features you would have preferred to be added?
Insights
Satisfied with overall flow and features
All participants were satisfied with the app's ease of use. Features that were liked across the board were the calendar view for scheduling and the presentation of attendance tracking.
Isolate call-to-action buttons
The CTA buttons were placed too closely together and users accidentally tapped the wrong buttons.
Important class details unclear
Users were confused about class difficulty, equipment used, and class focus.
High Fidelity Mockups
01
Home Page
Users liked:
The greeting as they enter the app and the dashboard home.
"Book it again" makes it easy for users to rebook a previous class, fostering continued attendance.
"Explore other workouts" highlights other classes of interest to broaden users' range of workouts.
Improved after usability testing:
"Your Next Class" is placed at the top as users mentioned it is sometimes the first thing they want to see when entering the app if they already have a class booked.
02
Schedule
Users liked:
Calendar view for easy date selection.
View all classes by date to keep the UI simple and clear.
Improved after usability testing:
Class difficulty, spots left, and full classes indicated added. This ensures users are well informed before viewing a class' details.
03
Class Details
Users liked:
Showing how many classes users have left in the top right corner.
Knowing who the instructor is for the class.
Improved after usability testing:
Users were unsure of how difficulty is perceived during the usability test. "Recommended number of classes" is added as a measure of difficulty to give users a point of reference as to how experienced they should be attend this class level.
"Focus" section highlights the equipment and fitness targets of the class. This information was is important for users to fully understand class content.
CTA buttons to confirm and go back are separated.
04
Confirmation
Users liked:
Reminder of class details and what to bring.
"Add to Calendar" feature for adding booked classes to personal digital diaries.
Improved after usability testing:
CTA buttons to add to calendar and go back are separated.
05
MyFit
Users liked:
The presentation of attendance tracking and rewards is easy to understand.
Showing their current package.
Styleguide
Concluding
Next Steps
Conduct another round of user testing to understand the impacts of the redesign.
Create a responsive website version of the app.
Launch of the app and track user activity of the studio clients to analyse the product's impact and further improve on the design.
