I work on interfaces used by college students to search for academic articles. Librarians buy these databases. Librarians happen to be wonderful clients to build products for because they always let you know what they don’t like.
A few years ago, my department started hearing complaints about the “save” icon on our interface. The librarians were concerned that, since college students had never seen floppy disks, they wouldn’t know what the icon meant. In the next round of user testing, we dutifully asked college students if they understood the “save” icon–they did–and if they’d prefer a different icon–they didn’t. So we left it at that.
But librarians are a naturally curious and skeptical people and one round of qualitative research would not satisfy them. I needed 100 people to say I was right. So I conducted a survey to find out if people understood the meaning of the icon, and whether they could identify the symbol represented in the icon–the icon’s origin. I got 224 respondents, ranging from elementary school children to art professors. But I was only concerned with the college students, so I narrowed my results to the 131 people who selected the 18-25 age range. And I figured if I was going to ask them about one icon, I might as well ask them about 11 icons.
The save icon
96% of respondents knew that the square icon with the notch cut out of the top right represented a floppy disk (one person guessed that it was an SD card, which was wonderful because that also represents file storage). If I’d asked only about the icon’s meaning, I would have declared this an unequivocal win. However, I also asked people to tell me what the icon meant on a computer or phone. Around 80% said it represented save. The rest of the answers were in the ballpark of save functionality (storage, memory, files, dark matter) but I had expected every single person to respond with “save.” Apparently one exasperated survey taker had the same assumption because they wrote, “Seriously, I’m only 20, but young people aren’t THAT blind to old tech.”
Clear origins, cloudy meanings
Two icons represented objects that were common enough to be identified, but their meanings were not clear. The magnifying glass and pencil illustrations were obvious, but both have been used for many different functions on interfaces. The magnifying glass went roughly 80/20 for search/zoom. The pencil was split among many good answers, such as compose, write, draw, highlight, note and edit. Their high recognition shows that they’re still good to use and likely identifiable in context.
More confusing icons
When I constructed the survey, I threw in some easy icons that were recognized by everyone (envelope, telephone handset, trash can), but I also put in a couple just to stump people. These were icons for voicemail and contacts as represented by an abstracted reel-to-reel and a Rolodex card, respectively. In both cases, the guesses for what object the icon represented were across the board (some guesses for the voicemail icon included “opera glasses,” “googly eyes,” “two circles connected by a line,” and “I have no fucking clue.”) The surprising result was that, despite not being able to pick a Rolodex card out of a lineup, 80% knew that the icon meant contacts.
It was not such a clear win for the Voicemail icon (52% got it correct), but it may be that a less frequently encountered icon is harder to recognize out of context. When I showed the survey to a 40-year-old coworker, he couldn’t figure out what the icon represented either. Then I had him take out his phone. And right there in the status bar was the icon showing that he had unheard voicemails.
The chain link icon, used to represent links, fared the worst of all. Around 60% knew that it was a picture of a chain, but only 45% said it was used for linking. Many thought it was a paperclip, for attaching, and 25% didn’t even attempt to guess what it represented on a computer.
My research shows that there’s definitely some confusion around the meaning of most of these icons. But I’m advocating their continued use because basing them in real-life objects makes them familiar to some users, if not all. Ultimately, the most important thing is to have icons that make it clear to as many people as possible what they do in the interface. It’s better to have 80% of users see the floppy disk, dig back into their memories of childhood technology and connect to this image as representing the act of saving, than have 100% of users see a downward facing arrow and wonder what it means.
We’ve already chosen to stick with familiar imagery in our written language. We talk about “stock tickers” and “diplomatic cables” even though tickers don’t actually tick anymore and none of the diplomatic cables published on WikiLeaks were sent using a telegraph. Our vocabulary has evolved past the objects the words represent and our visual language should do the same. If you disagree, then I challenge you to first stop using the phrase “hang up the phone,” because phones haven’t actually hung in decades.