UI Sounds and Product PerceptionNovember 21, 2022
Types of UI sounds
Skeuomorphic vs Abstract
We can separate UI sounds into two main stylistic categories: abstract and skeuomorphic. Abstract sounds are usually musical representations of various concepts. For example, deleting a document on your computer could be represented by playing two tones going downwards, both to signal that you have put the document “down” into a trashcan or similar, and also to signal a negative state, as, in very broad terms, tones going upwards are usually considered positive and tones going downwards are usually considered negative. You could also use a glide (an effect where one tone goes to the next in one continuous sound) between the two tones, to give a reference to the drop/throw sound we know so well from cartoons.
Skeuomorphic sounds, on the other hand, are real-world representations of sounds. That means using sounds we already know from our experience in the world and using those sounds in our UI landscape. For example, deleting a document on your computer could play the sound of crumpling paper or even a paper shredder, as we know these sounds from our experience with throwing out/deleting paper-based work.
It’s hard to say which of these sounds is the best, as they both have their pros and cons. Skeuomorphic sounds are easy to recognize and understand quickly but lack identity and specific brand recall. Abstract sounds allow for much more identity and flexibility, but it takes time to learn their functionality and how they work in relation to each other.
Hero sounds are positive and branded sounds that occur whenever you want the user to feel especially good. Examples of this could be when starting up an app, winning a game, or completing all your tasks for the day.
These sounds should be used both sparingly and strategically to get the most emotional impact from them.
Notification sounds are sounds that grab the user’s attention. This could be when receiving a text message or when being informed that a process like a download has been completed.
It’s important that notification sounds aren’t perceived as annoying, as they are usually played quite often, therefore they are usually also quite simple and easy to understand. From a strategic point of view, they can still be branded since it is a perfect place to hammer home the audio identity and make people feel connected to the sounds, as well as distinguish them from notification sounds from other applications.
System sounds refer to all the sounds that we hear when using a product or an app. Sounds for pressing buttons, navigating menus, confirming, declining, and error messages are all part of this category.
Ambient sound is a category that isn’t used as much as the others. These sounds provide an atmosphere that makes the user feel welcome in the experience. An example of usage for this is providing a gentle atmosphere when starting or shutting down an app, having tailor-made music/ambience in a meditation app, or having rain sounds in a weather app when it’s raining outside.
Now that we have a good understanding of the different types of UI sounds, let’s take a look at how we can make these sounds provide meaning and usability in relation to each other.
To establish a good relationship between sounds and make sure that they provide effective communication and meaning to the user, we use mappings. A mapping is basically a relationship between two items. We use it to build logical frameworks to design the sounds around. This ensures that our designs are always human-centered and as easy as possible to use.
Let’s take a look at a simple example of how mappings could work in sound.
If we have an “Unlock” sound that sounds like this;
Then it would make sense that its counterpart “Lock” sounds like this;
Take a look at this illustration below of a stove mapping and ask yourself “What is the difference here between a good and poor mapping here?”
Mapping UI sounds is a complex process, but one that helps merge the usability of the physical product with the actual sounds. UI sounds can enhance a certain physical mapping by making it more obvious and intuitive, but if used incorrectly it can also make the usability of a product much more difficult and muddy. Therefore, it is important to iterate upon and test the sounds, to make sure that they achieve the goal that they were meant to serve.
How Does UI Sounds Affect the Perception of a Product?
Now, you might think to yourself; “Does all this effort that goes into creating custom UI sounds really matter? Can’t we just use the same generic beeps and boops we hear everywhere?”.
While using generic sounds is certainly a possibility, it comes with some significant drawbacks. A 2021 study from our partner Veritonic, delved into the difference between using generic sounds and premium sounds (tailor-made sounds that are designed for a specific product or brand). In general, premium sounds outperformed generic sounds by 30% in terms of preference. Let’s delve into some of the specifics.
On the question; “Which product would you rather own?” – 60% of panelists preferred the premium sounds.
On the question; “Which product would you prefer to use?” – 53% of panelists preferred the premium sounds.
On the question; “Which product has more personality?” – 60% of panelists preferred the premium sounds.
On the question; “Which product do you think is more trustworthy?” – 60% of panelists preferred the premium sounds.
So, as you can see, the use of premium sounds greatly affects how a user perceives a product. It is important to remember that all premium sounds should always be within the same auditory family, as this will help make the overall experience more cohesive, recognizable and as the study shows – more trustworthy.
“Sometimes the best sound effect is no sound.”
How Do We Design UI Sounds for Your Brand?
Just like any other piece of brand material, UI sounds need to be based on the brand personality. When we have identified and discussed your brand personality, we establish some keywords that we work from throughout the process (for example, you want to be cool, calm and collected). This helps us stay in line and not stray too far from the original identity.
If there is already an audio logo and/or a piece of brand music in place, the best practice is to derive the UI sounds from their sound design and instrumentation. For instance, an audio logo may both have some piano and some guitar in it. We could use piano sounds for notification sounds and use guitar sounds for hero sounds.
Keeping a good structure is also important, especially when working with a large amount of UI sounds. This means having a clear hierarchy between the sounds, to know which are the most important and which will be heard more often than others. Also, it is beneficial to have a clear hierarchy describing how each UI sound should sound, differentiating between if a specific sound should for example be “Complex <-> Simple”. This makes it easy to communicate with both technical and creative teams.
All in all, UI sounds are hugely important for product perception. Creating custom sounds for your UX and products makes them more trustworthy, on-brand, and personality-filled. But custom sounds aren’t just enough. Sounds still need to be designed for specific purposes with usability in mind, otherwise, it will muddy the communication and make it more frustrating as well as confusing for the user. Sometimes the best sound effect is no sound.