SWEATY BETTY

2017. Mobile application.

Student work for a mobile application for retail store, Sweaty Betty. The application allows users to book in-store fitness classes, track fitness and health data, and purchase Sweaty Betty apparel. 

THE CHALLENGE

Design a mobile app for Sweaty Betty, a UK activewear retailer for women. The app should allow users to book in-store fitness class, track fitness data, and shop for Sweaty Betty apparel. For this project, I worked in a team of three UX designers for two weeks, sprinting through the full UX design process. 

COMPETITIVE ANALYSIS

We began by analysing the Sweaty Betty website, then did a site visit to a Sweaty Betty store on Redchurch Street in Shoreditch. We also visited one of its main competitors, Lululemon in Spitalfields. We then analysed existing fitness apps such as My Fitness Pal, Apple Health, and Nike Training Club. 

USER SURVEYS

We started by sending out screener surveys in order to recruit user research participants. In addition to recruiting participants, we were also able to gather data on user behaviour around fitness tracking and workout habits. For example, we learned that majority of our users tracked their fitness and/or health in one way or another. We also learned that My Fitness Pal was the most popular tracking app amongst surveyed users. 

INTERVIEWS AND AFFINITY MAPPING

We conducted interviews with 13 users whose ages ranged from their mid-twenties to mid-forties, and exercised regularly and/or maintained a structured diet. Through the interview, we gained a better understanding of their habits, behaviours, attitudes, and feelings towards health and fitness. We also learned about how and why they were tracking their workouts and diets. 

Using key findings and user quotes from the interviews, we created an affinity map in order to discover key themes. We discovered these recurring themes amongst our users:

• Things that get in the way of a healthy lifestyle

• Physical and emotional reactions to health and fitness

• Tracking health and nutrition

• Dealing with booking procedures

Understanding these themes gave us a much better idea of the problems we were trying to solve, which were primarily around cumbersome tracking and manual input of fitness data. 

DEFINITION

Based on our research and analysis, we knew that our solution should be one that is simple, intuitive, and required minimal effort from the user in order to track fitness data. 

Our three design principles were: 

• Simple- designing a simple booking and tracking process

• Personalised- an app that is tailored to the users preferences and habits

• Companionship- a guide throughout your fitness and health journey
  

Going into the design phase, we had two proto-personas, Sophie and Jenny (below), whom we thought appropriately represented our users. We also created user journeys that fit our brief and key problems. 

DESIGN

In order to generate ideas quickly as a team, we went into a design studio session with specific challenges to solve our main problems. After several rounds of critique and iteration, we came out of the session with refined versions of some of our best ideas. We then created a user flow and wireframe based on our main user journey:

"Sophie would like to book Thursday’s Sweaty Betty class in either Soho or Selfridges and track her calories immediately after her workout."

PROTOTYPES AND TESTING

Through initial user testing of our paper prototype, we discovered that some of the language we used was not intuitive or clear, therefore we made iterations based on this. We also discovered that we could do more with our 'Home' screen. Rather than just present the user with options to either book a class, track his/her fitness and shop Sweaty Betty products, we realised we could use this screen to instead present a summary of the user's daily statistics and goals. We also created a global navigation bar at the bottom of the screen, which we came up with using a card sorting exercise. 

With these new iterations, we went on to design our mid-fidelity prototype, which was further tested on twelve more users. We then made further iterations based on feedback. Some of these changes included: enlarging buttons, including more detailed information for each fitness class, adding clearer success messages for class bookings, and including a feature that automatically adds classes to the user's calendar. 

FINAL PROTOTYPE

Using colours and aesthetic from the Sweaty Betty website, we came up with a simple style guide in order to move forward with our high-fidelity screens making use of Sweaty Betty's prominent orange colour throughout our designs. Below were two initial versions of the home screen. We determined that the darker version on the left was too masculine and did not fit the look and feel of Sweaty Betty as well as the lighter version on the right.