← BACK TO SHOP
← BACK TO SHOP

Auditory Icons

Art by Lucas Wakamatsu.

This episode originally aired on Wireframe.

We live in a designed world, and alert tones are no exception. Every beep and ping that your phone or laptop makes probably went through multiple rounds of revisions and approvals. So what separates a good device sound from a bad one? This story comes from the Wireframe podcast, and features sound designer Connor Moore and psychoacoustic expert Susan Rogers.

MUSIC FEATURED IN THIS EPISODE
Lode Runner by Sound of Picture
Lleb by Sound of Picture


Follow the show on Twitter, Facebook, & Reddit.

Subscribe to our Youtube channel here.

Become a monthly contributor at 20k.org/donate.

If you know what this week's mystery sound is, tell us at mystery.20k.org.

Check out Wireframe wherever you get your podcasts

View Transcript ▶︎

You’re listening to Twenty Thousand Hertz.

[music in]

These days, we’re so used to the buzzing [sfx] and pinging [sfx] of our devices, that it often becomes part of the general background noise [sfx]. If you’re in a busy environment, it can almost feel like an amorphous blob of electronic sound [sfx: cacophony of electronic beeps and pings].

But of course, these sounds don’t just appear out of nowhere. Every single one of them was designed by someone. To make it into your phone or your laptop, these little sounds probably went through multiple rounds of revisions and approvals… But even if a sound makes it all the way through that pipeline, that doesn’t guarantee it’s gonna be pleasant [sfx: annoying buzz].

A good device sound is satisfying [sfx: iPhone camera click]. And a bad one can stress you out [sfx: abrasive beep]. It turns out, this isn’t just a matter of opinion. If we want the devices we use everyday to sound good, there are actually some pretty concrete ways to do that.

[music out]

This story is brought to you, and sponsored, by the Adobe podcast, Wireframe. Here’s Host Khoi Vinh.

Back in October, 2015, if you were shopping in the United States, you might've heard something like this [sfx: credit card reader beeping]. The US was transitioning credit and debit cards away from magnetic strips, those black stripes along the back of your cards, over to chip cards. Chip cards are more secure, but they can't be read by older machines. So stores needed new machines, machines that made a sound like this:

[sfx: card reader beeping]...

That sound is to remind you to take your card out of the machine. And for the people who work in stores with those devices, that noise can get really tiring.

[music in]

One day, sound designer Connor Moore visited a local store with one of these chip readers. As usual, he started chatting with the owner...

Connor Moore: They're big Warriors fans. So I always go in there and chat with them about the Warriors. I went to check out and I just noticed the card reader sound for some reason in that particular environment.

Khoi Vinh: It was that infamous [sfx: eh, eh, eh, eh].

Connor Moore: It just really cut through. And then when I was like, "Wow, that's crazy. You hear that all day?" And he's like, "Yeah, man, it's, it's pretty annoying”

Khoi Vinh: But I take it. You remember to get your card. So would you consider that sound to be a success?

Connor Moore: It is a very harsh sound, right? But at the end of the day, all these sounds have to be effective. In this instance, yes, it does get your attention, but there's many other ways that we can go about doing that.

[music out]

Susan Rogers: Sound is a special form of touch. Sound kind of tickles our sensory system and our brain kind of in the way that the touch does.

Khoi Vinh: This is Susan Rogers. She's a professor of music, production and engineering at Berkeley College of Music. She thinks a lot about how sound affects the brain. Susan says that we like, or detest a sound because of either our association with it or its attributes. Association is what hearing the sound triggers in our memory. Susan has an association that still haunts her to this day.

Susan Rogers: The sound I despise is the sound of a ringing telephone [sfx]. And that's due entirely to an association. The sound of a ringing telephone would interrupt my sleep.

[music in]

Khoi Vinh: Susan used to work for a very famous, very prolific musician as a staff engineer.

Susan Rogers: Our typical work days were 20, 24 hours long, 48 hours was not at all uncommon.

Khoi Vinh: After which, all Susan would want to do is sleep. But then her phone would ring.

Susan Rogers: After three or four hours. And it would usually be him with that beautiful low voice he had. And I'd pick up the phone and he'd say,

[music out]

Musician: "Susan, ready?"

Susan Rogers: I associate to this day, the sound of a ringing telephone with the sound of being hauled off, my freedom is ended.

Khoi Vinh: So for Susan, the sound of a ringing telephone, isn't the problem, it's the association. When she hears that phone ring, it triggers her memory of interrupted sleep. But the other reason a sound can be annoying is its attributes. That's the quality of the sound itself.

Susan Rogers: So a simpler way to describe it would be like comparing sounds to fabrics. An octave might be like satin or silk. You run your fingers over it and it's smooth. But a minor second or major second interval, those low intervals are similar to running your fingers over burlap or corduroy. We can perceive the roughness in our fingertips. And likewise, we can perceive roughness in sounds.

