Usabilità e form: un punto cruciale per l’esperienza d’uso e il coinvolgimento

1,873 views

Published on

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,873
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
14
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Usabilità e form: un punto cruciale per l’esperienza d’uso e il coinvolgimento

  1. 1. UX conference 2010 FILF FORMS IʼD LIKE TO FILL Nicola Bonora
  2. 2. Nicola Bonora MENTINE.NET aka Nicola Bonora Bologna
  3. 3. IL SUONO DI UNA SOLA MANO
  4. 4. FORM “moduli” etichette campi di input azioni messaggi
  5. 5. WEB FORM DESIGN Filling the blanks Luke Wroblewski Rosenfeld
  6. 6. IL LA test clinici friendfeed google
  7. 7. IMPORTA perché • un sito ha obiettivi... • vendita • servizi • social • blogging • ... “conversione”
  8. 8. IMPORTA perché • le form ci parlano • le form parlano di noi • le form vendono
  9. 9. SCENARIO • 500 (ad oggi) milioni di utenti di Facebook • acquistare un libro su punto nevralgico Amazon dellʼesperienza utente • pagare un f24 on line esperienza mediata • commentare un post • web app: 70% form differenza tra (fonte: a naso) eccellenza e mediocrità • un tweet, un update, un feed...
  10. 10. INFOGRAFICHE http://semanticstudios.com/publications/semantics/000029.php
  11. 11. INFOGRAFICHE http://semanticstudios.com/publications/semantics/000228.php
  12. 12. INFOGRAFICHE http://userexperienceproject.blogspot.com/2007/04/user-experience-wheel.html
  13. 13. INFOGRAFICHE http://www.poetpainter.com/thoughts/article/ia-summit-2009-the-fundamentals-of-experience-design-
  14. 14. INFOGRAFICHE http://www.paznow.com/ucd/
  15. 15. COSA MANCA? la clessidra se ne sentiva proprio della UX la mancanza
  16. 16. UX HOURGLASS spread TW fidelize satisfy pain level verify purchase decide choose explore information wideness 2010 CC NICOLA BONORA se proprio ne volete parlare, citate la fonte! :D
  17. 17. E POI? la piramide anche di questa si della BX sentiva la mancanza
  18. 18. BX PYRAMID BILLING EXPERIENCE YOU bill HER :) USER CUSTOMER EXPERIENCE FORM sell PROSPECT EXPERIENCE engage USER EXPERIENCE 2010 CC NICOLA BONORA se proprio ne volete parlare, citate la fonte! :D
  19. 19. IMPORTA perché una form ben progettata può portare ad un aumento delle conversioni tra il 10 e il 40%
  20. 20. COME si progetta una buona • considerare il form? contesto • comunicare in modo coerente dipende... • minimizzare gli stati dʼansia • chiarire il percorso che si sta per fare
  21. 21. LE PAROLE SONO IMPORTANTI
  22. 22. COSA ci metto iniziare da PERSONE e RELAZIONI dentro? • perché gli utenti compilano questa form? • qual è il loro rapporto con la dipende... vostra azienda? • cosa è per loro questa form?
  23. 23. COSA ci metto dentro? rimuovere quanto NON strettamente necessario ... ma non dimenticare lʼindispensabile (per Bilanciare il vostro punto lʼutente) di vista con il loro: UX is a win-win le persone sono sensibili situation ai dati che vengono loro richiesti
  24. 24. “People before pixel” Caroline Jarret
  25. 25. CHECKPOINT
  26. 26. COME organizzo i dati? • raggrupparli • creare pagine multiple 1 • convenzioni
  27. 27. COME allineo i campi? • in alto • a sinistra • a destra 2 • dentro
  28. 28. http://www.flickr.com/photos/rosenfeldmedia/2367261378/sizes/o/in/set-72157604272550634/
  29. 29. sinistra (32) alto (22) destra (21) alto bold (14) http://www.uxmatters.com/mt/archives/2006/07/label-placement-in-forms.php
  30. 30. AZIONI primarie e secondarie 3
  31. 31. http://www.flickr.com/photos/rosenfeldmedia/2367266922
  32. 32. http://www.flickr.com/photos/rosenfeldmedia/2366430857/sizes/o/in/photostream/
  33. 33. FEED • con parsimonia BACK • possibilmente empatici messaggi di (conversation...) errore • dove? • come evitarli? (campi chiusi, libertà limitata) • la form perfetta 4 non ne avrebbe :)
  34. 34. http://www.flickr.com/photos/rosenfeldmedia/2367269446/sizes/o/in/photostream/
  35. 35. http://mentine.net/contatti :)
  36. 36. FEED BACK messaggi di successo • dare loro un seguito (“so what?”...) 5 • opportunità
  37. 37. UX HOURGLASS spread TW fidelize satisfy pain level verify purchase decide choose explore information wideness 2010 CC NICOLA BONORA se proprio ne volete parlare, citate la fonte! :D
  38. 38. http://www.flickr.com/photos/rosenfeldmedia/2367269044/sizes/o/in/photostream/
  39. 39. http://mentine.net/contatti :)
  40. 40. LESS IS MORE even less is even more :)
  41. 41. posterous.com
  42. 42. TENETEVI SEMPRE IN FORM
  43. 43. grazie! Nicola Bonora

×