5

I came across a brief guideline that talked about how to do UX design for sound, and there were some very sensible advice that covered a number of points including:

  • How to decide what type of sound to create
  • How to create the audio file
  • How to decide where and when the sounds is triggered/used
  • How to implement and test for improvement

So it seems like audio cues or interactions fit quite naturally into a design guideline, but I don't know if it is commonly covered in design systems or frameworks in such detail.

Given the amount of attention and focus on accessibility, are there design guidelines or frameworks that dedicate an adequate amount of information on the design of audio/sound elements? What are some good examples that you have come across?

Improve this question
1
  • As Rogue-OP's answer says to keep in mind, you should have not just an option to not make sounds, but should ensure the UI still works without sounds. As an indication, according to this Digiday article, 85% of video views (at a couple of sites on Facebook) happen without sound.
    – TripeHound
    Feb 18, 2019 at 15:50

4 Answers 4

Reset to default
6
+50

The W3s WCAG Accessibility Guidelines: http://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-dis-audio.html basically states to remember that SOME users are using screen-readers (so you want to avoid auto-start any contrasting audio), and of course others are deaf (so whatever is supposed to be communicated via audio needs to be communicated another way).

Some of the "sufficient techniques" listed include:

  • G60: Playing a sound that turns off automatically within three seconds
  • G170: Providing a control near the beginning of the Web page that turns off sounds that play automatically
  • G171: Playing sounds only on user request
  • FLASH34: Turning off sounds that play automatically when an assistive technology is detected (Flash)

Their example for visuals is, instead of a green arrow at the bottom of a page to indicate "continue", have both the alt text AND text in the graphic say "press this arrow to continue" (and perhaps add a black outline, so color-blind people can see the contrast more easily.)

For audio, I think that instead of ONLY relying on a sound to indicate "success" or "fail", think of it as "frosting" - just a reinforcement of the basic text indication.

NNGroup hasn't done a ton on audio recently, but they have been looking at Audio-Interfaces (such as Siri, Alexa, HeyGoogle, and more), and it divides audio cues into a few kinds:

  1. Nonverbal sounds, or earcons (auditory icons), which are distinctive noises generated by the system, usually associated with specific actions or states. For example, Siri emits a 2-tone beep after detecting its activation phrase, to signal that it is now ‘listening’ for a command.

  2. Explicit verbal signifiers, when the system verbalizes a suggestion or request to let the user know what commands are available. For example, if you tell Google Home to “Set a timer,” it responds with “Ok, for how long?”

  3. Implicit verbal cues, when the system hints that an action is possible, without fully articulating the suggestion.

The article goes into more detail, indicating how just as visual icons can be confusing, the same goes even more so with Earcons and implicit cues. I don't know if this audio-only interface information is what you're looking for, but I thought it may help.

Update July 2019: Google has added sound to their Material foundation.

Improve this answer
5
  • +1 Nice answer! Would definitely like to see more of your contributions to the community :)
    – Michael Lai ♦
    Feb 19, 2019 at 22:04
  • Thank you! I miss teaching, so contributing here helps me consolidate what I'm learning about accessibility and seeing more places to apply it.
    – April Salutes Monica C.
    Feb 19, 2019 at 22:28
  • Where were you teaching? Be sure to search the accessibility tags because you'll find plenty of questions there :)
    – Michael Lai ♦
    Feb 19, 2019 at 22:31
  • I was at a local university, doing ENGL100 and similar, but one can only adjunct for so long. (Is it ok for comments to go this off-track?) Anyway, I do follow the accessibility tag here, as well as audio, sound, some design ones.
    – April Salutes Monica C.
    Feb 21, 2019 at 14:12
  • 1
    Don't worry, it is the job of the moderators to try and keep comments on-topic :D But we do like to give the new comers a little bit more consideration and help ease them into the community - getting to know them better would certainly help to do that :)
    – Michael Lai ♦
    Feb 21, 2019 at 22:31
2

As an industrial designer and music producer, I agree that sound is important for accessibility. The design of audio/sound elements and a user's perception to them lies more in the field of music theory, specifically Music Psychology.

However, keep in mind that some users prefer that their products/devices do not make any sounds. In which case it's good practice to give the user the ability to disable the sounds. A bonus for the user is the ability to adjust the volume level.

Improve this answer
1

Google has guidelines for Conversational UI of which one of the presentations is obviously voice but it's not audio specific. Also, Wayfinder's Open Standards group has a section on Audio Design but its extremely basic.

Overall it does seem to be a huge gap that the UX design community should consider addressing.

Improve this answer
1

Here are some useful articles about UX for sound I used for a project a while ago:

Susini, P & Houix, Olivier & Misdariis, Nicolas. (2014). Sound design: An applied, experimental framework to study the perception of everyday sounds. The New Soundtrack. 4. 103–121. 10.3366/sound.2014.0057.

Carron, Maxime & Dubois, Françoise & Misdariis, Nicolas & Talotte, Corinne & Susini, P. (2014). Designing Sound Identity: Providing new communication tools for building brands "corporate sounds".

Will Littlejohn (Sound Design Director @ Facebook) - How to enhance mobile interactions with sound design https://medium.com/facebook-design/how-to-enhance-mobile-interactions-with-sound-design-3c3b30e98177

Improve this answer
1
  • +1 Thanks for your contribution to UXSE. For completeness of the answer it would be good to summarize or point out some key points in the references.
    – Michael Lai ♦
    Nov 8, 2018 at 13:42

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.