Khoi Vinh: According to Susan, the card reader sound that Connor heard has a burlap quality.

Susan Rogers: It's got an acoustic component of roughness. So that's a little bit dissonant and it's known to be annoying. Especially if it's really loud, it's very, very annoying. So immediately, you're getting people stressed.

[music in]

On some level, getting people stressed is exactly what that noise was designed to do. If you don’t want people forgetting their credit cards, you can blast them with an abrasive noise, so they rip the card out just to make it stop. But that’s just one way to do it.

The more nuanced approach would be to figure out how to get people to do the exact same thing, but with a pleasant sound. That’s coming up, after the break.

[music out]

MIDROLL

[music in]

The way we experience sound is a lot like the way we experience touch. Nice sounds often feel soft and smooth, while unpleasant sounds feel harsh and rough.

In the early days of credit card chips, card readers used a loud buzzing sound to remind people to remove their card [sfx]. But there was another credit card processing company, called Clover, who was trying to solve this problem.

[music out]

Connor Moore: I was looking at different companies to work with at the time, just very interested in this space and sure enough, it was kind of serendipitous, actually, that Clover reached out to me.

Khoi Vinh: Connor took the meeting and got the job to redesign Clover sounds.

Khoi Vinh: The way Connor described it, Clover's challenge to him was to help change the behavior of their users without annoying them. For years, shoppers had been swiping their cards, but these new chip machines require you to insert your card, leave it in while it's being approved and then take it out. For most people, this was very different. Add to that, the regular stress of shopping. Imagine trying to learn how to use a chip machine in a crowded department store on Christmas Eve. And you can see how easy it would be for a shopper to forget their card. You kind of really need an annoying warning tone to remind you to take it out. But Connor didn't want to be annoying. According to Clover's creative brief, the company asked for-

Connor Moore: Smarts, efficient. These are things they wanted to communicate to users.

Khoi Vinh: To achieve that, Connor broke down the warning tone into three parts. First, he started with a warm sound. One that feels familiar to our ears [sfx: warm tone]. Second, Connor added a digital mallet. This is a sound that's rough enough to grab our attention, but not disruptive enough to startle us [sfx: digital mallet tone].

Connor Moore: The point of this is like, "Hey, don't forget your card. Seriously, don't forget your card."

Khoi Vinh: And the third sound, adds some fullness to the warning tone. That's especially helpful in a noisy place like the crowded store on Christmas Eve [sfx: warning tone]. And when you put it all together.

Connor Moore: It has a bit of urgency, but it's not overkill.

Susan Rogers: Sound prompts us to move.

Khoi Vinh: Again, this is Susan Rogers, the professor of music production and engineering at Berkeley College of Music. She says, sound is effective at prompting action.

Susan Rogers: And in part, sounds prompt us to get… out of the way, if it's something that we associate with danger.

Khoi Vinh: So that means there's a tight rope you have to walk when you're designing a sound. Those burlap sounds, repetitive, dissonant sounds can drive people crazy.

Susan Rogers: Things that we find annoying do ramp up our stress level. And in a high stress situation, cognition is impaired. It's impaired because your body has released cortisol. And so, your primary objective is to want to calm yourself down and to get away from danger.

Khoi Vinh: That cortisol spike is part of our evolutionary fight or flight response. And it's something for designers to consider as sound becomes a bigger and bigger part of our environment. Designers probably don't want their users to constantly be in a stressed out state. So Susan proposes a different approach to thoughtfully guide users with sound.

[music in]

Khoi Vinh: This gives users something familiar to latch on to.

Susan Rogers: Designed sounds that are these auditory icons are inviting us and perhaps prompting us to move in a certain way. It's like the lock sound on an iPhone [sfx]. That sounds like a key being turned, or it sounds like a lock being clicked. It's an auditory icon. It's representative of the action that you're taking.

Khoi Vinh: When an interface element looks or sounds like something in the real world, designers call it skeuomorphism. For example, when a button on your phone looks like a real button you might encounter on say a home appliance, that's skeuomorphic. It's a helpful technique to communicate how something works to users. When it's done right, it can be very effective. Users know exactly how to act without having a bunch of cortisol pumped into their bloodstream by an annoying sound.

[music out]

This is the approach Connor took to another sound he designed for Clover. The sound the machine makes when a user inserts their card. He was inspired by the satisfying click of the chest strap on his hiking backpack [sfx]. Connor took that buckle metaphor and ran with it.

Connor Moore: So when you insert your card, you have this skeuomorphic sound, essentially that I foley recorded in my studio [sfx: buckle click].

