Cascade Bicycle Club
Cascade Bicycle Club is the nation's largest bicycle non-profit organization that advocates bicyclists and strives for a more bicycle-friendly Washington. Because of the range of services and information it provides, the organization was facing challenges with maintaining an user-friendly website. As a team of 4, we worked on a redesign of the website and collaborated closely with Marketing manager and Event manager at Cascade.
Research, web data analysis, content strategy, information architecture, wireframe, prototyping, visual design
Figma, Marvel, Optimal Workshop
The current experience
The website is the major channel for bicyclists to find and register for events, manage membership and gain information about the biking community and regulations. However, the current website has severe usability problems that make it challenging for visitors to achieve their tasks quickly and accurately. Some major usability issues were:
Disorganized and overwhelming content
Confusing IA and navigation
Lack of hierarchy and inconsistent CTA
Goals for redesign
We interviewed our stakeholders to determine the goals for the redesign. We made sure to view the problem holistically and addressed three different types of goals: usability, business and branding.
Improved browsing experience will allow the users to navigate and find information quickly and efficiently.
Event and membership sign-ups are the main drivers of the revenue. The website should focus on conversion.
Clean and modern visual brand will attract more visitors as well as make the website easily maintainable.
Understanding user needs
Based on the goals of the website, we determined two types of users and their primary use of website. This helped us to prioritize pages to redesign and discard pages that don't meet user's needs and goals.
Identifying usability issues
We used heuristic evaluation, web data analysis and card sorting method to uncover major usability issues of the website and fix them to align with users’ expectations. The research helped us understand user behavior on the website and organize information in a way that makes the most sense to the users.
1. overwhelming content
The amount of content and excessive CTAs increase user’s cognitive load and makes it challenging for them to consume information and take the next action, such as registering for an event.
2. unclear navigation
Unclear navigation and information architecture make the users feel lost, and they don’t know where to proceed. Categorization of content is unintuitive and disorganized.
3. confusing taxonomy
Users could not tell the difference between creating an online account vs. becoming a member. Membership program was not communicated clearly to the users.
Based on research findings, we needed to simplify and reorganize the navigation structure so that the users can find the content intuitively and effortlessly. We constructed a simpler IA by decreasing the navigation categories from 13 to 7.
Card & list view
To organize information in an easily digestible way, we decided to use cards and lists design. Card allows flexibility for different types of information and can be quickly applied to many pages on Cascade website.
Single navigation bar
Since navigation was the source of many usability issues, it became a high priority for improvement. We completely removed the side navigation bar and simplified double navigation to single navigation by grouping content more effectively. Moreover, participants found it difficult to differentiate the navigation categories so we reworded them with more intuitive words.
Filter and search function
Rides page is the most visited page on the website so we wanted to best optimize the search experience for new and returning visitors. We placed filter and search function on top banner for users who had specific event in mind. If not, they can explore the list of upcoming events with key information (time, location, type of ride).
Introducing membership program during sign-up Process
We introduced complete new flow for membership enrollment. First, we changed the wording from "online account" to "free membership" and "membership" to "premium membership" to differentiate two status. Then we prompted the users to choose the membership plan during their sign-up process.
We looked at other bike organization websites to examine their visual design and how information is organized. Two common patterns were using full-width banner and card UI to organize information.
We maintained Cascade's original branding color, green, while shifting to a more minimalistic and clean look. We wanted the website to be inclusive and attract bicyclists from all skill levels and ages.
Event details page
Presentation to Cascade Bicycle Club
We presented our final deliverable to various stakeholders at Cascade, including Director of Technology and Senior Director of Marketing and Communications.
Update: Cascade recently implemented some of our recommendations on their website, especially the rides page! They completely removed the side navigation and updated categories for upcoming rides and past rides.
Success metrics of the redesign
Reduced number of customer calls for questions
Increase in event and class registration rate
Increase in membership rate
Decreased in web bounce rate on critical pages
If we had more time, we would have worked on responsive design and think about how the new website will fit into mobile. Also, one of the key lessons from this project was finding the sweet spot between content, UI design and stakeholder's goals.