Cykel

Urban Bike Navigation

Role

User Experience, User Interface, Device Design (ID), Orthographic Drawing, Gesture Mapping

Client

College Project

year

March 2017

Project Details

A few summers ago, I biked 400-miles across New York State with my Mom.

So when I was tasked by a professor the following semester to design a system to display real-time data, I instantly thought of cycling data. I researched the apps available in the market at that time, and and identified a gap in the market for urban bike navigation.

Background

An underserved market: Bike Messengers

Focusing on urban navigation led us to discover a niche: bike messengers. Cities around the world are full of bike delivery services. With the rise of Uber Eats, Rappi, Grab, etc. we thought messengers would be a perfect target audience for this new concept device.

We launched the project by conducting both user and competitive research, while brainstorming scenarios to determine how the device would be used, and how to make it safe to ride.

Highlight

A product concept created with a specific customer in mind

We designed Cykel to be a powerful partner for bike messengers. We not only created screens to provide route directions; we conceived features that specifically benefit urban riding. Real-time traffic and weather alerts update riders on potential hazards or delays on their current route. A single swipe can be used to dismiss or update route options. In effort to anticipate future integrations with delivery apps around the world (e.g., Grab, Rappi, Uber Eats, etc.), we also created a quick add routes feature. Riders would get an alert right on their device when pinged with a new delivery route which with a quick swipe left or right, they can accept or dismiss.

We needed to create a device that not only displayed real-time data and directions, but was safe to use in the hustle of city traffic.

solution

Built for Safety at Any Hour

To increase safety, we wanted to make sure our device reduced eye strain at any hour day or night. We designed two sets of screens: a light mode and a dark mode. We also chose to isolate individual turn information from the wider map view when riders get close by highlighting the directional arrow in red with an enlarged distance to turn. Little details such as these allow for safe riding 24/7.

takeaways

Extra Care When Designing for Transportation

Working on a real-time data app, specifically one to be used in busy traffic while on the move, provided many challenges and learning opportunities. When designing for these scenarios extra care needs to be taken with both the user experience and the user interface to ensure the safety of the operator. UI/UX designers and product developers need to think of everything that could happen while the user is operating the device, and the user experience must take a back seat to user’s primary function, in this case, the ability to ride.

User Testing

While we only did limited user testing, it showed the power of asking the users what we should be doing. By printing out real-size screens and taping them to a bike we were better able to determine the right size from everything from the bike to the text to improve both the safety and usability of Cykel.

How Could We Improve?

After completing the project we discovered a few alternatives that would make it even safer to interact with Cykel on the go. The addition of lights on the outer edge of the device to signal turns and alerts, paired with noises/vibrations there would be no need for riders to look down. If we could find an effective way to incorporate voice controls in busy traffic, users wouldn’t even need to take their hands off the handle bars.