Bodyfit
More than just a gym. A community. Everyone should have the right to exercise in a safe, welcoming and fun environment.
Introduction
Everyone has the right to exercise in a safe, welcoming and fun environment. Bodyfit understands the value of first-class facilities, your well-being and a friendly smile from their team. Bodyfit is devoted to making a difference.
The previous website needed some changes to accommodate for the ever-growing community. My solution includes many key items that the old website was missing:
- Purchasing a membership for your Bodyfit location
- Weekly class timetables
- A landing page for each Bodyfit location
- An eCommerce store
Explore: bodyfit.com.au
My process
1. Ideate
- Sitemap
- User flows
- Low-fidelity wireframes
2. Plan
- High-fidelity wireframes
- Responsive designs
- Design system
3. Develop
- WordPress development
- eCommerce data entry
4. Test
- Front end review
- Back end review
- UAT
Sitemap
Get started
We required a primary place for the main call-to-actions and conversion points to live. In this new website, we incorporated a conditional membership and 2-day free pass form that parses data from a location selection and redirects to its respective membership link.
Train
Bodyfit’s point-of-difference is their premium facilities they offer to all members. The Train pages acts as a place for these facilities to be presented. This helped users get a better understanding of the facilities available at each location.
Gyms
Easily the most important pages on the website. These new gym pages were a massive improvement compared to the previous websites. I designed, developed and tested each landing page that showcases all of the following points:
- Location and opening hours
- Facilities
- Classes
- Timetable
- Membership options
- Try free
- What’s new: a blog category specific for each location
- Contact: contact information and a form that gets sent to the email of the specific location.
- Dynamic Instagram feed
Classes
Bodyfit offers a variety of classes. Due to this, we had to take extra time and research the best possible solution for this. We proposed a simple, yet effective A – Z organisation as well as categorising the classes into 4 categories:
- Les Mills
- Mind and Body
- Freestyle, Function and Outdoor
- Bodyfit Programs
When COVID-19 started to affect Australia and states went into lockdown, we also included a Virtual Training classes section here. These classes were streamed live on Facebook and then pulled into the website for anyone to train at home, for free!
Location sitemap
Each gym location had its own submenu to allow for an easier navigation through the pages content. While the order of this architecture changed slightly after some testing and reviewing, these main sections remained.
Location and hours
This section showcased a Google map of the club location as well as the address, phone number and opening hours.
Virtual tour
A section to accommodate a virtual walkthrough of each of the gyms.
What’s new
A blog category that is specific to each of the Bodyfit locations. This was essential in showcasing upcoming events.
Facilities
Each Bodyfit location offers different facilities, I included a simple section of icons and text showcasing the premium facilities on offer at each of the locations.
Classes
Each Bodyfit location offers different classes, I included a categories section for the classes, adding and removing anything necessary.
Timetable
Quite a large piece of work, we included a fully responsive dynamic table of classes at each of the locations. Due to the fast pace of this project, this piece of work was done quite quickly, if I could change anything now I would definitely revisit the text contrast, font sizing as well as the ability to add a class to your calendar.