Unbounce Optimization Alberto Mucignat Milano, 01 dicembre 2015
Doralab - Experience Design Company User Intelligence User Experience Design Business value 2
3
Full stack UX design Architettura dell informazione Information architect progettano strutture di navigazione, ricerca, filtri e organizzazione dei contenuti. Prototyping & Visual Design Vengono realizzati prototipi interattivi corredati di visual design e fogli di stile finali. Editing dei contenuti Digital Editor esperti formati nel copywriting efficace scrivono e ottimizzano i testi digitali. Verifiche di usabilità Tutti i prototipi vengono testati con gli utenti in laboratorio per garantire la massima usabilità ed efficacia. Interaction design UX designer progettano le macro e micro interazioni, per favorire le azioni da parte degli utenti. Documentazione visuale Ogni pagina, ogni interazione viene documentata e descritta in ogni minimo particolare. Deliverable Rilasciamo prototipi responsive in html/css/js pre-production ready, corredati da documentazione che descrive le interazioni e i dettagli mancanti per evitare errori in fase di produzione. 4
Specializzati in ricerca comportamentale Perché? Cosa? 5
User Intelligence: Ricerca Comportamentale + Web Analytics Percorsi utente reali Motivazioni di acquisto Modelli mentali Informazioni mancanti o rilevanti Imprecisioni di labeling Errori di copywriting Azioni impreviste Organizzazione delle informazioni (menu, voci, labeling) Campi critici 6
5 motivi principali per cui gli utenti rimbalzano" 1 Non è quello che cercavo A volte succede anche se la pagina è giusta! 2 Non capisco cosa fare dopo 3 Non c è l informazione che cerco 4 Non ci sono abbastanza informazioni 5 Non capisco come funziona 7
Come funziona il processo di landing?
Landing e acquisizione Landing Page Paid Homepage Funnel 1 Funnel 2 Funnel 3 Organic Product & Product Listing Product Pages Pages Pages 9
Il ciclo decisionale dell utente Informarsi Confrontare Scegliere Ricerca Doralab 2012 sui comportamenti di acquisto online 10
Flusso di acquisizione e comportamento di acquisto Landing Page Paid Homepage Funnel 1 Funnel 2 Funnel 3 Organic Product & Product Listing Product Pages Pages Pages Informarsi Confrontare Scegliere 11
Comportamento sui motori di ricerca /1 Landing Page Homepage Product & Product Listing Product Pages Pages Pages 12
Comportamento sui motori di ricerca /2 Pronti all acquisto, cercano promozioni Cercano informazioni e comparano prodotti 13
La fame informativa è il risultato del fenomeno razionale imposto dal web 14
Quando c è poco tempo a disposizione il fenomeno peggiora 15
Come faccio a mappare tutte le informazioni?
1. Differenziare i tipi di informazioni Landing Page + Homepage Product & Product Listing Product Affinamento delle ricerche: processo mentale di ricerca e selezione del prodotto Approfondimento del prodotto, costruzione dell acquisto 17
2. Segmentare le informazioni per sorgente e per task Landing Page Paid Homepage Funnel 1 Funnel 2 Funnel 3 Organic Product & Product Listing Product Pages Pages Pages 18
3. Segmentare le informazioni in base al landing Landing Page Paid Homepage Funnel 1 Funnel 2 Funnel 3 Organic Product & Product Listing Product Pages Pages Pages 19
4. Approfondire le informazioni per tipologie di prodotto Landing Page Paid Homepage Funnel 1 Funnel 2 Funnel 3 Organic Product & Product Listing Product Pages Pages Pages Deep digging 20
Si possono adattare le interfacce a bisogni particolari 21
Si può evitare la razionalità? 22
5. Analizzare le query interne al sito per scoprire le domande che si fanno gli utenti 23
Come fare per progettare il design delle pagine
Centinaia di informazioni ricercate per l acquisto di prodotti e servizi 25
Redesign informativo della landing 26
Ricercare la linearità della lettura grazie al mobile first 27
Personalizzazioni per tipologia di prodotto Category page Content of filters Category landing page Filters have been developed according to actual products to be sold online in the next season. Other filters are probably to be added in the next seasons. Order of filters They include, when applicable: Color Material Size Occasion Details of the product (e.g. shape, buttoning, length...) As categories of filters are 6, at most (for example in coats) and 1, at most (for example hats) they fit in the horizontal layout. 31 Category of filters are ordered by relevance in every category page. Category landing page Users tests partially confirmed this order. Filters In dresses, for example, users selected type first of all, and then color, material, size and - only when necessary - occasion Filters are in alphabetical order inside their categories, so that users can recognize the principle and scan them easily Filter labels must make it clear what kind of content will be revealed by the filter itself. For example, if the word Synthetic as a material doesn t suit for communication reasons, the alternative should be clear enough for users to understand what s included Among colors Brown and camel has been chosen to enhance the visibility of such an important color for the brand. 32 The user has no filters combination limits. In the unlikely event she selects such number that can't be displayed on top, the system should indicate the number of the filters left to apply (this function is not in the prototype). Note: in the mobile version this issue doesn t appear because the filters applied are not listed in detail, but only as an aggregate number (clear 10 filters). Of course, the user can view and edit each filter by expanding the accordion. 36 28
Conclusioni
User Intelligence Comportamentale Landing Page Homepage Funnel 1 Funnel 2 Funnel 3 Product Product & Listing Product Pages Pages Unbouncing Optimization Site Optimization Funnel Optimization 30
Grazie. Alberto Mucignat alberto.mucignat@doralab.it http://www.doralab.it