Graphic Design
Disappearing icons
- By Marion-Isabelle MUSZYNSKI, Mathieu PIGEON | User Experience June 14th, 2012
-
An article recently shared on Nurun’s Yammer discussion boards caused a bit of a stir among our community. The basic premise: Why is the Save icon still showing a floppy disk? After all, when was the last time any of us used one of these things? (A quick yet extremely scientific survey confirms that the last time most of us did, years were beginning with a one. And yet, today’s users clearly have no difficulty correlating the “save” action with the floppy disk icon.
The use of partially symbolic depictions of this kind is part of the larger practice of skeuomorphism.
Skeuomorphs are material metaphors instantiated through our technologies in artifacts. They provide us with familiar cues to an unfamiliar domain, sometimes lighting our paths, sometimes leading us astray. (Nicholas Gessler, UCLA)
If we stop and think about it for a second, quite a few action behaviours are based on very concrete metaphors—the most obvious example being the button, which mimics something we interact with on anything from doorbells to air conditioners. Some other behaviours, however, are born with computing and need to be learned (blue underlined text = hyperlink).
The use of skeuomorphs, by offering known landmarks as a point of reference, creates an instant (yet superficial) understanding and puts a reassuring mask on some very abstract mechanics. Extensive skeuomorphism, as practiced by Apple (just think about iCal’s leather, PhotoBooth’s curtain or Notes’ writing lines), is known to annoy more than a few designers. It’s all fine and dandy to put users at ease by referring to the real world, to flatter nostalgia even, but is it not also staying prisoner to the physical object’s now irrelevant limitations? If skeuomorphism is welcome when first encountering a concept, doesn’t it become just an annoyance after a while? This is a recurring debate.
The battle lines are drawn: on one side, the iOS school of thought, on the other, the Windows Metro approach. The first camp refers repeatedly to the real world while the other creates its own patterns. Our viewpoint is from no man’s land: select what to use based on context.
For a functionality to be used again and again, and more so for an expert system, extensive use of skeuomorphism is going to interfere with the task by introducing artificial limitations and visual noise. However, tasks worthy of developing expertise to master them are far and few between. For more mundane tasks, skeuomorphism warrants consideration. In truth, we’re no great admirers of Photobooth’s red curtains, but if the alternative is having to check a user manual every time we want to upload a picture to our profile…
If there’s one principle to apply when creating user interfaces for the general public, it’s to avoid the “made by pros for pros” syndrome.
But let’s go back to our floppy disk, shall we?
Think about these users who have never used a 3.5″ floppy — soon, the majority of people — and observe their behaviour: The relationship with “saving” is understood. (The same phenomenon occurs for the two vertical bars used to pause a video, even if their meaning has been lost for almost everyone.) Thus, when disconnected from the tangible object it used to refer to, the floppy disk icon/save relationship becomes abstracted into a cultural code.
The floppy disk symbolism will endure as long as its visual representation stays in common use, evolving from a reference to a convention.
Seeing the floppy survive might bring a knowing smile to people old enough to know where it comes from. Younger folks, on the other hand, will simply read the “H” within a rounded square with a small off-centre vertical bar to mean “save.” The youngest ones, for their part, will have no clue about what that means. “Save? You mean that it was once necessary to manually declare you wanted to keep your data?!”
Tags: Apple, Cultural Code, Floppy Disk, Graphic Design, Icons, iOS, Nicolas Gessler UCLA, Old Icons, Skeuomophism, Skeuomophs, UX, UX design, Windows Metro, Yammer
Blair Coughtrey on Stylify Me
Way to go guys!
Babylonho on Why the term “Best Practices” is mediocre at best
Well said. I found this while looking for that Dilbert cartoon to pin above my desk for the benefit of...
Annabelle Yoon on Stylify Me
Thanks Mash! We're glad you're finding it useful.
Mash Bonigala on Stylify Me
Great share, thanks! I find Stylufy superbly useful during project color phases!
Recent Comments
Search
Categories
Editor
- Kyle GORDON
Writers
- Jean Pascal MATHIEU
- Jim YANG
- Laura CHAMBERS
Contributors
- Amy MANUS
- Audrey CARR
- Boris PIQUE
- Cassandra GONZALES
- Chiara ANELLI
- Chloé ROUBERT
- David BLISS
- Edouard PLANTE
- Emily BOND
- Faustine FOURDINIER
- Faustine HENRY
- Flora LI
- Gonzalo CORCHON
- Grégoire BARET
- Guthrie DOLIN
- Henri JEANTET
- James NAIL
- Jan ZHENG
- Jean-Sébastien SLADECEK
- Jen CHOW
- Jérémy LUCAS
- Julián SÁNCHEZ
- Julien PHALIP
- Kevin WEBBER
- Kira LEVINE
- Laura RIZO
- Liao CHEN
- Mark WADDEN
- Marta MIRANDA
- Michael MROWETZ
- Mona CHAMMAS
- Nadeem VISANJI
- Nurun Lab TEAM
- Robert MILLER
- Ryan BIGGE
- Tim BARBER
Links
Blogroll
Get Social