oooh, that's clever! (unnatural experiments in web design)
TRANSCRIPT
![Page 1: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/1.jpg)
Oooh, that’s clever!(unnatural experiments in web design)
Paul AnnettDesign lead at Clearleft
clearleft.comtwitter.com/nicepaul
![Page 2: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/2.jpg)
International Magic
![Page 3: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/3.jpg)
The girl next door
![Page 4: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/4.jpg)
This’n’That magic trick video at http://tinyurl.com/thisnthat
![Page 5: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/5.jpg)
This’n’That 0m 56s
![Page 6: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/6.jpg)
Clearleft user experience consultancy
![Page 7: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/7.jpg)
Silverback holding page
![Page 8: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/8.jpg)
20,000+ views from one Tweet
silverbackapp.com
![Page 9: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/9.jpg)
Silverback paper-based wireframes
![Page 10: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/10.jpg)
Clever logos
![Page 11: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/11.jpg)
FedEx logo, predictably
![Page 12: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/12.jpg)
Toblerone logo, polar bear
![Page 13: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/13.jpg)
Aerosmith ambigram
![Page 14: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/14.jpg)
Trick rotate 180°
![Page 15: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/15.jpg)
Trick ...or treat? rotate 180°
![Page 16: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/16.jpg)
truce truce
![Page 17: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/17.jpg)
Mill
![Page 18: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/18.jpg)
Spectrogram
![Page 19: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/19.jpg)
Venetian Snares (meow)
![Page 20: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/20.jpg)
Hidden Mickey ½ a mile across
![Page 21: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/21.jpg)
Innocent Smoothies “stop looking at my bottom”
![Page 22: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/22.jpg)
Moo stickers
![Page 23: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/23.jpg)
Moo stickers
![Page 24: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/24.jpg)
Chip Art Cheetah
![Page 25: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/25.jpg)
Mighty Mouse
![Page 26: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/26.jpg)
about:mozilla in Firefox
![Page 27: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/27.jpg)
![Page 28: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/28.jpg)
![Page 29: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/29.jpg)
http://silverbackapp.com/holding resize the browser
![Page 32: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/32.jpg)
Clearleft anagram ambigram
CLEARLEFT
![Page 33: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/33.jpg)
Clearleft anagram ambigram
CLEARLEFTELF CARTEL
![Page 34: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/34.jpg)
http://tinyurl.com/horsemoves resize the browser
![Page 35: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/35.jpg)
Ho ho ho
![Page 36: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/36.jpg)
Ho ho ho
![Page 37: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/37.jpg)
Google Moon
![Page 38: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/38.jpg)
Google Moon, cheesy
![Page 43: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/43.jpg)
http://www.mybloodyvalentinein3d.com
![Page 45: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/45.jpg)
http://designedbyable.com scroll → watch the logo
![Page 46: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/46.jpg)
http://tinyurl.com/zenocean scroll ↓ watch the diver
![Page 48: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/48.jpg)
http://de-online.co.uk/archive/5.html wait... watch blue
![Page 49: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/49.jpg)
http://de-online.co.uk/archive/8.html image above fold
![Page 50: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/50.jpg)
http://de-online.co.uk/archive/5.html blue turned pink
![Page 51: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/51.jpg)
http://de-online.co.uk/archive/1.html blue again
![Page 55: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/55.jpg)
http://econsultancy.com/blog scroll ↓ watch logo
![Page 56: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/56.jpg)
Kano Model of customer satisfaction
Poorexecution
Very goodexecution
Delightedcustomer
Unhappycustomer
subj
ectiv
e sa
tisfa
ctio
n le
vel
quality of execution
![Page 57: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/57.jpg)
Kano Model of customer satisfaction
Poorexecution
Very goodexecution
Delightedcustomer
Unhappycustomer
performance needs
![Page 58: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/58.jpg)
Performance needs e.g. hotel check-in speed
![Page 59: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/59.jpg)
Performance needs e.g. online shopping delivery
Richard Rutter; Paperback
![Page 60: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/60.jpg)
Kano Model of customer satisfaction
Poorexecution
Very goodexecution
Delightedcustomer
Unhappycustomer
performance needs
basic needs
![Page 61: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/61.jpg)
Basic needs e.g. toilet roll in hotel room
![Page 62: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/62.jpg)
Basic needs e.g. that a website actually works
![Page 63: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/63.jpg)
Kano Model of customer satisfaction
Poorexecution
Very goodexecution
Delightedcustomer
Unhappycustomer
basic needs
excitement needs
performance needs
![Page 64: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/64.jpg)
Excitement needs e.g. free wi-fi at hotel
![Page 65: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/65.jpg)
Excitement needs e.g. swishy vines & a man in a gorilla suit
![Page 66: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/66.jpg)
Kano Model of customer satisfaction
Poorexecution
Very goodexecution
Delightedcustomer
Unhappycustomer
basic needs
excitement needs
performance needs
time
![Page 67: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/67.jpg)
It is not enough that we build products that function, that are understandable and usable, we also need to build products that bring joy and excitement, pleasure and fun, and, yes, beauty to people’s lives
Don Norman, user experience pioneer
“
”
![Page 68: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/68.jpg)
twitter.comyoutube.com
del.icio.us
/ nicepaul/ nicepaul/ paulannett / sxsw09
Slides at clearleft.com/slides/paul/sxsw09
Thank you
Paul Annett
These slides are released under aCreative Commons attribution
sharealike licence
![Page 69: Oooh, that's Clever! (unnatural experiments in web design)](https://reader031.vdocuments.net/reader031/viewer/2022030310/58f9aa6b760da3da068b78d5/html5/thumbnails/69.jpg)
Magic shop http://flickr.com/photos/misterpeter/3087426323/Model shop http://flickr.com/photos/bowbrick/653647381/FedEx truck http://flickr.com/photos/mukluk/292641326/Toblerone http://flickr.com/photos/kylejones/1380466813Aerosmith ambigram designed by John LangdonTrick or Treat ambigram designed by John Langdon for Objective ProductionsTruce logo designed by Brian JaramilloMill logo designed by North DesignSpectrogram http://flickr.com/photos/waders/2495322032/Songs About My Cats spectrogram © 2001 Venetian Snares“Hidden Mickey” portion of Google Maps © 2006 GoogleInnocent Smoothie http://flickr.com/photos/duncan/2084134925/Moo sticker book 1 http://flickr.com/photos/lwr/972289835/Moo sticker book 2 http://flickr.com/photos/please/1061596487/Chip art © Silicon Zoo http://micro.magnet.fsu.edu/creatures/index.htmlMighty Mouse http://www.flickr.com/photos/angryamoeba/116066934/
Website screenshots © their respective owners.
Hotel check-in http://www.flickr.com/photos/ceekay/2560549258/Toilet roll http://www.flickr.com/photos/lastyearsgirl_/467097802/Hotel lobby wifi http://www.flickr.com/photos/rogue2408/3027375592/Don Norman http://www.jnd.org/NNg-Photographs/NNg-photographs.html