XU/UI Design Case Study
A Not-so-brief Description
Cycling is the most efficient, affordable and environmentally friendly way of getting around the city, but a large number of Torontonians view it as unsafe and far too stressful, and opt for the overcrowded streetcar instead. Even committed cyclists are the first to admit they often take certain routes to avoid the threat of automobile traffic. The stress brought on by the thought that at any moment, a driver could make a small mistake that could seriously injure them is just the cost of a fast and cheap commute.
Through user research, it became apparent that while cyclists all know their commute is the quickest and most efficient way to travel, they become frustrated by the ever-present conflict between themselves and automobiles. You will often hear those who commute and travel primarily by car complain about the unpredictability of cyclists who appear out of nowhere from their blind spot and shock them. Cyclists lament that they must constantly remain vigilant as most drivers in the city do not pay enough attention to cyclists. Both sides see the other as unpredictable and so at its core, the stress of cycling comes from feeling a lack of control over their environment.
How might we enable cyclists to take control over their commute, and thus encourage more people to choose cycling as their main form of transportation? Increasing the number of cyclists on the road could have far-reaching effects and even encourage city spending on cycling-focused road infrastructure. Imagine less automobile traffic, less congestion on the TTC during rush hours, reduced carbon emissions, cleaner air, and a healthier, happier population. We can’t change the world with an app, but let’s try anyway.
BRiNG is a cycling navigation tool and cycling community with safety features that aid cyclists in navigating to their destination, and provides them with both a bell and light, ensuring they will be both seen and heard by automobile traffic. BRiNG sits atop your handlebars and rides with you the whole way. Take back your commute and BRiNG it with you.
User Needs:
Navigate to their destination safely and quickly
Bike bell at fingertips to alert cars of your presence
Automatic light for cycling after dark
Offline and low battery mode so the user won’t be caught in the dark during their ride
Design Rationale
It’s important that the aesthetic of the app convey trustworthiness, confidence and control, but also be youthful and energetic. BRiNG is your protector and your independence all in one. BRiNG is the sweater your mom makes you pack on your way out the door. It’s the all-in-one pocket knife given to you by your grandpa, and you don’t leave home without it. BRiNG lets you go where you want, whenever you want, and makes sure you’ll get there safely.
The colour palette features two primary brand colours: a dark navy for its associations with security, confidence and trust, and a deep yellow, communicating both energy and optimism. Implementing a tetradic colour scheme allows for bright punches of orange and softer blue hues to distinguish settings and highlight important action buttons. Green is added as the turn indicator colour because of its universal associations.
BRiNG is a tool you need, but also a toy you want, so the typeface is a clean and modern sans-serif to reinforce sophistication, simplicity and strength.
To remain approachable and engaging, rounded design elements are used for menu navigation. The main bar menu is modeled after a wheel, and employs atmospheric perspective to indicate to the user which screen and setting the user is currently on. Intuitively, the user simply swipes left or right on the wheel to change modes, settings, or view their profile. Once in navigation mode, all bells and whistles (figuratively speaking of course!) fall away and it is the just the user and their route. Turn-by-turn navigation messages are communicated clearly by taking full advantage of the screen, requiring the least amount of user’s attention, so they can focus on possible obstacles in their environment.
The bell is located ergonomically in the bottom corner of the screen so it can easily be reached by the user’s thumb when needed, and can be customized in settings for both left and right handed users.
Employing line iconography with a slightly thicker stroke keeps things sophisticated, fresh and accessible but not overly delicate. Line iconography has an implied sense of movement that helps to develop an approachable and engaging atmosphere. The app’s distinguishing feature and inspiration for its name is the bell, and so it was an obvious choice to represent the brand. In addition, the ringing of a bell is more of a friendly reminder, rather than an alarm or warning, and thus cultivates a neighbourly and affectionate versus antagonistic image of the brand.
In Addition:
In the idealistic future I’ve imagined, the BRiNG app would not just be for cyclists, but for drivers as well. Fully connected, when you ring your bell, any drivers also running the app in a set radius would hear a friendly bell from inside their car - increasing its range and effect. The motivation on both ends of the exchange would be to cut down on cyclist/driver incidents, but could also serve to create a human connection from within the perpetual battle between cyclists and drivers. This future app would allow users to see who they “pinged” along their route and view profiles of those users and their stats. However, I felt tightening the scope to design for cyclists first was a more beneficial exercise for this assignment.