Motorcycle cluster design — For bikers, by bikers (2024)

“With biking, it’s not the destination… it’s the journey”

Simon Child, designer at ustwo and co-author

A short version of this post was published in Core77’s blog recently. It can be read here.

The last two years has seen a sea change in motorcycle instrument clusters. The interface has moved from traditional dials and LCD displays to TFT screens as seen in cars. This has allowed bike makers and designers to utilise every pixel, colour range and motion possibility to the maximum — and going by current trends they are.

But with the freedom to display anything on this relatively small high definition screen, comes the issue of displaying too much information.

This ‘featuritis’ tendency as we call it is a common trend in automotive interfaces — which is unfortunately creeping into motorcycles as well. With motorcycle manufacturers making the same mistakes as car manufacturers, no one seems brave enough to step away from the standard conventions.

There is a tendency towards excess without really understanding what riders want to see — without the risk of adverse distraction. Also we see that manufacturers are not considering the opportunities offered by the contextual understanding afforded by the connected vehicles of today — which can make riding safer.

This thought piece speaks about this issue of excess and brings the focus back to the needs of the rider and an understanding of context — in defining the best possible user experience for a motorcycle’s interface.

Most importantly this is written by bikers — for bikers and the motorcycle industry in general. It is about bringing the passion, beauty and experience of the engineering and styling involved in the physical artefact that is the motorcycle — into the digital experience. We really hope that it delivers a set of guidelines and a point of view that will help the industry veer away from ‘featuritis’ and start a positive dialogue.

This post is also an extension of our in-depth thinking into automotive human machine interfaces (HMI) which you can read in detail here.

But firstly, a little disclaimer…

We would like to make it clear that our intentions for this piece are not to point out the flaws in other designs, but merely to bring to light our own thoughts on the direction of future motorcycle HMI. There are many aspects to motorcycling and each rider will have their own level of expertise and individual experience.

From the huge array of motorcycle types, we have decide to narrow our focus on a small (but popular) aspect of biking. The urban commuter/casual sunday rider, this is one that most bikers can relate to at one point or another. We feel this is a good place to base our discussion on.

Likewise, there are many rules, regulations and standards that should be considered. Given this is an early exploration — we are just going to focus on some rules and regulations we think have a higher capacity to be contextual and re-imagined for now.

This will give us the freedom to explore the possibilities for future HMI without being encumbered with every single regulatory adherence and make the best use of technologies that exist.

Two very different bike interfaces, with very different needs…and we are focusing on the one below, the BMW.

“We are attempting to make the best use of available technologies, not just tech for tech’s sake”

Harsha, designer at ustwo and co-author

But TFT displays — is it new tech?

A Thin Film Transistor liquid crystal display (TFT-LCD) is a technology which is used in LCD monitors and television displays. TFT technology can be used to give one of the clearest pictures of any flat screen display and it uses much less electricity than older screens.

This tech is not new, but the past year or so we have seen an increasing number of motorcycle OEM’s introducing TFT displays into a large range of motorcycle models for the first time. But as mentioned earlier, with the freedom to display anything on this relatively small high definition screen, also comes the issue of displaying too much information — the ‘featuritis’ tendency.

Featuritis in HMI design, we believe, is a symptom of applying a design for mobile approach to a completely different context. And while as graphic designers we’re used to trying to attract and keep attention with our designs, HMI in vehicles need to do the opposite, never distract and keep the attention of the rider for as little as possible — be contextual, meaningful and not distracting.

Overloading a small screen with information causes plenty of problems. And for a motorcyclist, you are far more vulnerable to incident than in a car that has airbags and a seatbelt — not to mention the padded metal or plastic casing all around you. Motorcyclists face an unacceptable level of risk on London’s roads. Despite the fact that motorcycles account for just one percent of journeys made in London — 27 percent of people killed or seriously injured on London’s roads are motorcyclists.

So motorcyclists can do without the distraction of displays. But something contextual can actually be safer.

A rider sometimes has to take their eyes off the road for a split second, to check if they are within the speed limit or perhaps to see that splash of colour change due to the rev change. That time could be the difference between another road user not checking their blind spot and causing the rider to come off. A simple principle that we should follow would be:

What does the rider WANT to see vs What does the rider NEED to see

Both can be important — they need to be given their due diligence and treated differently in design. This simple difference in logic can help designers and technologists make the decision on which form the information can take on a display, while also thinking about all the advantages of connected technologies within the motorcycle (GPS, bluetooth etc).

This leads to our point of view.

Key element 1: Clean and adaptive insights — reduced clutter

We have used the principle of ‘adaptive hierarchy’ to fundamentally relook at all the tell tales and the information presented on screen. The motorcycles ignition kicks off the startup for the interface and also a systems check which then flows into a clean uncluttered interface. The tell tales such as engine health lights remain lit if there is an issue or fades away to the fuel range and gear indicator if everything is okay.

Our goal was to keep the most important highlights at the forefront, for the everyday rider. But that does not mean they will not be able to see details — which will be just under one layer of interaction.

All motorcycle displays — digital or analogue, show the speed even when that speed is 0. With the kickstand down and gear in neutral, the rider does not need to be told that the bike is stationary. We have decided to use this scenario edge case to display something the rider would find useful. By displaying the bikes range above all else, the rider can now decide if the countryside is the first stop on their journey or the petrol station.

Key element 2: Contextual and connected information

Our first step in working on the cluster was to think deeply about connectivity and all the contextual information that can be offered to a rider.

It goes against traditional methods of design where ‘all’ information is laid out on screen, instead we are asking the question — ‘when is the information important to be seen?’ This can be both automated based on machine learning meted out to the machine or customisable by the rider manually themselves.

Both approaches are appropriate when used correctly and here are a few examples when we can use automated decision making to keep the rider informed and safe when something is wrong — only on a need to know basis keeping safety first and foremost in mind.

We believe that this is a basic means to gain people’s trust in the technology over time. Helping riders shift their focus to the important things like riding safely and being aware of other road users — rather than having to keep on eye on speed limits or lane information.

Key element 3: Glanceable and gradual escalation of feedback

Similarly to our original in-car cluster piece, glanceability is of huge importance. Maybe even more so for motorcycle riders. Although the key aspects are practically the same, on a motorcycle importance given to elements are very different. A riders vision can be obscured by; their own helmet forcing a more exaggerated look around, rainwater on the screen itself or rain on the visor, glare from the sun, engine vibrations as well as other factors. Taking all of these into account, the time in which it takes to glance down at the display can be severely reduced. We would only have a small window to display relevant information as clear as possible. That in itself is a huge design challenge.

We tackle this issue through different mechanisms…

A. Typeface — Humanist: One may wonder about the efficacy of just changing type on an automotive interface, but a humanist typeface has been proven to have quicker glance times in automotive interfaces — as shown in this wonderful MIT Agelab study.

A 10% decrease in glance times can be valuable in a life and death scenario and hence helped us make the decision to use this family of typefaces in our concept.

B. Typeface — the case for lowercase: Again, a seemingly minor choice in typographical style but one with major impacts. In an interesting talk we attended, one of the designers of British Road signs — Margaret Calvert, brought to the forefront a key justification for her choice of using lowercase type in most road signs.

It is based on how the eye reads words — recognising letter groups at a glance rather than focussing on individual letters. Through the formation of distinctive word shapes, as shown below, reading time and cognition of words and sentences has been noticed to be distinctly faster.

This has been the primary motivation with our focus on lowercase throughout the interface, helping save those precious milliseconds on glances towards the cluster.

C. Motion and the gradual escalation of feedback: Our goal in this concept was to use motion appropriately — only when safe or attention needs to be grabbed without being excessive. We also wanted to keep animations and transitions consistent to create a sense of familiarity, brand and to build trust in the interface over time.

In order to best talk about this we have created the concept of ‘gradual escalation of feedback’. Feedback refers to the visual elements of the interface appearing on screen as the user applies an input such as turn signals, or when the contextuality of the situation prompts some indication on screen for example — ice on the road or strong winds ahead.

