Successfully reported this slideshow.
Your SlideShare is downloading. ×

Upplevelsedesign — Överblick. Mobilt. Webbformulär.

Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
UPPLEVELSEDESIGN
    Överblick. Mobilt. Webbformulär.


    Berghs School of Communication
              Per Axbom
       ...
Per Axbom
Experience Designer
Digital Strategist
Axbom Innovation AB



Twitter: @axbom
Axbom Innovation
Livscykel för framgångsrika idéer



                 !
         !!!!!!!!!




                          ...

YouTube videos are no longer supported on SlideShare

View original on YouTube

Upcoming SlideShare
Language
Language
Loading in …3
×

Check these out next

1 of 148 Ad

Upplevelsedesign — Överblick. Mobilt. Webbformulär.

Download to read offline

Presentation vid föreläsning på kursen Digital Management på Berghs School of Communication.

Presentation vid föreläsning på kursen Digital Management på Berghs School of Communication.

Advertisement
Advertisement

More Related Content

Similar to Upplevelsedesign — Överblick. Mobilt. Webbformulär. (20)

More from Per Axbom (20)

Advertisement

Upplevelsedesign — Överblick. Mobilt. Webbformulär.

  1. 1. UPPLEVELSEDESIGN Överblick. Mobilt. Webbformulär. Berghs School of Communication Per Axbom 2011-11-24
  2. 2. Per Axbom Experience Designer Digital Strategist Axbom Innovation AB Twitter: @axbom
  3. 3. Axbom Innovation Livscykel för framgångsrika idéer ! !!!!!!!!! !!!!!!!! ! ! Mekanismer för återkoppling. Omvärld. Trender. version 1.0 !
  4. 4. Upplevelsedesign
  5. 5. http://www.youtube.com/watch?v=L1CxlyMoFRs
  6. 6. En röd knapp räcker.
  7. 7. Usability vs UX http://www.flickr.com/photos/seguin_maxim/80205117/sizes/z/in/photostream/
  8. 8. Usability är en kaffekopp. UX är ett latteglas.
  9. 9. Allvarligt, skickade du SMS med mig?
  10. 10. SMÄRTA NYTTA uppoffring fördelar
  11. 11. Usability Kan göra UX Vill göra Vill göra igen Rekommenderar
  12. 12. UI-designers tänker på detta...
  13. 13. UX-designers tänker också detta...
  14. 14. Guru-myten Date
  15. 15. attract Wow, did you interact know....? Check FAIL this out...! WOW! CONVERSION
  16. 16. Hur gör vi användaren ledsen?
  17. 17. Samma storlek Samma färg Liten text Miljontals val Göm länkar Otydlig text...
  18. 18. Lista ut hur du skapar maximal smärta för användaren. Gör tvärtom.
  19. 19. source: marketingprofs.com
  20. 20. 67% 11% -1% 63% source: marketingprofs.com
  21. 21. ACE YOUR WEBSITE AWE YOUR USERS
  22. 22. Extend Attract E A Wow W C Clarify A E Adapt Engage
  23. 23. För som vill . Tjänst: målgrupp/persona behov namn på produkt/tjänst Extend Attract Wow Extend Attract Clarify E A Wow W C Clarify A E Adapt Engage Adapt Engage
  24. 24. MOBILT
  25. 25. En ny människa...
  26. 26. Flitiga mobildata-användare förväntas tredubblas till en miljard år 2013. Upptagandet av mobilt internet är åtta gånger snabbare än desktop. Smartphone-försäljning slår ut global PC- försäljning innan 2012. Över hälften av Android och iPhone- användare spenderar mer än 30 minuter per dag med mobila applikationer.
  27. 27. http://www.email-marketing-reports.com/wireless-mobile/smartphone-statistics.htm
  28. 28. MOBILT ÖKAR DIN FÖRMÅGA
  29. 29. ALLA SÄGER “MOBILE FIRST”
  30. 30. VAD ÄR MOBILT?
  31. 31. Mobilt är allestädes närvarande - inte ett separat silo.
  32. 32. FARAN MED MOBIL WEBBPLATS
  33. 33. Separata kodbaser Separata team Dubbelarbete Mobil Desktop Osynkade Presentationsidé från: http://underthebedstudios.com/blog/why-mobile-first-isnt-enough/
  34. 34. Allt Mobil Desktop däremellan? Presentationsidé från: http://underthebedstudios.com/blog/why-mobile-first-isnt-enough/
  35. 35. Arbetsbelastning och risker ökar exponentiellt med antalet olika sajter du skapar.
  36. 36. FARAN FÖR ANVÄNDARE
  37. 37. oavsiktlig geni- upplevelse- design design design själv- aktivitets- design design http://vimeo.com/20881152
  38. 38. Mobila användare är alltid... på språng på en långsam uppkoppling ? bara intresserade av snabb interaktion
  39. 39. 86% ANVÄNDER EN MOBIL ENHET FRAMFÖR TV-N http://advertising.yahoo.com/article/the-role-of-mobile-devices-in-shopping-process.html
  40. 40. Vid val mellan att behålla mobil eller TV skulle 64% välja mobilen!
  41. 41. SÅ OM ANVÄNDARNA KAN KOMMA IN HUR SOM HELST?
  42. 42. DET ROLIGA MED APPAR
  43. 43. snabbt närvarande roliga effekter
  44. 44. UTMANINGEN MED APPAR En fast yta. Roterande skärm. Många skärmar!
  45. 45. Människor balanserar iPaden på magen, lägga inte viktiga knappar där.
  46. 46. http://gizmodo.com/5133070/iphone-app-store-hits-500-million-downloads-we-break-down-the-numbers
  47. 47. NATIVE VS WEBB?
  48. 48. NATIVE Bor på telefonen Laddas ner till enheten Byggs specifikt för en enhet Programmeringsspråk (Objective C/Java)
  49. 49. WEBB Bor på webben Åtkomst via en webbläsare Byggd med “webbspråk” (HTML/CSS/JS)
  50. 50. Native Webb Inbyggd marknadsföring Billigare Kräver mer för Kan integreras i befintlig webb kundkännedom Snabb utveckling och Access till enheten (kamera, uppdateringskontroll mikrofon, accelerator) Inga tredjepartsavgifter Access till andra appar Tillgänglighet Hosting Browserfunktionalitet (IP- och Statistik GPS-baserad geolocation) Betala för att utveckla... Spara lokalt Det finns många enheter! Swipe detection (JS) http://vimeo.com/6353874
  51. 51. WEBBFORMULÄR
  52. 52. - Det kommer nästan ingen genom den där dörren.Jag visste väl att webben inte skulle leverera!
  53. 53. Requirement specification ✓ User should be able to log in. ✓ It should be easy.
  54. 54. http://per.ax/rcube
  55. 55. The solution will depend... ...on the question asked.
  56. 56. Create a form for uploading images.
  57. 57. Help the user publish photos immediately after they are taken.
  58. 58. Have task-oriented requirements and you will get innovative solutions.
  59. 59. LET’S ZOOM OUT 95
  60. 60. 96
  61. 61. 97
  62. 62. 98
  63. 63. 99
  64. 64. 100
  65. 65. 101
  66. 66. 102
  67. 67. 103
  68. 68. 104
  69. 69. 105
  70. 70. 106
  71. 71. 107
  72. 72. 108
  73. 73. 109
  74. 74. 110
  75. 75. Impression Entry Completion Experience Expectation Interaction Exit 111
  76. 76. Market Web Business Impression Entry Completion Experience Expectation Interaction Exit 112
  77. 77. Market Web Business Customer Service Impression Entry Completion Experience Expectation Interaction Exit 113
  78. 78. FORM FLOW 114
  79. 79. 115
  80. 80. CLEAR BUTTON 116
  81. 81. CLEAR BUTTON 117
  82. 82. DESIGN PATTERNS 118
  83. 83. 119
  84. 84. 120
  85. 85. 121
  86. 86. 122
  87. 87. AFFORDANCE AND AREA CODES Ibland kan det bli aktuellt att skicka material. Ange din postadress om det är ok att skicka material till dig. Adress Postnr Postadress Spara 123
  88. 88. PASSWORDS Password ************* Strong Nsv!1v8# 124
  89. 89. PASSWORDS Password fido Hide password as I type 125
  90. 90. PURPOSE OF BIG FIELDS • See what you are typing! • Fewer mistakes • Draw attention to the form 126
  91. 91. CONVERSATION (IT’S NOT CALLED A DIALOG BOX FOR NO REASON) 127
  92. 92. Name? Sara Andersson Social security number? 820917-2654 Phone? 0705451234 sara@andersson.net E-mail? Your message? My broadband isn’t working! You said social security number in the wrong format. Please go what? back and repeat. 128
  93. 93. 129
  94. 94. Hi, what’s your name? Sara Andersson ok, what’s your social security number? 820917-2654 thanks, and 0705451234 your phone number? sara@andersson.net mm, and e-mail? ok, and your My broadband message is? isn’t working Great, thanks! Let me just double check. Did you say Yep. sara@andersson.net? 130
  95. 95. 131
  96. 96. CONVERSATION 132
  97. 97. The web is a conversation. Make sure your website has a voice.
  98. 98. Talking web form! Label:   ! Required Field! Label:   ! Required Field!
  99. 99. MOBILE - TALKING WITH YOUR FINGERS Månadskostnader utöver lönekostnader 14 000 kr Under 2011 fyller jag 26 år eller 66 år eller 27-65 år mindre mer 135
  100. 100. MOBILE INPUT http://www.elated.com/articles/banish-javascript-in-web-forms-with-html5/ 136
  101. 101. YOU CAN LOVE FORMS TOOOO MUCH... 137
  102. 102. 138
  103. 103. 139
  104. 104. 140
  105. 105. 141
  106. 106. 142
  107. 107. POST DRAFT Path Order Size Trim Disruptive Responsive Alignment Feedback Tone
  108. 108. Gör om! 144
  109. 109. JOTFORM! 145
  110. 110. Per Axbom +46 709 13 25 00 per@axbom.se Twitter: @axbom

×