Fitness revisited, spotlight on the new Body You Collective mobile app
Case study
CONTEXT
This is a two and a half week Design Sprint to come up with ideas that ccoverboth the business and the clients need.
THE UX DESIGN TEAM
For this ideation and validation project, We worked on a small team of three UXers. The Co-founders split the role of the Product Owners.
THE CLIENT
Body You offers affordable in-home personal training sessions. Their unique selling points are:
- The price: £30/session.
- They match you with your personal trainer based on your personality.
THE BUSINESS NEED
The best way to describe Body You’s business need is this quote:
“We need to create a simple app that is user friendly for users to purchase and make bookings. This would hugely improve the Body You product and increase our traffic and revenue” — Body You
RESEARCH
INTERVIEWS
To validate the brief and understand the end-user needs and pain points, we conducted a series of interviews.
We interviewed 12 people. The majority are Body You current customers, the others are people we got from our survey screener. We published the survey across social media channels and on the worldwide General Assembly Alumni Slack channel.
Body You current customers are happy with the service and have been using it for a few years. They see the co-founders Andre and Vincent as friendly and approachable.
AFFINITY DIAGRAM
To get a better picture of our end-user, we gathered all the data from the findings of our interviews and put it into an affinity diagram.
ARCHETYPE USERS
From there we identified our two ‘personas’.
Sandra is BodyYou main user. She has aspirational goals and her personal trainer gives her the confidence to reach them.
Harris is our secondary user. He is a busy person with a demanding job and family. He is getting older and needs to stay active to manage his health.
Both Sandra and Harris meet with their personal trainer often. Their relationship with that person is important to them. They need somebody who understands them and who is compatible with their personalities.
EXPERIENCE MAP
To improve the Body You booking experience, we created an experience map. It shows how Sandra currently books, her concerns and emotions.
As you can see, the current booking experience is quite negative. There are a lot of pain points and concerns around the waiting time and scheduling via text message/WhatsApp.
OUR APPROACH
From a user experience perspective, we concentrated our efforts in two major sections:
- Put more of an emphasis on the Body You USP (unique selling point) which is matching with a personal trainer based on your personality match
- An improved and more efficient booking process
“Our approach is to design a fun and user-friendly mobile app, that allows Sandra and Harris to match with their best personal trainer and book sessions efficiently” — UX team
STORYBOARD
To summarise our approach here’s a quickly sketched storyboard:
DESIGN STUDIO
Now that we had enough data to start sketching some screens, we invited the Body You co-founders, Andre and Vincent to join us for a 2 hours design studio. I facilitated the design studio while Wendy took care of the timekeeping.
DESIGN PRINCIPLES
Before introducing the design challenges, I reminded everybody of the design principles of the app. We shaped these from the Body You values.
- Fun
- Informal
- Accessible
- Convenient
DESIGN STUDIO CHALLENGES
I then introduced the design challenges that our team agreed to address before the session. I also did a quick reminder of our personas Sandra and Harris and gave an overview of the scenarios and the user flows we are designing for.
- The first challenge was around the layout of the personality quiz.
- The second challenge was around multiple sessions booking.
DESIGN STUDIO OUTCOMES
The alarm rang, we stopped sketching and did a critique around all the sketches. We voted for elements here and there. I made quick sketches summarizing all the elements we voted for in one flow.
PAPER PROTOTYPE
We thanked the client for their time and carried on with another round of design studio. We made screens for the rest of the flows we hadn’t addressed during the first design studio.
PAPER PROTOTYPE TESTING
We tested the prototype and the feedback was:
- “Why would booking take users to ‘Match with a trainer’? ”
- “What does matching with a trainer means?”
- “Trainer refers to shoes”
- “Trainer results are confusing”
- “I don’t understand how to use this calendar”
We did other iterations of the paper prototype until we solved the majority of the issues faced above. However, the calendar was still problematic. We decided to go for another design studio and came up with different layouts.
MID-FIDELITY WIREFRAMES
We kept iterating until we got some positive feedback. At that point, we felt confident enough to go digital.
USABILITY TESTING
The task for testing was to Login > Pass the personality quiz > Book multiple sessions with the best matched personal trainer.
USABILITY TESTING OUTCOMES
What we took from the testing was mainly about:
- Simplifying the navigation
- Making the personality quiz more prominent.
People found the quiz too long and preferred to see all categories on one page.
We iterated until we came up with a simpler layout.
USER INTERFACE DESIGN
OPTION 1
This design goes well with the current Body You website. There is a consistency in colours, style and imagery.
OPTION 2
We wanted to explore other design options. Body You is playful and spontaneous so we came up with illustrative characters.
I had never done an illustration before but I was excited about it and willing to learn. I’ve put my best efforts on the table and both Wendy and Sahar were supportive.
PROTOTYPE: DEMO
We first did the prototype in Invision and felt it had lost the playfulness we originally set out to achieve. It felt static and lost those interactive elements we defined in our design principles.
I am interested in animation, the team gave me a go-to take half a day and give it a try. We set a time limit saying if I don’t get successful results in 4 hours, we stick to our current prototype.
So I learned how to use Principle. Tutorials and tips are available on their website. Here’s the outcome:
TO WRAP UP
It was crazy and fulfilling to do this incredible amount of work in two and a half weeks. During our last meeting, we presented our final proposal, and both Andre and Vincent were extremely happy with the output. They had the feeling this app covered all their needs and were very pleased to see that we were presenting them with two versions of the design.
Another detailed case study about the visual design process is on its way. Keep an eye on the next publication. In the meanwhile, feel free to like and share. Your feedback is valuable and helps me improve what I’m doing, get in touch @Chaymae.
Before you go!
If you liked this article, clap and share. Get in touch if you have any questions or any examples you want to share.
If you liked this article, you might also like:
- Use these top 10 tips when you design for forms
- Why Testing with Real Content Is Better Than Lorem Ipsum
- Communication layers you need to know about in UX Leadership
Lastly, I created www.idir.co.uk to help people reduce stress and unwind using highly concentrated CBD products. I’m working on our case study and I will share the tips of dealing with e-commerce platforms as soon as I finish it. Stay tuned ;)
