Redesigned a website for a local bike shop to improve the navigation experience and to encourage customers to book bike repair appointments online.
Bikechain is a non-profit bike repair shop. Their mission is to make bicycle repairs more accessible for the wider community in Toronto. During the pandemic, demand for bikes in Toronto has gone up significantly, especially during the summer season. Bikechain is looking for suggestions to redesign their website and branding to create a better interaction experience with customers.
I first analyzed Bikechain’s website and compared it with 5 other local bike shops to understand the industry landscape. I noticed Bikechain's website allows customers to book bike repair appointments online, which is a feature that many competitors do not have. I also identified some improvement opportunities for enhancing the website experience.
86% believe ingredients are important. However, they also don't understand all the ingredients listed on the packaging.
80% feel sort of confident that the food they give to their dog is healthy.
7% believe there is sufficient transparency in the dog food industry.
I interviewed 3 Bikechain customers via Zoom to understand what motivates them to use Bikechain's services so I can gain additional insights on how to improve the website experience. I was able to translate the key insights into design opportunities:
100% mentioned ingredients are important but it's difficult to understand chemical ingredients
75% also look at product reviews and nutritional content when picking dog food
75% indicated there is a lack of educational resources for finding healthy dog food
75% have had poor experiences with a dog food product due to health concerns
Customers pick Bikechain over other bike shops because of positive google reviews, reasonable pricing and convenient location
Design opportunity: highlight factors above in the home page
Customers prefer to book bike repair appointments online due to convenience
Design opportunity: Add a clear CTA for bike repair appointments
Participants want to know pricing for bike repair services before booking an appointment
Design opportunity: The service offering page should easily be discoverable with pricing details captured
80% indicated vaccine appointments were not centralized which made it difficult to find available appointments
80% did not feel informed when booking an appointment. They would like to know the following information: type of vaccine, eligibility criteria, potential side effects
100% had to rely on sources that are not affiliated with the provincial healthcare system to find available appointments (i.e. Twitter, word-of-mouth)
With the insights gathered, I was also able to identify one distinct persona group: Oliver, a recreational cyclist in the city.
With the research findings in mind, I made changes to the information architecture of the current website. I renamed the navigation menu categories so that it’s more intuitive to first time visitors.
As part of the redesign initiative, I created a new logo for Bikechain and chose a new colour palette and typography with the brand adjectives in mind: active, reliable and friendly.
From here, I created a clickable prototype in Figma for usability testing. I recruited 5 cyclists (based on the persona type) for testing. The 5 participants were asked to complete the following tasks:
All participants successfully completed the tasks and said the prototype was easy to use (100% completion rate). Participants said they preferred the new website design because of the following reasons:
Participants also provided valuable feedback to further improve the website design. With the feedback gathered, I was able to make revisions to further improve the experience. Suggestions were mostly content related:
Play the video demo below to view the final prototype or explore in Figma.
Design with the user and business in mind: This project gave me the opportunity to design with the user and business goals in mind from start to finish. Participants were able to successfully navigate the prototype and all had positive feedback for the new website design.
Design with a time constraint: Due to time constraint, I learned to plan ahead and set priorities in order to meet the target deadline. A Project Plan helped track my progress and ensured I stay on track.