Oooh, that’s clever!
(unnatural experiments in web design)




Paul Annett
Design lead at Clearleft

clearleft.com
twitter...
International Magic
The girl next door
This’n’That magic trick video at http://tinyurl.com/thisnthat
This’n’That 0m 56s
Clearleft user experience consultancy
Silverback holding page
20,000+ views from one Tweet




   silverbackapp.com
Silverback paper-based wireframes
Clever logos
FedEx logo, predictably
Toblerone logo, polar bear
Aerosmith ambigram
Trick   rotate 180°
Trick ...or treat?   rotate 180°
truce   truce
Mill
Spectrogram
Venetian Snares   (meow)
Hidden Mickey ½ a mile across
Innocent Smoothies “stop looking at my bottom”
Moo stickers
Moo stickers
Chip Art Cheetah
Mighty Mouse
about:mozilla in Firefox
resize the browser
http://silverbackapp.com/holding
resize the browser
http://tweet1.com
resize the browser
http://twequency.com
Clearleft anagram ambigram




    CLEARLEFT
Clearleft anagram ambigram




   CLEARLEFT
   ELF CARTEL
resize the browser
http://tinyurl.com/horsemoves
Ho ho ho
Ho ho ho
Google Moon
Google Moon, cheesy
click the timeline
http://2007.dConstruct.org
click the worm at the bottom
http://kyanmedia.com
navigate using top left menu
http://modernista.com
navigate using top left menu
http://skittles.com
http://www.mybloodyvalentinein3d.com
scroll ↓ watch the logo
http://fatuus.de
scroll → watch the logo
http://designedbyable.com
scroll ↓ watch the diver
http://tinyurl.com/zenocean
scroll ↓ watch the paint
http://webleeddesign.com
wait... watch blue
http://de-online.co.uk/archive/5.html
image above fold
http://de-online.co.uk/archive/8.html
blue turned pink
http://de-online.co.uk/archive/5.html
blue again
http://de-online.co.uk/archive/1.html
http://youtube.com/experiencewii
http://tinyurl.com/ipodyahoo
http://producten.hema.nl
scroll ↓ watch logo
http://econsultancy.com/blog
Kano Model of customer satisfaction


                       Delighted
                       customer




               ...
Kano Model of customer satisfaction


                    Delighted
                    customer


                       ...
Performance needs e.g. hotel check-in speed
Performance needs e.g. online shopping delivery




              Richard Rutter; Paperback
Kano Model of customer satisfaction


                    Delighted
                    customer


                       ...
Basic needs e.g. toilet roll in hotel room
Basic needs e.g. that a website actually works
Kano Model of customer satisfaction


                    Delighted          excitement needs
                    customer...
Excitement needs e.g. free wi-fi at hotel
Excitement needs e.g. swishy vines & a man in a gorilla suit
Kano Model of customer satisfaction


                    Delighted          excitement needs
                    customer...
Don Norman, user experience pioneer




“   It is not enough that
    we build products
    that function, that are
    un...
Slides at clearleft.com/slides/paul/sxsw09




                                    Thank you
                             ...
Magic shop http://flickr.com/photos/misterpeter/3087426323/
Model shop http://flickr.com/photos/bowbrick/653647381/
FedEx tr...
Oooh, that's Clever! (unnatural experiments in web design)
Oooh, that's Clever! (unnatural experiments in web design)
Upcoming SlideShare
Loading in …5
×

Oooh, that's Clever! (unnatural experiments in web design)

36,764 views

Published on

Clearleft's design lead mixes unexpected delighters and unconventional designs, as the arcane art of smoke and mirrors meets 21st century web design.

Published in: Design, Technology
6 Comments
92 Likes
Statistics
Notes
  • can't get video to play, frustrating!
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • interesting content

    http://magictrickstutorial.blogspot.com
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Hi ,NicePaul.
    I am participating in a contest and your slide I liked very much,because in my company we work with web design and SEO, so I invited, to visit my slide and if it likes, please addme to your favorites, thank you very much

    Check out this SlideShare

    http://slidesha.re/5Td1I5

    Please Addme to your Favs ’♥’ bye bye
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Lucky enough to see this presented by Paul, very good presentation. If you want a site to go viral simple delighters like these are the way to go!

    The link for the wario link is http://www.youtube.com/wariolandshakeit2008
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Such easter eggs are great for attracting the audience. But that doesn’t necessarily mean attracting target audience.:)
    Great scheme around 60-70 slides! Great explanation for anyone in sales or marketing... anyone, really.:)
    oh, and mario-looking like game video link isn't working. you just should search by the title you see in the slide in youtube
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Views
Total views
36,764
On SlideShare
0
From Embeds
0
Number of Embeds
15,012
Actions
Shares
0
Downloads
434
Comments
6
Likes
92
Embeds 0
No embeds

