skeuomorphs
"Skeuomorphism is the use of  previously necessary design elements in a place they are no longer necessaryin order to incr...
Digital CameraRecorded mechanical shutter sound
Reason Software SynthHardware synth-style layout and controls
Electric CarRecorded engine noise (required by law)
Ancient PotterySculpted woven-basket pattern
Rubber Wine Corks  Painted-on mottling
HubcapDecorative spokes
HouseDecorative shutters
WHY IS THIS RELEVANT?Touch interfacesWere usingour handsTheyre newtechnology
REFERENCES TO FAMILIAR OBJECTS          1984                            2010  desktop metaphor helps            physical m...
“When appropriate, add a realistic, physical dimensionto your application. Often, the more true to life yourapplication lo...
“Dig, however, the page-curl animation (beautifullyrendered, but stick-in-the-craw wrong) in iBooks. Feastyour eyes on the...
WHICH IS THE IDEAL READING EXPERIENCE?           iBooks                   Kindle
WHAT IS THIS DEVICE FOR?Its barely a device;its a book.Skeuomorphsdeemphasizethe technologyin favor of the utility.
WHICH ONE DO WE GET FOR GRANDMA?          iOS                  Android
KNOW YOUR AUDIENCE                       Worst.                     Skeuomorph.                        Ever.
WHICH IS BETTER GIVEN THE TECHNOLOGY?  skeuomorphic compass      camera-enabled compass
WHAT HAVE WE LEARNED?Use skeuomorphs to add a satisfying or nostalgicemotional e ect.Bridge gaps between what people are u...
Two goals for our users:
Two goals for our users:1. GET THINGS DONE
Two goals for our users:1. GET THINGS DONE       2. SMILE
Two goals for our users:1. GET THINGS DONE       2. SMILESkeuomorphism can help.*           (*if done well)
“Usable designs are not necessarily enjoyable to use...an attractive design is not necessarily the most e cient.But must t...
THANK YOU.                                     WRITING BY                           Fred Beecher, Ben Brooks,             ...
a   Andrew Watterson is a designer.    www.andrewwatterson.com    @andrewwatterson    Meebo is totally hiring.    www.meeb...
Skeuomorphism (UX Lx, May 2011)
Skeuomorphism (UX Lx, May 2011)
Skeuomorphism (UX Lx, May 2011)
Skeuomorphism (UX Lx, May 2011)
Skeuomorphism (UX Lx, May 2011)
Skeuomorphism (UX Lx, May 2011)
Skeuomorphism (UX Lx, May 2011)
Skeuomorphism (UX Lx, May 2011)
Upcoming SlideShare
Loading in...5
×

Skeuomorphism (UX Lx, May 2011)

2,529

Published on

Why does my iPad calendar app look like a leather desk set from the 1940s?

We make new things look like old things because the old is familiar: it helps with usability, it makes us safer, and it's cute. Our mobile phones have replaced pads of paper and physical dials with touchscreens that have pictures of these things on them. Our digital cameras play a prerecorded shutter sound when we press the button because that's how our old cameras told us the picture was taken.

Their ability to both delight and confuse is profound - skeuomorphic touches will invariably get oohs and aahs at design reviews and from users. Yet in the quest for familiarity and nostalgia, these flourishes can perpetuate interfaces that only made sense given past technical limitations or, worse, suggest vintage mental models that are out of sync with the product's modern features.

Come listen to a light-hearted discussion about the what and the why of this increasingly common design pattern and how designers can leverage everything that's cute and rich about skeuomorphs without compromising mental models or a polished product.

0 Comments
8 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,529
On Slideshare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
0
Comments
0
Likes
8
Embeds 0
No embeds

No notes for slide

Transcript of "Skeuomorphism (UX Lx, May 2011)"

  1. 1. skeuomorphs
  2. 2. "Skeuomorphism is the use of previously necessary design elements in a place they are no longer necessaryin order to increase appeal or usability."
  3. 3. Digital CameraRecorded mechanical shutter sound
  4. 4. Reason Software SynthHardware synth-style layout and controls
  5. 5. Electric CarRecorded engine noise (required by law)
  6. 6. Ancient PotterySculpted woven-basket pattern
  7. 7. Rubber Wine Corks Painted-on mottling
  8. 8. HubcapDecorative spokes
  9. 9. HouseDecorative shutters
  10. 10. WHY IS THIS RELEVANT?Touch interfacesWere usingour handsTheyre newtechnology
  11. 11. REFERENCES TO FAMILIAR OBJECTS 1984 2010 desktop metaphor helps physical metaphors the transition to graphical (skeuomorphs) help transition interfaces to touch interfaces
  12. 12. “When appropriate, add a realistic, physical dimensionto your application. Often, the more true to life yourapplication looks and behaves, the easier it is for peopleto understand how it works and the more they enjoyusing it.” — iOS Human Interface Guidelines
  13. 13. “Dig, however, the page-curl animation (beautifullyrendered, but stick-in-the-craw wrong) in iBooks. Feastyour eyes on the leatherette Executive Desk Blotternonsense going on in Notes. Open up Calendar, with itstwee spiral-bound conceit, and gaze into the face of Fear.What are these but misguided coddles, patronizingcrutches, interactively horseless carriages?” — Adam Green eld
  14. 14. WHICH IS THE IDEAL READING EXPERIENCE? iBooks Kindle
  15. 15. WHAT IS THIS DEVICE FOR?Its barely a device;its a book.Skeuomorphsdeemphasizethe technologyin favor of the utility.
  16. 16. WHICH ONE DO WE GET FOR GRANDMA? iOS Android
  17. 17. KNOW YOUR AUDIENCE Worst. Skeuomorph. Ever.
  18. 18. WHICH IS BETTER GIVEN THE TECHNOLOGY? skeuomorphic compass camera-enabled compass
  19. 19. WHAT HAVE WE LEARNED?Use skeuomorphs to add a satisfying or nostalgicemotional e ect.Bridge gaps between what people are used toand a new method with skeuomorphs.Question whether youre skipping the opportunityfor innovation by using a skeuomorph.Dont mismatch your functionalityand your skeuomorph.
  20. 20. Two goals for our users:
  21. 21. Two goals for our users:1. GET THINGS DONE
  22. 22. Two goals for our users:1. GET THINGS DONE 2. SMILE
  23. 23. Two goals for our users:1. GET THINGS DONE 2. SMILESkeuomorphism can help.* (*if done well)
  24. 24. “Usable designs are not necessarily enjoyable to use...an attractive design is not necessarily the most e cient.But must these attributes be in con ict? Can beauty andbrains, pleasure and usability, go hand in hand?” — Don Norman
  25. 25. THANK YOU. WRITING BY Fred Beecher, Ben Brooks, Adam Green eld, John Pavlus, Steven Poole, Dorian Taylor, Timothy Taylor, Aaron Weyenberg, and Quora users like you. PHOTOS BY anitakhart on ickr, museum_girl on ickr, captkodak on ickr, taberandrew on ickr, Matt Groening, Penny Arcade, innerauto.com, nissanusa.com, and the iOS App Store.
  26. 26. a Andrew Watterson is a designer. www.andrewwatterson.com @andrewwatterson Meebo is totally hiring. www.meebo.com/jobs

×