Problem Statement
Independent bicycle shops are typically a low-margin business, making significantly better profits from repairs, accessories, and custom work than the sale of bikes. But, if bike shops typically make most of their profits from services and repairs instead of bike sales, then what is the purpose of their website if not for ecommerce?
​
At the core of this project is Village Cycle Center in Chicago's Old Town neighborhood. Here are the original home screens for web and mobile at the time of this project.
UX Research
What else can the bike shop's website offer to increase business if it isn't traditional ecommerce? To a find out I went straight to the users, actual cyclists. Through a survey and in person interviews, two personas were found: an avid and a casual cyclist.
Both cyclist types had similar goals when looking at a bike shop's website.
-
Most often when visiting a bike shop's website users say they are looking for the location, hours, and phone number for the shop.
​
-
Secondary goals for visiting were to find the services/repairs offered, to see if the shop carried the brand the user wants, or to shop for accessories, parts, apparel, or a new bike.
​
-
Users expressed that they maintained loyalty to one (or several) shops primarily due to community ties to the shop. Secondary reasons were location, products, services, and knowledgeable and friendly staff.
​
-
Users indicated that they would like to participate in community bike events, but that they didn't know how to find these events. Many events spread only by word of mouth by visiting the bike shop.
These discoveries were used to develop a user-centered design which could increase website and in-store traffic, attract new customers, and turn those new customers into returning customers by offering the information customers are seeking, where they are seeking it.
UX Design
The location, hours, and phone number will be one of the first things seen in the hero section. With minimal scrolling the user is presented with the brands the bike shop carries, and links to sale products, the fit studio (unique to this store), and services and repairs.
A new feature, a community events page, extends that strong community atmosphere that exists in-store to the digital world. Users can see, join, and create community events. Maintaining this feature is beneficial to the bike shop, as it will bring in new and old customers looking for a biking community, and turn new customers into returning customers.
Wireframes
This project required unique problem solving, and the final design was certainly not how the wireframes started out. There were lots of iterations and ideas; not all of them made the cut.
Landing Page V1
Landing Page V2
Landing Page V3
Community Events Strip V1
Community Events Page V1
Community Events Strip V2
Community Events Page V2
UI Design
Because this was only a website redesign I worked with Village Cycle Center's original color scheme, but just couldn't leave the original logo. The new logo is more minimalist and simple, focusing on what is important to the customers: the bikes and the community.
Original Logo
New Logo
Vs.
Logo Iterations & Ideas
High Fidelity Comps
Putting it all together for pixel perfect comps ready for development.
Landing Page
Community Events Page
Shop Bikes
Event Details Page
Landing Page
Shop Bikes
Community Events
Event Details