Khoi Vinh: And then one day, after going back and forth with revisions and in delivering his designs to Clover, he heard his work in the wild. Connor walked to a cafe a couple of minutes away from his studio for late morning coffee [sfx: coffee shop sounds]. And sure enough, they were using a Clover machine. He took out his card, put it in the machine. Once the transaction was approved, he heard [sfx: card reader dinging]. The sound did what it was supposed to do. It reminded him to grab his card, but it didn't interrupt the conversation.

Connor Moore: It's always an exciting moment to hear your work out there. And it was cool to just think, what are other people thinking about this particular experience? And I wonder what the reaction will be. But still it sounded pretty good. I was tempted to ask if I could hear it again, but obviously, I'd be charged, so I didn't.

Khoi Vinh: Connor kind of got to live the designer's dream. You see, or in this case, you hear, some example of bad design in the wild, and then you get to fix it. But sometimes for sound designers, the challenge is not to revise a sound, but instead to create a brand new sound experience, one that never existed before.

[music in]

Connor got that assignment from Waymo. Waymo is Google's driverless car project. And the thing is, it's basically silent because it's an electric vehicle. So to make electric cars safer, the government requires car makers to create a fake sound for their engines.

Connor Moore: To say, "Okay, there's something coming towards me." Right?

Khoi Vinh: The federal rules are super specific. The sound needs to play until the car hits 18 miles per hour. The sound has to have a certain volume. The sound has to include bass, mid and treble octaves, so that it's audible for people with some hearing loss. Really the easiest solution for all of this is white noise.

[sfx: music fade to white noise]

Connor Moore: But that's not a pleasant sound. So functionally speaking, that checks the boxes, but how can we do it tastefully that meets these particular requirements?

Khoi Vinh: So Connor's solution was to make a sound that matched the aesthetic of the Waymo car, cute, bubbly, and friendly. And on top of all that, he designed it to sound like Google.

Connor Moore: Hey, these were composed in the key of G [sfx] for Google, right? So, here's a G.

Khoi Vinh: Connor chose a progression of notes that mimic the acceleration of a car. As a car increased in speed, the notes went up the scale. Again, it was bringing something familiar and human to a brand new behavior, trusting a car to drive for you.

Connor Moore: A, B, C, D, [sfx: piano notes] right? So it just has this pleasant feel to it.

Khoi Vinh: And the final result sounded like this [sfx: electric vehicle sound].

Connor Moore: The resolution, once it passes through all these different harmonics is a G major [sfx].

Khoi Vinh: Even though Connor's job is creating sounds, there are times when he says adding sound might not be the right answer.

Connor Moore: I often get clients looking at me, kind of like with their head cocked, because I'm talking myself out of work sometimes. But it's really about thinking long and hard about like, "Okay, does this product really need 20 sounds? Maybe it could use three."

Khoi Vinh: Audio is a powerful tool. So you have to use it sparingly. Connor gives this advice for user experience designers.

Connor Moore: I often say that these experiences are made up of three components. Visuals, haptic and sound. And you don't always need to use all three, because you don't need a sound on every button, that's actually going to drive annoyance for people. And it's actually going to drive people away from using products and apps.

Khoi Vinh: The other day I was walking through the farmer's market in Union Square in Manhattan, grabbing an apple for my lunch. I pulled up my credit card. What's the minimum charge for credit cards?

Merchant: $100.

Khoi Vinh: $100 American?

Merchant: Yes haha. No minimum.

Khoi Vinh: After I realized she's joking, she pulls out a little card reader [sfx: card reader dinging]. The sound it makes when my transaction is approved as pleasant, but not demanding. It got the job done. It's good design done right.

[music in]

Khoi Vinh: The world of audio notifications reminds us that design is in a constant state of change. Design isn't even purely visual anymore. With a world of smart speakers and the vast array of audio notifications that have become a part of our lives, the total user experience now includes these sonic cues that we can't even see and most of us barely notice. But just as with the visual world, the key to making audio work for us and to feel actually humane, that requires a design sensibility. It's a willingness to question why, to try new ideas, to examine carefully how real people respond to those ideas and to repeat that cycle over and over until the solution is right. So whether or not you can see it or hear it, it's all design.

[music out]

[music in]

This story came from Wireframe, a podcast about creativity and design. The original episode was a production of Adobe and Gimlet Creative. Subscribe to Wireframe right here in your podcast player, or, click the link in the episode description.

Twenty Thousand Hertz is produced out of the studios of Defacto Sound, a sound design team dedicated to making television, film and games sound incredible. Find out more by following Defacto Sound on Instagram.

Wireframe is hosted by Khoi Vinh, and produced by James T. Green, Amy Standin, Laura Morris, Mathilde Urfelino and Abby Rezika. Rachel Ward is their editor. The show was mixed and sound designed by Catherine Anderson, with original music by Billy Libby. Their theme music is by Peter Leonard.

Thanks for listening.

[music out]

Recent Episodes