Redesign of a Social Fitness Platform that promotes exercise as medicine

Tugba Ozdil
6 min readSep 6, 2016

It’s almost the end of summer and I have completed my UX Design Immersive course at General Assembly. It’s been a very intense 10 weeks and learned so much in this time including many different UX methods, digital design skills and teamwork. I had extensive experience with working in teams from my career and studies before but dynamics can be quite different in the design teams. Figuring out how to balance skills and bring out the best in every team member for overall product success has been the most rewarding challenge.

Our last project was a 2.5 week design sprint working in a team of three for a startup client. It was a very exciting and inspiring experience as their product is very young and promising and any design improvement could have a potential to make high-impact.

Our client was Pactster, a social fitness platform that promotes the use of exercise as medicine. I worked in a team of three, contriburing to all stages of the UX process while having the ownership of the digital mockups and creating the digital prototype.

Here I’m going to talk about the design process we followed in order to improve the experience of their users while addressing the business goals.

RESEARCH

Pactster tackes 2 key problems faced by people suffering from health issues (e.g. cystic fibrosis, cancer, postnatal):

  1. Adherence to the recommended exercise (unsure what exercise is safe for given conditions)
  2. Isolation from other sufferers

They are offering good value, but their website was in its Beta version and it. was experiencing low activation rates.

We were asked to help with increasing the activation rates by improving the experience.

Looking at the major competitors, we have seen that Pactster offers values that others don’t, but these values weren’t coming across.

Competitive Research

We needed start with research to understand needs of the people with health issues and how we can help Pactster to offer solutions to them.

Affinity Mapping from Interview Insights

We sent out a survey on people’s exercise habits that received 95 responses in 2 days. Out of these respondents, we interviewed 10 people with profiles similar to Pactster’s users.

We used interview insights to map out people’s common behaviour patterns and needs.

Based on the people we have interviewed, we created our primary persona Emily.

Primary Persona

We have then conducted an evaluative research to observe first time users’ experience with the existing website and mapped the findings under Emily’s Journey Map.

User Journey Map

Our research findings revealed 3 key areas for improvement:

  1. Communicating the value of Pactster very clearly on homepage
  2. Sign-up
  3. Watching a video

DESIGN ITERATIONS

After completing our initial research, we got together with Pactster team to discuss the insights we gathered from the interviews.

Discussing research insights with the client team

We also ran a design workshop where everyone sketched out some ideas to explore different solutions to the problems we are facing.

Design Studio & Sketching

From there we took these ideas a bit further and ended up with our first paper prototype and ran a series of user testing and updates. On the homepage we introduced:

  • Natural language search bar to deliver the platform purpose in a humanised way
  • Brought the three core values to user’s attention
Homepage
Video Watching
  • People couldn’t find how to play the video on the existing site, so we’ve put it where people expect to see it.
  • In the original website video page showed instructor details. We gave instructors their dedicated page in order to remove extra text from Video page and make content updates more manageable for the client.
  • We added related videos for people that want to continue their workout
  • We added a personalisation step in the sign-up flow but user testing showed that this made people feel like sign-up is taking unnecessarily long, so we took it out of the design.

USER TESTING & DIGITAL PROTOTYPE

After a series of testing with users, we moved onto digital wireframes applying the testing insights and more details to the flows.

User Testing Takeaways

During testing we observed that people were hesitating to sign up to watch the video. Some even said “I prefer to leave the site now”. This was a serious issue that had to be addressed. We identified the reasons as:

  • People felt like they were being tunnelled. They were asked to sign up before they could see what they will get
  • They didn’t understand the value they were going to get by signing up. For them, Pactster wasn’t much different than their competitors.
  • They thought sign-up was going to take long and they will have to enter a lot of personal details
Video Page with Preview

By giving people a way to play a preview of the video and letting them know they need to sign up to watch the rest, we reduced the hesitation.

This way we allowed them to explore further before submitting their details to yet another online platform.

On sign-up page we added a ‘Only 30 seconds to sign up’ and ‘no credit card needed’ information.

But further user testing showed the the value of Pacster was still not coming across.

So we went back to our interview insights and our persona Emily’s needs and asked ourselves “How do we support people that needs to exercise due to their health issues better?”.

re-visiting the design decisions

We reminded ourselves Pactster’s brand personality: Humanised, motivational and trustworthy.

And we noticed that the answer was right there all from the beginning. Pactster is a ‘social’ fitness platform and one of the problems they tackle is ‘isolation from other sufferers’. Currently they have a ‘Work out with friends’ feature that targets this problem but we could do more.

That’s when we wanted to test out a new idea. A ‘Community’ feature would help bring people with similar problems / goals, allow them to ask questions to experts, get recommendations and make friends.

Through communities, people could stay motivated and engaged with the platform.

We picked up our sharpies and went back to paper prototyping to test out the idea.

Health Communities

HIGH FIDELITY PROTOTYPE

Due to my obsession with details and prior experience with design tools, I got to have the ownership of the digital mockups and prototype in my team.

A selection of mockups [full interactive version]

Try the interactive prototype to see how it works and rest of the screens.

NEXT STEPS

It’s been a great experience working on this project the past 2 weeks. We presented our findings to the client they shared our excitement and they said they can’t wait to implement some of the design changes in the near future. We acknowledge that the new ‘community’ feature is currently very simple and there is more research / testing and improvements to do on it, but this is just the beginning. Next steps from here would be:

  • Bringing out “workout with friends” feature
  • Enhancements on community page
  • Adding interaction with instructors
  • Improving mobile experience

--

--