No notes for slide

Oooh, that's Clever! (unnatural experiments in web design)

  1. Oooh, that’s clever! (unnatural experiments in web design) Paul Annett Design lead at Clearleft clearleft.com twitter.com/nicepaul
  2. International Magic
  3. The girl next door
  4. This’n’That magic trick video at http://tinyurl.com/thisnthat
  5. This’n’That 0m 56s
  6. Clearleft user experience consultancy
  7. Silverback holding page
  8. 20,000+ views from one Tweet silverbackapp.com
  9. Silverback paper-based wireframes
  10. Clever logos
  11. FedEx logo, predictably
  12. Toblerone logo, polar bear
  13. Aerosmith ambigram
  14. Trick rotate 180°
  15. Trick ...or treat? rotate 180°
  16. truce truce
  17. Mill
  18. Spectrogram
  19. Venetian Snares (meow)
  20. Hidden Mickey ½ a mile across
  21. Innocent Smoothies “stop looking at my bottom”
  22. Moo stickers
  23. Moo stickers
  24. Chip Art Cheetah
  25. Mighty Mouse
  26. about:mozilla in Firefox
  27. resize the browser http://silverbackapp.com/holding
  28. resize the browser http://tweet1.com
  29. resize the browser http://twequency.com
  30. Clearleft anagram ambigram CLEARLEFT
  31. Clearleft anagram ambigram CLEARLEFT ELF CARTEL
  32. resize the browser http://tinyurl.com/horsemoves
  33. Ho ho ho
  34. Ho ho ho
  35. Google Moon
  36. Google Moon, cheesy
  37. click the timeline http://2007.dConstruct.org
  38. click the worm at the bottom http://kyanmedia.com
  39. navigate using top left menu http://modernista.com
  40. navigate using top left menu http://skittles.com
  41. http://www.mybloodyvalentinein3d.com
  42. scroll ↓ watch the logo http://fatuus.de
  43. scroll → watch the logo http://designedbyable.com
  44. scroll ↓ watch the diver http://tinyurl.com/zenocean
  45. scroll ↓ watch the paint http://webleeddesign.com
  46. wait... watch blue http://de-online.co.uk/archive/5.html
  47. image above fold http://de-online.co.uk/archive/8.html
  48. blue turned pink http://de-online.co.uk/archive/5.html
  49. blue again http://de-online.co.uk/archive/1.html
  50. http://youtube.com/experiencewii
  51. http://tinyurl.com/ipodyahoo
  52. http://producten.hema.nl
  53. scroll ↓ watch logo http://econsultancy.com/blog
  54. Kano Model of customer satisfaction Delighted customer subjective satisfaction level Poor Very good execution execution quality of execution Unhappy customer
  55. Kano Model of customer satisfaction Delighted customer performance needs Poor Very good execution execution Unhappy customer
  56. Performance needs e.g. hotel check-in speed
  57. Performance needs e.g. online shopping delivery Richard Rutter; Paperback
  58. Kano Model of customer satisfaction Delighted customer performance needs Poor Very good execution execution basic needs Unhappy customer
  59. Basic needs e.g. toilet roll in hotel room
  60. Basic needs e.g. that a website actually works
  61. Kano Model of customer satisfaction Delighted excitement needs customer performance needs Poor Very good execution execution basic needs Unhappy customer
  62. Excitement needs e.g. free wi-fi at hotel
  63. Excitement needs e.g. swishy vines & a man in a gorilla suit
  64. Kano Model of customer satisfaction Delighted excitement needs customer performance needs Poor Very good execution execution basic needs time Unhappy customer
  65. Don Norman, user experience pioneer “ 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
  66. Slides at clearleft.com/slides/paul/sxsw09 Thank you Paul Annett paul@clearleft.com twitter.com / nicepaul youtube.com / nicepaul del.icio.us / paulannett / sxsw09 These slides are released under a Creative Commons attribution sharealike licence
  67. 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/1380466813 Aerosmith ambigram designed by John Langdon Trick or Treat ambigram designed by John Langdon for Objective Productions Truce logo designed by Brian Jaramillo Mill logo designed by North Design Spectrogram http://flickr.com/photos/waders/2495322032/ Songs About My Cats spectrogram © 2001 Venetian Snares “Hidden Mickey” portion of Google Maps © 2006 Google Innocent 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.html Mighty 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

×