Bikes Not Bombs
Role
UX Researcher + Designer
Timeframe
2 weeks
Tools:
Figma, Dovetail, Optimal Workshop
How might we revamp the online shopping experience to create an intuitive interface that also enhances customer loyalty?
Bikes Not Bombs (BNB) is a Boston-based non-profit organization dedicated to social change through the use of bicycles. In their full-service repair & retail bicycle shop they host community classes and refurbish discarded bikes to donate locally and internationally. Their original e-commerce website suffered from poor navigation, lack of filtering options, and insufficient product information, resulting in user frustration and low online sales. As a UX Researcher and Designer, my role was to understand user needs, enhance the browsing experience, and increase customer loyalty and online sales.
Navigating Bumpy Terrain
Research Reveals Poor Navigation & Lack of Filtering
I facilitated user interviews and usability tests using Dovetail and a Qualitative Coding process to synthesize data and findings. I identified issues with confusing navigation, duplicate product categories, and a lack of filtering options. Users were abandoning the website due to the difficulty in finding what they needed. Valuable insights revealed users’ preferences for more product information, clear categories, and clarity on how their purchase supports the organization's greater mission.
To address user and business needs, I conducted a competitor and feature analysis comparing BNB to major retailers and local bike shops. This provided insights into missing features and areas for improvement, for example powerful search and filtering functions. I also considered what might be manageable for a small shop like BNB, and some ideas on how visual design can amplify their mission.
Based on the user feedback about duplicative categories and issues searching for desired products, I facilitated a closed card sort with 15 users which confirmed the product categories: “Bikes” “Parts” and “Accessories”. This exercise helped streamline the website's navigation, ensuring users could easily find what they were looking for.
Understanding User Potential
Personas & Journey Maps
Based on gathered data, Ryder is a passionate cyclist who regularly rides for commuting, exercise, and enjoyment. They prioritize supporting bike shops with a social justice-oriented mission and prefer the convenience of searching for parts online rather than navigating crowded in-person stores. Ryder is frustrated by the lack of filtering options on the BNB site, as it hampers their ability to find compatible parts based on their bike's specifications. Detailed information and clear categories are crucial for them to make confident online purchases.
Through a journey map, I explored Ryder's experience, from encountering a flat tire to researching and purchasing a replacement part online. The lowest point was struggling with website navigation, while positive in-person experiences at the shop created a high point. The key takeaway is that improving the website's navigation and online purchasing experience can foster a seamless and enjoyable journey for Ryder, ultimately leading to customer loyalty for BNB.
The Problem:
The current online bike shop experience is challenging for users like Ryder. They need a smoother way to search for bikes, parts, and accessories, making online research and purchases easier and more accessible.
Refined Flows & Revamped Wireframes
Sketches and wireframes targeted navigation and information architecture to enhance browsing. The final redesign improves accessibility, offers clear product categories and filters, and prevents cognitive overload for users.
The improved product page features detailed filtering options, standardized bike specifications, multiple images, user reviews, a bike size chart, and Q&A section with BNB staff.
Home Page
About Page
Reflections on Optimizing UX Strategy
Given more time, I would refine the high-fidelity wireframes, conduct usability testing on the prototype, and incorporate additional features like an illustrative filter function and related content section. Peer review feedback sessions provided valuable insights, and in the future, I would allocate more time for design and delivery elements.
Throughout the project, I faced challenges working with limited existing branding and spent additional time on aesthetics. In hindsight, I would have utilized templates and included annotations to streamline the wireframing process. Overall, the project provided valuable experience and highlighted areas for improvement in future endeavors.