Bike & Build

Through service-oriented cycling trips, Bike & Build benefits affordable housing and empowers young adults for a lifetime of service and civic engagement.

Role
Design team lead, UX lead
For
Bike & Build
Date
2015 – 2016
Type
Website
URL
bikeandbuild.org/

Bike & Build’s website was full of great information and compelling stories, but visitors had trouble finding what they needed because the navigation was confusing, there were no clear calls to action, and the design was not responsive.

The first step to improving their confusing user experience was to identify the primary audiences for the website and the actions the organization wanted those audiences to take.

For Bike & Build, we identified two equally important audience/action pairings:

  1. Potential riders interested in signing up
  2. Potential donors interested in contributing to a rider’s fundraising goal.

These core audience/action pairings informed every aspect of our information architecture and user experience design work.

New Website

We started with a two day discovery session with the client that included:
– Developing a customer map
– Business and audience goal identification
– Content modeling
– Proto-wireframing
– A mood card visual design exercise

In collaboration with the client, we determined that our visual design goal was to use their existing assets – gorgeous imagery and testimonials from past riders – to tell a compelling story about rider impact.

Our user experience goal was to create clear paths for visitors to instantly sort themselves into the appropriate user flow, either as potential riders or potential donors.

Armed with this information, we started on the design process.

Customer Journey Mapping – Riders

Style Tiles – a design deliverable to help start a conversation with our client.

Leader Flows for the backend.

The new Bike & Build WordPress website clearly communicates the organization’s value proposition, and makes it easy for potential riders and potential donors to find the right path through the site’s content.

The visual design tells a compelling story about rider impact by using gorgeous imagery and testimonials from past riders. Moreover because it’s responsive, visitors have a great experience on mobile and tablet as well as on desktop. As an added bonus, there are some nifty details—click through and hover over the logo to see what we mean!

The new site launched on October 26th to coincide with their annual rider and ride leader registration period.