Do you cycle regularly in London?

Ashley O'Callaghan
Aug 31, 2018 · 8 min read

Now, this question normally elicits one of two answers:

a) No. That would be crazy.

b) Yes. I might be a little crazy.

I fall into the b category. And I have to admit during those moments when I find myself pinned to a pothole-littered roadside by a giant red bus I also question my sanity.

The truth is, unless you live in the Netherlands, cycling in a big city is hard.

In fact 54% of Londoners consider the roads in their local area too unsafe for cycling (and that includes cyclists.)

a commuter shares his opinion of the cycle superhighway in Vauxhall

So how can we make urban cycling safer?

Given that a city-wide infrastructural redesign was a little beyond my scope armed with Post-it notes and a few prototyping tools I set out to explore the problem through an app.

User research

Meet Tom aka the “all about efficiency cyclist” and Amy the “scared but determined cyclists”. Both of them live in London and predominantly get around by bike. They are the result of two key personas that emerged through 32 survey responses and 9 interviews.

Mapping out differences & similarities

In order to address the needs of both user types I identified the main differences and more importantly similarities in their approach to cycling. A few affinity diagrams later I arrived at the following.

While I found numerous differences between the two profiles it became apparent that I would still be able to address both their needs with some well-planned user flows.

Yet despite their differences I found various similarities.

One of the most interesting findings was their inconsistent route preferences. Tom doesn’t always want the “fastest” route particularly when cycling with friends who aren’t used to cycling in the city. While a user persona like Amy believes that as she gains confidence she may not always require the “safest” route.

I found what frustrated these users the most wasn’t whether a route was fast or safe but when the route they were provided with let them down by not matching their needs at specific moments.

Based on this mapping process I reached a key finding which encompasses both of my user’s needs:

More control over route planning = happier cyclists.

While I may not be able to control what happens to a cyclist when they are already on the road I can give them more control of their route before they get onto the road.

My next step therefore was to design options that would allow for better control over route planning.

Market research

I began this process with market research which I conducted in part during interviews by asking participants to show me how they currently plan and adjust cycling routes on their phones. As I observed them I asked them to point out both useful elements and pain points.

These are a few of the key pros (green) & cons (red) that my users found during the process:

Guiding principles

Before mocking up any wireframes I gathered all the information from the surveys, interviews and market research to draw up the following three guiding principles:

User stories

I then turned these guiding principles into the following user stories:

1# Ability to adjust route options beyond “safe” & “fast”

“As a cyclist I want to be able to tailor my route sometimes so that I can accommodate for the times when I might be in rush, tired or with friends.”

2# Setting preferences has to be quick and easy

“As a cyclist I need to be able to change my route preferences so that I don’t need to stop in the middle of the road for too long.”

3# The result from setting preferences needs to be immediate

“As a cyclist I need to be able to see how my preferences change the route so that I know where it will be taking me.”

These stories helped me to tie all my research together and bring the focus back to the user.

User flows

I then turned to user flows to help me visualise solutions that would allow both Tom and Amy as user types to fulfil each of the user stories that I have outlined.

I designed the user flow according to both Tom’s and Amy’s user stories for their “average” cycle. I have shown two paths for Amy as at this point I wasn’t sure whether this user type would go straight for setting a custom route when presented with the option.

Lean approach

This next phase took me to Look mum no hands! a cafe come bike workshop in central London for some Guerrilla usability testing.

I wrote a couple of user tasks and asked participants to talk me through what they were seeing as they tried to complete the task

By testing sketches and wireframes constantly I was able to adapt and reduce my own design assumptions.

wireframes attempt #1

(a hot mess)

At this stage I was trying to work out a way of drawing the users attention to route setting options.

However, most participants were overwhelmed and confused by the number of options.

Challenges #1

Moving forward I sought to answer the following questions which had arisen from the first test:

  1. How can we make route preferences more obvious but not an inconvenience?

2. What do people want to control?

3. How can we make route setting easy to use?


wireframes attempt #2

I decided to remove the settings options from the first stage of the route planning journey.

I played with the idea of onboarding in order to highlight this option as I wasn’t sure whether users would discover the settings icon.

I kept feedback from the different route options present in the form of “bike friendliness” however I was still insure how to present it at this stage.

Based on the second round of usability testing I went on to explore the following challenges:

Challenges #2

Is onboarding necessary?

What does “bike friendliness” look like to someone?

Does “bike friendliness” motivate the user to adjust theroute?


wireframes attempt #3

I removed a “balanced” option as it confused many users and replaced it with the custom option. This way I was able to draw more attention to the fact they could set their own route preferences.

A traffic light colour system helps to enforce the idea of “bike friendliness” with green being the highest percentage possible and red the lowest.

To further emphasise the “bike friendliness” I added the same colour system to the route.

I went with a meter design rather than traffic lights as numerous users didn’t see the link between traffic lights and cycling.

I moved forward with the following challenges:

Challenges #3

  1. How could we convey bike friendliness better?

2. Where could I place the button to set and / or adjust custom route preferences?

3. What should the settings page look like?


Card sorting

Guided by principle #1 I needed to determine which aspects users would be able to adjust and how exactly they could adjust them. To do this I set up a card sorting activity with a few participants.

On the left I gave participants cards from “reduce” and “avoid” to a “min to max” scale along with some blank cards. On the right I wrote down a number of the issues and positives mentioned in the earlier stage interviews such as “number of turns” and “parks” with more blank cards.

Guided by principle #2 I went with a simple checkbox design. I grouped elements into “avoid”, “reduce” and “include” according to the combinations made during testing.

Most users understood the floating star button to be the ability to save set preferences as your custom default and the green tick as “done”.

wireframes attempt #4

Guided by principle #3 I decided to add a pop up after route preferences had been set to draw attention to any change that may have made on the route.

I found this pop up helped users to understand what “bike friendliness” meant and it made them more inclined to adjust a route if the percentage was below 50%.

Further design considerations

While final usability testing presented promising results, the following challenges arose that should be considered for further design:

  1. The settings button next to the custom option is a little clunky and many users didn’t understand that it was to set their custom preferences.

Potential solutions:

  • Make it clearer when custom preferences have already been set and applied.
  • Move the settings icon away from the custom route option.

2. The “bike friendliness” pop up slows the user journey and therefore while it fulfils design principle #3 it hinders design principle #2.

Potential solutions:

  • Maintain “bike friendliness” present on the settings page so that the user can directly see how their preferences affect it.

Final thoughts

So did I manage to make urban cyclists feel safer?

In theory, yes but further field testing is required.

Through usability testing I designed something that genuinely improved urban cyclists route planning process. They found my solution quick, easy and importantly enjoyable to use.

But this was all before they actually saddled up and got out onto the precarious roads of London.

The next test would be to try the MVP out on some real cycle journeys in order to truly evaluate how well this solution provides cyclists with something that gives them more control, simply and sensitively.


Any comments or suggestions are always welcome. Thanks for reading.

Ashley O'Callaghan

Written by

Curious and creative UCL graduate passionate about Service Design.