Mating calls, warning grunts, and supportive coos are some of the sounds heard throughout the animal kingdom. All species use finely-tuned noises to communicate to one another and inform others of an action or behavior. We humans aren’t all that different.
Although we have a spoken language that is heavily complex, humans also use sound to communicate (the French, for instance, have an array of verbal cues that never form a word). As we’ve constructed cities and societies, we use all sorts of sounds to signify meaning. A truck beeps to warn others as it reverses, the kettle whistles when the water boils and the sound a highly-designed BMW car door makes when it closes signifies engineering prowess. And, with the ever-present digital world, a text message ping draws attention to a notification.
Audible sounds are integral to making sense of the world and our surroundings. Shouldn’t they be just as considered in the interactive experiences of UX design?
Why Consider UX Sounds in Design?
Just as a dog’s growl provides feedback to an antagonizer, sound in a digital situation should function in the same way. Jakob Nielsen, creator of the 10 Usability Heuristics Principles, is adamant that feedback is essential to a successful user experience. It’s useful in sharing the status of a user’s action, in preventing errors, and in equipping the user to recognize, diagnose, and recover from errors.
What designers often forget is that visual components aren’t the only way to accomplish these things. Sound design in UX can (and should) contribute to:
- Providing feedback on a user’s action or system status
- Building context and understanding of a use case
- Drawing attention to important information, such as a warning or opportunity
- Establishing brand personality and recognition
How to Balance Form and Function
A sound that is beautiful but doesn’t serve a UX purpose and a sound that functions but doesn’t match the brand’s tone of voice are both missing critical components. Creating interface sounds involves both an ergonomic/usability perspective and a creative/branding one. The key to making them converge into a refined final result is to think of them as interdependent. The following tips will provide a guide for creating sounds as part of UX design that are both useful and beautiful.
First, Focus on Utility
When interacting with features on a product, people love what they find useful. Audio features are no different. Therefore, before diving into Ableton to design striking sound effects, designers should first think about the key actions for which users might want to receive feedback.
The best way to identify possibilities for sound cues is to look at the user flow. Consider where sound can enhance the full user experience. Is the upload done? Did something go wrong while saving a file? Is the device charging? Does the user need to act on something? The function of sound can be most effective when providing audible feedback to an interaction.
Use Metaphors Instead of Skeuomorphism
When creating a “match between system and real world” (a fundamental usability principle from Nielsen’s Usability Heuristics) a designer can either reference physical objects or feelings and experiences.
The first approach is called skeuomorphism, a method that makes digital interfaces look or flow like their analog counterparts. You’ve probably seen this first hand if you’ve ever used Apple’s Notes app mimicking a yellow lined pad of paper, or if you’ve deleted a file and heard the crumpling of paper.
While this strategy might seem like a user-friendly solution, it generally renders soulless interfaces. Skeuomorphism rarely creates an emotional bond with a user. Unless the design calls for 90s nostalgia, it’s best to not use literal visuals and sound effects.
A more humanized and sophisticated approach is to evoke or mimic the emotions surrounding a certain interaction. Designers can use the sonic metaphor: an abstract audible feedback that users can immediately interpret and recognize because it feels like experiences they’ve had in the past. Emotions associated with scenarios like a surprise, a new beginning, and completing a task can be incorporated into their digital counterparts.
Unlike skeuomorphism, metaphors do not demand literal visual or sound recognition. Rather, the sensation a metaphor evokes during an interaction connects to a familiar and emotional experience.
Create a “Sound Style Guide”
A brand or design system uses a set of predetermined elements at every touchpoint that establishes consistency and cohesiveness in the user experience. Sound should be treated the same way as creating a style guide for a visual interface. It should be seen as various rearrangements of a set of elements. Perhaps a product could use similar timbres for each tune, or incorporate natural sounds, such as water drops, windy whispers, and a sand rattle.
It’s important to note that these concepts both emerge from, and build a product’s brand personality. Visual UI design components, microinteractions, and sounds will all aggregate in the user’s perspective and shape how they perceive a brand.
Keep UX Sounds Simple
Dieter Rams, the iconic product designer, crafted ten principles of design that still stand strong today. The tenth and final principle is: “Good design is as little design as possible.
Less, but better—because it concentrates on the essential aspects, and the products are not burdened with non-essentials. Back to purity, back to simplicity.” Sounds should be concise in their intent, rather than excessive.
Harmonically complex sounds indicate priority and draw attention to things of great importance. Consequently, when sound provides feedback to an action that doesn’t require immediate attention, a complex sound isn’t appropriate. In fact, it can cause more harm than good if a user addresses the sound to find nothing of importance.
The same level of simplicity applies to the length of a sound in UX design. As a rule of thumb, a transition or micro-interaction sound should never last more than 0.3 seconds longer than its associated animation. A sound should be just short enough to be perceived by the user. As a reference point, the Samsung whistle notification sound is overly excessive.
Design UX Sounds for the Device
When a mobile or web app is in the hands of a user, it’s likely the sounds are going to be reproduced through not-so-hi-fi speakers. Usually, mobile devices and laptops are designed to cut low frequencies down and boost mid-high frequencies. Designers should listen to their tunes through the devices they are designing for and ask:
- Does the sound feel heavy or muffled? Remove some of the lower frequencies and accentuate the higher ones.
- Does the sound feel squeaky or brittle? Carve out some of the higher frequencies and fatten up the medium to low range.
Since middle-range frequencies correspond to the human voice, portable devices tend to have a fairly decent response. Designers should use that to their advantage.
Mind the Repetitive Tolerance in UX Sound Design
Have you ever set your favorite upbeat song as your alarm sound? How long did it take for it to become unbearable?
Repetitive tolerance indicates that there is a limit to how often we can stand hearing the same sound over and over. It might be satisfying to hear a “ta-da” sound every time a task is marked as complete, but by the 100th time, people might prefer to use an alternative (silent) tool to check off completed tasks. Or, worse yet, the undesirable sound might have an impact far beyond the product and cause the user to procrastinate just to avoid hearing the annoying tune. There’s a limit for the number of times a sound is repeated before we wish it never existed. What’s more, the threshold falls significantly lower the more complex a sound becomes.
Audio clutter is often more annoying to users than a messy visual interface. Users can—and will—mute apps that have repetitively aggravating sounds, such as a beep every five seconds. As a general rule of thumb, the more frequently a sound occurs in a product, the more subtle, shorter, and warmer it needs to be.
Testing UX Sounds
User testing is standard practice for UX design. It’s just as important to test an interface with and without sound—mute and unmute. The user experience should be equally cohesive in both states. Additionally, users should always have an easy way to mute the product’s sound during testing and the frequency at which they toggle it on and off should be recorded.
All users’ abilities should be included in testing. While audio feedback can be very useful for visually-impaired people, a visual counterpart might be important to ensure that hearing-impaired users don’t miss an essential part of a product.
Just like the rest of an interface, iteration is fundamental to achieving sound effects that users will love. Designers should be on the lookout for unnecessary sound cues as well as interesting opportunities where sound could enhance the experience.
Unleash the Power of UX Sounds
There are biological reasons why humans rely on sounds to communicate and make sense of the world around them—audible cues often provide feedback to an action or behavior. UX designers who integrate sound design into user experiences can create a multi-sensory interaction that will prove to be very effective. As smart devices become more ubiquitous in modern society, sounds that are both beautiful and useful can enrich an experience in a non-invasive way. Sound can greatly contribute to an impactful product’s success.
• • •
Further reading on the Toptal Design Blog:
- Tips for a Productive Design Critique
- Prominent Factors in Bad UX
- Creating a UI Style Guide for Better UX
- Experience is Everything – the Ultimate UX Guide
- Sharpen Your Skills: The Value of Multi-Disciplinary Design
Understanding the Basics
What does Skeuomorphism mean?
Skeuomorphism is a method that makes digital interfaces look or flow like their analog counterparts, e.g., Apple’s Notes app mimicking a yellow lined pad of paper or a deleted a file making the sound of crumpling paper. It generally renders soulless interfaces rather than creating an emotional bond with a user.
What is UI/UX testing?
User testing in UX design helps to understand how and why a user might use a product. In UI design, testing helps to understand how effective visual and interactive components are. Testing contributes to iterative design and is essential in making products that users need, helping to ensure a product’s success.
What are heuristics?
Heuristics are mental shortcuts that help make quick decisions. In UX design, there are various principles that have been developed over time that help designers to quickly assess their work and improve usability. These heuristics are rules of thumb rather than specific guidelines.
What are usability principles?
Usability principles are rules of thumb that have been developed over the lifetime of UX design. They are broad rules that guide the design of a product and will help ensure the user will have a satisfying experience. Examples include maintaining consistency and standards or provide user control and freedom.
Why is sound design important?
In UX design, sound design is important because sound amplifies visual components in 1) providing feedback of a user action or system status, 2) building context and understanding of a use case, 3) drawing attention to important information, such as a warning or opportunity, and 4) establishing brand personality.