Project Background

The owner of Bike Lab had previously created a website for the cycling studio, however he felt that there were some issues with his approach. His original idea for the cycling studio was to target cycling professionals, however he had not undertaken any research into who his target audience was prior to the web build. He has limited knowledge in web design and is not tracking visitor metrics using google analytics or any similar method. He approached me to help as he felt that the content on the site was far too technical and was putting potential clients off coming to the studio. I was happy to help out!, and set about redesigning the website following a user centered approach.

Bike Lab
Scroll To Top

How do I know if this idea is the right one?

A FRAMEWORK TO JUDGE THE VALIDITY OF AN IDEA

What people problem am I trying to solve?

How do I know this is a real problem?

How will I know if I've solved this problem?

I want to improve the experience that users of the Bike Lab website have. They need to be able to determine if the cycling studio is right for them and also be able to easily navigate the site and find the content most relevant to them.

The owner of the cycling studio created a web presence for this business but did not carry out any research to identify his audience. He is worried that the content on the site is too intimidating and is putting his prospective clients off.

When the project moves into a development stage and design changes are implemented we should see an increase in class bookings and purchases. In addition google analytics can be embedded into the site to track visitor metrics.

How do I know if this idea is the right one?

A FRAMEWORK TO JUDGE THE VALIDITY OF AN IDEA

What people problem am I trying to solve?

I want to improve the experience that users of the Bike Lab website have. They need to be able to determine if the cycling studio is right for them and also be able to easily navigate the site and find the content most relevant to them.

How do I know this is a real problem?

The owner of the cycling studio created a web presence for this business but did not carry out any research to identify his audience. He is worried that the content on the site is too intimidating and is putting his prospective clients off.

How will I know if I've solved this problem?

When the project moves into a development stage and design changes are implemented we should see an increase in class bookings and purchases. In addition google analytics can be embedded into the site to track visitor metrics.

People problem statement

"I'm bored of the gym and want to try a new sporting activity. I've visited the Bike Lab website but I'm not sure if it's for me, it looks very technical. I'd love to know if this club is for professionals only or for beginners like me."

Framing the problem

User Need

The users need to know if Bike Lab is suitable for beginners. They need to be able to understand the content available on the website and feel comfortable that the cycling studio is a good place for them to train.

Business Need

The business needs to gain a better understanding of who it's target audience is. It needs to improve the experience for customers visiting the website, increase customer conversion in the form of class bookings and grow it's brand awareness and reputation.

solace_handset
solace_handset
solace_handset

The framework for innovation

The innovation framework

Discover

User Interviews

I wanted to find out who the existing users of the cycling studio were. Are they elite professionals or are they cycling hobbyists looking for a new fun way to get in shape?. I wanted to know what they thought of the website, what their pain points were and what their goals were from using the site. The owner of the studio passed on the contact details for some of his existing members. I then arranged some interviews with them to find out more.

It became clear from these early interviews that as the owner expected people were not interested in the scientific information that was being displayed on the website and they found the site to be intimidating and confusing. They used the site mainly to check class times and to book classes. Their main aims were to get in shape by taking a couple of classes a week at a time that suited them. A key insight discovered was that these users were not aware that there was an app available for the studio that they could download through the apple store as this information was not being highlighted on the site. They expressed interest in using the app in future in place of the online portal.

I now wanted to find out what prospective members of the studio thought about the website. I wanted to know if they would be keen to try a class for the first time after they visited the site or what their experience of using the site would be like. The existing members put me in contact with friends of theirs who had not visited the club or the website before, and again I set up some online interviews over zoom to find out more.

From talking to this second group of interested members patterns of frustrations were becoming clear. They felt as though the club was geared towards professionals and it made them feel a bit intimidated. They were not clear about what was involved in the classes and whether they would be able for them. A summary of the main pain points that emerged from the interviews are shown here:

painpoints

Define

User Persona

I created two personas, based on the qualitative research I obtained from my interviews, which I will use as a reference during later design phases of the study.

'James' is an existing member of the studio, he has tried classes before and likes them so now he just uses the website to check class times and book classes. He is aware that there is an app that he can use and is planning on installing this and using it for bookings in the future.

'Michelle' is a prospective member. She has stumbled across the website when searching the internet for a spin class to try out. She thinks the site looks interesting but is being overwhelmed by the volume of technical content being displayed.

Anna
Anna

Site Map

I carried out an open card sort with users of the site using optimalworkshop.com to get an understanding of how users thought the content on the site should be structured. I listed out the different sections currently being dispalyed on the site and asked participants to create categories and group the content. I noticed some patterns from analysing the similarity matrix available on the optimalworkshop site and this helped to verify my thinking about how the content should be structured on the redesign. A site map was then created using Lucidchart to visualize how the content might be organised on the proposed redesign. It was becoming clearer how the site could be improved and simplified.

solace process flow

Develop

I created digital wireframes and a clickable prototype that will be tested with users. The main areas of the site that I focused on improving were the Homepage, About, Class information and Contact pages. The Timetable and the Pricing pages on the site use a third party application called 'Glofox' that provides the function needed for users to browse available classes, purchase credits and then book into a class. These pages are not in scope for a redesign during this study. The app that is available to download in the apple store is also powered by Glofox.

Mid Fidelity Wireframes

Homepage

welcome usability test
welcome usability test

About

welcome usability test

Classes

welcome usability test

Contact

welcome usability test

Deliver

Usability Testing

I wanted to test my proposed designs with users of the website so I began to schedule usability tests. I conducted the tests over zoom and took notes during the sessions. When the first usability tests were finished I reviewed the data that was collected and ranked the issues in order of severity using Jakob Nielsen’s error severity rating system. I documented the issue, the error rating code and my recommendations for fixing the issue. I then retested the high fidelity designs. The screenshots in this section show the wireframes that were developed into a prototype and iterated on following on from usability testing.

Homepage

welcome usability test
welcome usability test
welcome usability test

Final Wireframes

Homepage

welcome usability test

About

welcome usability test

Classes

welcome usability test

Contact

welcome usability test

Next Steps

For this study the next steps would be to implement the new proposed web redesign. The cycling studio is currently closed due to level 5 lockdown and and there may be some question about the business opening up again post COVID. It is my hope that I can work with the owner over the next few months to implement proposed changes to the existing website and to then track visitor metrics using google analytics. If changes are taken on board I believe his business goals of increasing class bookings and growing visitor numbers to his site will be successful and the site will provide visitors with a much better experience than it currently does.