Goodlife Health Clubs is one of Australia’s largest and most popular health club chains supporting more than 270,000 members across 84 gyms. My team was tasked at improving the membership sign up process for their new website.
Simplify the membership process to increase sign up numbers.
Build the new sign up using the SAAS eCommerce platform BigCommerce.
Ensure that we were designing a system that felt unified with the rest of the website.
30% of Australians have a gym membership, but 27% of these people barely use it. 553,000 Australians don’t even go once a month to the gym they’re signed up to, wasting $1.8 billion every year. On top of this, official consumer complaints to the government service Better Regulations about gym contracts have ranged between 416 and 587 a year for the last five years. To put it simply, people are confused by how gyms structure their memberships and are getting locked into contracts they don’t understand.
We held various workshops with the team at GoodLife to understand their business needs. Together we mapped out various things that were of the most importance to them.
Understanding The Users Our main form of user research was doing an audit of how customers were talking about Goodlife online. I did this by researching customer reviews and social media mentions. Let’s just say that customer complaints weren’t about unfriendly staff or old equipment. 9/10 complaints were of hidden fees, not being able to cancel their membership and confusing membership structures.
To make the biggest impact and improvement that we could, I analysed the competition.
Really nice clean design.
Impossible to find any membership information. They instead push users towards coming into the gym for a trial. This makes it impossible for users to browse for price when sizing up which gym they want to join.
Hero call to action when you arrive on the page is to ‘Join now’.
When you click through, they won’t supply you with any membership information until you give them an e-mail address and phone number, which they’ll no doubt use to harass the user.
Bold and clear design.
Membership information is nowhere to be seen and the user is instead asked to sign up for a trial.
Membership information is easy to
find. User has a choice between signing up for a trial or signing up immediately.
UI is cluttered and dated. There’s five different tiers of membership, and it’s not visually clear what’s the difference between them.
How might we allow potential members to feel in control of their membership terms?
After doing our research, it was abundantly clear what I needed to Centre our design around. Transparency.
I wanted to give users the feeling of control with their membership. I structured our user flow so they would be able to customize almost every point of their membership. But keeping in mind that this also couldn’t feel overwhelming in a UX sense. Therefore I created a step by step structure. The user would be only given small decisions to make at a time. Every decision they made would influence the interface and show them only what was necessary to see next. All of these decisions would be housed within two pages that would evolve with each decision, taking away clicks.
We also restricted the complicated options of a membership to a more simple Blue, Black or Platinum model.
When we were happy with our user flow, we had to map the product and category structure to work with our idea. I had to also work with our dev team to make sure that this would work within the parameters of the tech stack we were using.
Now we had a user flow, I got to work on the UI.
I referenced the colours, buttons and shapes from the designs we were provided for the hero website, then created new elements that would be specifically required for our eCommerce service. This would ensure that the entire flow between the sites felt unified, but that key eCommerce elements were still kept in place. This would help the user by making sure the process felt familiar to the eCommerce systems they were used to using.
My main aim was to make sure that everything was clear and up front. Nothing should ever feel hidden. The way I decided to create this feeling was by removing the cart step of the eCommerce process. Instead I designed the cart as a modal that would display live information about the users membership as they created it. This ‘Summary’ would be sticky on the right side of the page and follow the user as they followed the required steps.
To enable all stakeholders to sign off on the design, I made a prototype that mapped five different user journeys.
After the designs were signed off internally they went through development. I worked closely with our internal dev team, brainstorming and then designing for any tech challenges that we faced along the way. When the site was finally built it went through external QA testing. They picked up on various bugs and some validation suggestions.
What We Learnt
We ended up creating an extremely customised version of a BigCommerce site. While exciting for us to create something new, as we built the site we found that every step away from the standard service complicated our site. This caused unexpected problems and delays in the build that we needed to troubleshoot. If I had the chance to design this site again, I would make more decisions about what really needed custom building and what solutions I could have used that would work within the existing framework. This would have ensured an even stabler service and saved us time in the build of the site.