For this demo’s sake let’s take breaching the speed limit as an example. As a motorcyclist it is dangerous to actively keep one eye on the speedometer given the need for observing surroundings is much greater, especially in cities where strict speed limits are observed like London or New York. What matters more is to modulate speed in relation to surrounding traffic — and you sometimes need to exceed the speed limit in order to do so, to overtake or evade. But at the same time it does not pay to go way beyond the speed limit which may be both dangerous to the rider as well as other road users.

As you can see in the above gif, as the speed limit is exceeded the interface provides complimentary feedback via a smooth easing animation between the current speed and the pop-up for the roads speed limit. This pop-up eases in to provide a subtle nudge about the breach — keeping in mind the behaviour of speed modulation in traffic and an affordance of 10–15% miles per hour above the limit.

When the rider further increases speed — we see an escalation of feedback via the red rings in the periphery of the interface which appear far less subtly and is used to grab peripheral attention while informing the rider about potential dangerous driving.

So, a smooth transition (what we call “Bouba”) for non critical feedback and an abrupt transition (what we call “Kiki”) for critical feedback. We believe this escalation and treatment of motion can help prevent needless distraction while keeping the rider safe.

Key element 4: Aesthetics — retro revival and customisation

With the retro revival in full swing, motorcycle manufacturers have been busy launching motorcycles with the latest tech partnered with vintage styling. The custom motorcycle scene is booming, with riders meticulously scrutinising over every nut and bolt they put onto their creations, but one of the few things they have little control over is the screen/HMI.

This is the inspiration for the cleaner and more stylish look and feel for the cluster, which also allows for plenty of customisation. This could be a platform for users and designers to build on rather than sticking to a prescribed view.

Much like BMW Mottorad’s efforts to make the R-Nine-T as customisable as possible, through the use of colour, material and tonal variants. We could then pick and adapt key elements into our interface continuing the style and feel of the motorcycle into the display. It is a massive brand opportunity.

Now what about the content’s customisability? Could this mean the beginning of a companion application where riders can choose what they want to see? We think so, but this is a discussion for another blog…

Key element 5: What about the brand?

Biking is about passion and functionality combined — which also extends deeply into branding too. Ducati owners will speak passionately about the styling, handling and sheer Italianess of their bikes, while BMW owners will speak about the efficiency, functionality and tremendous German build quality.

We truly believe that not branding an interface would be a lost opportunity for some of these brands to speak to their riders. As you can see from the previous BMW designs, how easily a flat two dimensional screen can become integrated into the style of the bike.

There are many restrictions around the use of colour which can hinder a brands reach within the clusters design. And typography or a custom typeface, although simple to apply to a digital interface, can cause issues with legibility and glanceability as we have mentioned previously. Not all brands use humanist fonts either so the branding would have to be applied with all these factors taken into account.

Key element 6: Physical control or touchscreen?

It is a rather tempting proposition to think about a digital display as a touchscreen isn’t it? Given the affordances offered by mobile applications. But motorbike interfaces generally rely on resistive screens to make it easy to use with gloves or rather clumsy attempts to use conductive gloves. Bikers can all relate to the pain of using their sat-nav systems with winter mitts on.

A rather sobering functional requirement, also tempered by our belief that in automotive interfaces muscle memory is key to reducing distractions. Motorcycles are all about muscle memory — just describe changing gears and using the clutch to your friend. You do it almost subconsciously, but cannot really describe it clearly without some thought involved.

To enhance muscle memory we really like the use of external handlebar controls as used by manufacturers such as KTM and BMW. A simple array of buttons, with which riders can quickly learn and internalise the workings of the interface.

This is akin to gaming controllers and we believe that simple and disparate buttons or dials are better since they allow for mental maps to be formed faster, between the movement of your digits and the digital elements. For instance, in the above example the KTM interface we used was far easier to navigate through when compared to the jumble that is the BMW GS interface. Only long term use will tell, but our experience favours the former.

To go deeper into the rationale and principles that guide our work on the cluster, it is worth going back to previous post on the in-car cluster found here.

All your feedback is welcome!

www.ustwo.com/auto