Conversion Oriented Design
•
4 likes•1,176 views
Come trasformare un utente in cliente con le tecniche del design dell'esperienza, user-centered e conversion-oriented.
Recommended
Recommended
More Related Content
Viewers also liked
Viewers also liked (8)
Similar to Conversion Oriented Design
Similar to Conversion Oriented Design (20)
Conversion Oriented Design
- 1. InternetDays3ottobre2013 Conversion Oriented Design: da visitatori a clienti soddisfatti Antonio Bonanno - Cristina Viganò Milano, 3 ottobre 2013
- 2. Internet Days 3 ottobre 2013 Chisiamo Antonio Bonanno Managing Partner @antoniobonanno Cristina Viganò UX Researcher @crvigano
- 4. Internet Days 3 ottobre 2013 Agenda–Dicosaparleremooggi? Persuasive Technology 2 Come Creare una Landing Page 5 Why Conversion Oriented Design? 1 User Centered Design 3 Conversion Oriented Design 4 Case study 6
- 5. Internet Days 3 ottobre 2013 Conversation #DesignToConvert #InternetDays
- 6. Internet Days 3 ottobre 2013 Why Conversion Oriented Design?
- 7. Internet Days 3 ottobre 2013 • perdita di interesse • senso di confusione • descrizione poco chiara del prodotto • home page complicata • alto numero di link • navigazione difficoltosa CATTIVO DESIGN UTENTE POCO SODDISFATTO RIDUZIONE VENDITE • riduzione dei click • perdita di fiducia nel brand COD–Perchéserve?
- 8. Internet Days 3 ottobre 2013 COSA SERVE? Conoscenzadeiprincipi Esperienza Competenzanell’usodimetodi estrumenti
- 9. Internet Days 3 ottobre 2013 Conversion Oriented Design Insieme di processi e strumenti improntato al raggiungimento di uno specifico obiettivo di business. User Centered Design Persuasive Technology COD–Cos’è?
- 10. Internet Days 3 ottobre 2013 Persuasive Technology
- 11. Internet Days 3 ottobre 2013 Strumento MezzoAttore sociale RIDUZIONE CONDIZIONAMENTO PERSONALIZZAZIONE SUGGERIMENTO AUTOMONITORAGGIO SORVEGLIANZA GUIDA OGGETTI CAUSA-‐EFFETTO AMBIENTI FATTORE FISICO FATTORE PSICOLOGICO LINGUAGGIO DINAMICHE SOCIALI RUOLI SOCIALI Tecnologia persuasiva
- 12. Internet Days 3 ottobre 2013 RIDUZIONE Semplificareleazioni: “buywithoneclick” Lessismore:menopossibilità disceltarendeiprocessidecisionali piùsemplici
- 13. Internet Days 3 ottobre 2013 Unbounce, 2013 +78%conversioni
- 14. Internet Days 3 ottobre 2013 STIMATA SUPERFICIALE GUADAGNATAPRESUNTA Social proof Look and feel Brand UX CREDIBILITÀ Per essere persuasivo, un sito deve innanzitutto essere credibile e ispirare fiducia. CREDIBILITÀ
- 15. Internet Days 3 ottobre 2013 User Centered Design
- 16. Internet Days 3 ottobre 2013 Definizione di UCD Usercentereddesignèilprocesso diprogettazionecheponealcentro diognipassoibisogni,idesideri eilimitidell’utente. UCDpermettelamassimizzazione dellauserexperience.
- 17. Internet Days 3 ottobre 2013 1 Personas/Scenario 2 Architettura dell’Informazione/Flussi 3 Sketch/Wireframe 4 Visual Design 5 Prototipazione/Test Utente Processo di User-centered Design
- 18. Internet Days 3 ottobre 2013 PERSONAS/SCENARIO Le personas sono archetipi che identificano e tratteggiano comportamenti, desideri ed aspettative di un gruppo specifico di utenti. Realizzate attraverso: • analitiche • ricerche di mercato • giudizio di esperti
- 19. Internet Days 3 ottobre 2013 ARCHITETTURA DELL’INFORMAZIONE L'AI è la struttura organizzativa logica e semantica delle informazioni e dei contenuti presenti all'interno del sistema. Findability: classificazione ed organizzazione dei contenuti in modo che siano trovabili dall’utente nella maniera più veloce ed intuitiva.
- 20. Internet Days 3 ottobre 2013 SKETCH Astrazioni a fedeltà molto bassa del layout, che hanno lo scopo di rappresentare al meglio il concept, le caratteristiche principali e le diverse alternative di design.
- 21. Internet Days 3 ottobre 2013 PROTOTIPAZIONE Un prototipo è un modello approssimato o parziale del sistema che consente di: • mantere il design centrato sull’utente • sperimentare design alternativi • superare il problema della definizione parziale dei requisiti
- 22. Internet Days 3 ottobre 2013 WIREFRAME Rappresentazione ad alta fedeltà della struttura del sistema, che permette di: • ottenere un rapido feedback sul progetto • identificare subito problemi legati alla disposizione e all’importanza degli elementi • apportare modifiche in modo più semplice ed economico
- 23. Internet Days 3 ottobre 2013 VISUAL DESIGN • Look & Feel • Colori • Tipografia • Icone
- 24. Internet Days 3 ottobre 2013 TEST UTENTE Valutano l'efficacia, l'efficienza e la soddisfazione con le quali gli utenti raggiungono determinati obiettivi di utilizzo del sistema. Consentono di: • identificare criticità e colli di bottiglia dell'interfaccia • comprendere meglio aspettative e comportamenti dell’utente
- 25. Internet Days 3 ottobre 2013 Conversion Oriented Design
- 26. Internet Days 3 ottobre 2013 E-COMMERCE LANDING PAGES COD - Cosa comprende?
- 27. Internet Days 3 ottobre 2013 LANDING PAGE L'obiettivo di una landing page è fare in modo che quanti più navigatori arrivino sulla pagina e seguano l'invito a compiere una "azione": l'indice di efficienza viene chiamato "tasso di conversione".
- 28. Internet Days 3 ottobre 2013 44% 62% 55% La percentuale dei click per aziende B2B diretti ancora a una home page invece che a una landing page.* La percentuale di aziende con 6 o meno landing pages.* La percentuale di aumento dei clienti raggiunti quando il numero di landing pages é portato a 16 o più.** *Hubspot, 2013; **Marketing Sherpa, 2013 Overview sull’uso delle landing pages
- 29. Internet Days 3 ottobre 2013 48% 85% 83% Percentuale dei responsabili marketing che creano una landing page per ogni nuova campagna.* Percentuale dei responsabili marketing che vogliono dare più importanza alle landing pages nel 2014.* Percentuale dei responsabili marketing, tra coloro che usano landing pages, che dichiarano di sentirsi sicuri di sé nel loro approccio.* Vantaggio competitivo? Ma non per molto... *Marketing Sherpa, 2013
- 30. Internet Days 3 ottobre 2013 Come progettare una landing page?
- 31. Internet Days 3 ottobre 2013 DESIGN Beauty:unalandingpagedeve avereunottimolookandfeel,dotato diunforteimpattoemotivo.
- 32. Internet Days 3 ottobre 2013 DESIGN Beauty Encapsulation:creareunacornice intornoallaCTAevitachelosguardo delvisitatoresiadistrattodaaltri elementi
- 33. Internet Days 3 ottobre 2013 DESIGN Beauty Encapsulation Contrastandcolor:utilizzarecolori contrastantiperlaCTAaiutaadarle maggiorrisaltoeacatturare l’attenzionedell’utente
- 34. Internet Days 3 ottobre 2013 DESIGN Beauty Encapsulation Contrastandcolor Directionalcues:frecceealtri patternpossonoessereusatiper indirizzarelosguardodell’utente sullaCTA
- 35. Internet Days 3 ottobre 2013 DESIGN Beauty Encapsulation Contrastandcolor Directionalcues Whitespace:utilizzarespazi bianchiperraggruppare l’informazioneevita l’appesantimentograficodella pagina
- 36. Internet Days 3 ottobre 2013 PSICOLOGIA Urgenzaescarsità:ilprocesso decisionaleèacceleratodalla percezionediaverepocotempo
- 37. Internet Days 3 ottobre 2013 PSICOLOGIA Urgenzaescarsità Trybeforeyoubuy:poterprovareil prodottoprimadicomprarlo aumentalafiduciadell’utenteela probabilitàdiconversione
- 38. Internet Days 3 ottobre 2013 PSICOLOGIA Urgenzaescarsità Trybeforeyoubuy Socialproof:lacredibilitàdel prodottoèaumentatadalparere positivodialtriutenti
- 39. Internet Days 3 ottobre 2013 PSICOLOGIA Urgenzaescarsità Trybeforeyoubuy Socialproof Quantitàdiinformazione:l’utente habisognodiinformazioneper scegliere,matroppotestopuò essereoverwhelming
- 40. Internet Days 3 ottobre 2013 PSICOLOGIA Urgenzaescarsità Trybeforeyoubuy Socialproof Quantitàdiinformazione Testimonials:oltrechedalsocial proof,lacredibilitàèaumentatadalla garanziachealtreaziende importantinelsettorefaccianouso delprdotto
- 41. Internet Days 3 ottobre 2013 PSICOLOGIA Urgenzaescarsità Trybeforeyoubuy Socialproof Quantitàdiinformazione Testimonials Form:lasemplicitàdella compilazionedelformè fondamentalepernonfrenarela conversionedell’utente
- 42. Internet Days 3 ottobre 2013 PSICOLOGIA Urgenzaescarsità Trybeforeyoubuy Socialproof Quantitàdiinformazione Testimonials Form Sharing:incentivarelacondivisione dellapaginaneaumentalavisibilità
- 43. A/B testing Questo è il metodo principale che permette di ottimizzare una landing page, confrontando le diverse variazioni possibili. Internet Days 3 ottobre 2013 *Marketing Sherpa, 2012 +5%conversioni
- 44. Internet Days 3 ottobre 2013 Case study
- 45. Internet Days 3 ottobre 2013 MARCHIO IN EVIDENZA BANNER CHE CATTURA L’ATTENZIONE GIUSTA QUANTITÁ DI INFORMAZIONI CALL TO ACTION EVIDENZIATA
- 46. Internet Days 3 ottobre 2013 ULTERIORI INFORMAZIONI TRY BEFORE YOU BUY TESTIMONIALS SPECIFICAZIONE DEI VANTAGGI RIPETIZIONE DELLA CALL TO ACTION INDICAZIONE PER FACILITARE LA SCELTA
- 47. Internet Days 3 ottobre 2013 MARCHIO BEN VISIBILE CALL TO ACTION IN EVIDENZA IMMAGINI EMOZIONALI
- 48. Internet Days 3 ottobre 2013 CALL TO ACTION GIUSTA QUANTITÁ DI INFORMAZIONI IMMAGINI EMOZIONALI CALL TO ACTION
- 49. Internet Days 3 ottobre 2013 BRAND BEN VISIBILE PIÙ IMMAGINI INVECE DI UNA UNICA MAGGIORE QUANTITÀ DI INFORMAZIONI
- 50. Internet Days 3 ottobre 2013 Per concludere
- 51. Uncattivodesigncausaladiminuzionedellevendite IlCODmassimizzailnumerodiconversioni Lelandingpagessonounostrumentoancorapocoutilizzato Lelandingpagesoffronounnettovantaggiocompetitivo Laperformancedeltuobusinesspuòesseremigliorata attraversometodologieestrumentispecifici. Internet Days 3 ottobre 2013 Cosa portare a casa?