Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Lean Prototyping

792 views

Published on

Verifica, misura e valida le tue assunzioni con il minimo sforzo e nel più breve tempo possibile.

Published in: Design
  • Be the first to comment

Lean Prototyping

  1. 1. Lean Prototyping verifica, misura e valida le tue assunzioni con il minimo sforzo e nel più breve tempo possibile. by Luca Scarpa DevMarche Ancona, Novembre 13, 2014
  2. 2. Luca Scarpa CTO, CFO e frontend developer @ GNV&Partners @luscarpa
  3. 3. Che cos’è un prototipo
  4. 4. Definizione Il prototipo è il modello originale o il primo esemplare di un manufa o, rispe o a una sequenza di eguali o similari realizzazioni successive. Normalmente costruito in modo artigianale e in scala 1:1, sul prototipo verranno effe uati collaudi, modifiche e perfezionamenti, fino al prototipo definitivo, da avviare alla produzione in serie. Source: h p://it.wikipedia.org/wiki/Prototipo
  5. 5. Una primissima versione di un’idea
  6. 6. Una primissima versione di un’idea testabile {
  7. 7. Perché?
  8. 8. Per rispondere alle domande
  9. 9. Per rispondere alle domande e generarne di nuove
  10. 10. Testare le assunzioni
  11. 11. Comparare alternative
  12. 12. Ridurre i rischi
  13. 13. Condividere le vostre idee con gli altri
  14. 14. Condividere le vostre idee con gli altri Team Stakeholders Users Angels Investors Clients Boss
  15. 15. Quando?
  16. 16. ideare prototipare testare / validare condividi
  17. 17. ideare prototipare testare / validare condividi Prima possibile!
  18. 18. Sketch “L’intento dello sketching è di separare il design dal processo di creazione” • veloce • tempestivo • economico • monouso • esplorativo • non dettagliato • opportuno • divergente • comunicativo Caratteristiche
  19. 19. Wireframe “Lo scopo di un wareframe è di comunicare ed esplorare i conce i che escono dallo sketching, quei conce i che si vuole ulteriormente approfondire durante la fase di design dell’interfaccia utente” • veloce • economico • attuabile • ambiguo • minimale • opportuno • confirmatorio Caratteristiche
  20. 20. Elaborazione delle idee Riduzione delle dell’ideeLaseau’s Funnel Processo di design
  21. 21. Prototipo
  22. 22. Rapido Il prototipo deve essere realizzato nel minor tempo possibile per supportare la creazione di molteplici versioni. Deve poter essere modificato in maniera iterativa e lasciar spazio al cambiamento in modo veloce.
  23. 23. Economico Il prototipo, sopra u o nelle primissime versioni, potrebbe prendere strade completamente opposte al desiderata, per cui è necessario poter ricominciare da zero senza avere ripercussioni disastrose nell’andamento del proge o.
  24. 24. Minimale Il prototipo deve rispondere a domande funzionali, non estetiche o di de aglio, deve contenere le funzionalità principali che riescono a ridurre gli sprechi futuri.
  25. 25. Testabile Il prototipo deve poter essere utilizzato dai vostri utenti, deve essere utilizzabile, non deve soffermarsi sul raccontar loro del prodo o, ma focalizzarsi sulla funzionalità che necessita di essere validata.
  26. 26. Misurabile Il prototipo deve poter fornire dati su cui basare le proprie scelte e deve potervi “parlare” su livello di gradimento dei vostri utenti. Anche il dato negativo è tanto importante quanto il dato positivo, ma in entrambi i casi vanno raccolti.
  27. 27. Pianifica per come deve FUNZIONARE, NON per come deve sembrare
  28. 28. Sketch vs Prototipo
  29. 29. Sketch Prototipo Evocative Didactic Suggest Describe Explore Refine Question Answer Propose Test Provoke Resolve Tentative Specific Non-commi al Depiction Fonte: Sketching User Experiences di Bill Buxton
  30. 30. Esempio pratico LA FUSIONE
  31. 31. Idea
  32. 32. Steps 1/7
  33. 33. Steps 2/7
  34. 34. Steps 3/7
  35. 35. Steps 4/7
  36. 36. Steps 5/7
  37. 37. Steps 6/7
  38. 38. Steps 7/7
  39. 39. Risultato
  40. 40. Visual Design 1/3
  41. 41. Visual Design 2/3
  42. 42. Visual Design 3/3
  43. 43. Prototipo
  44. 44. Predisporsi al fallimento
  45. 45. Reiterare #FAIL
  46. 46. Reiterare #FAIL
  47. 47. Reiterare #WIN
  48. 48. Cura dei de agli
  49. 49. Risultato finale
  50. 50. Qual è il grado di fedeltà?
  51. 51. Fedeltà Il grado di precisione con cui qualcosa è riprodo o
  52. 52. Bassa fedeltà Alta fedeltàvs
  53. 53. Bassa fedeltà Alta fedeltàvs Veloce Lento { {
  54. 54. Bassa fedeltà Alta fedeltàvs Veloce Lento { {
  55. 55. Prime iterazioni di esplorazione Tempo Fedeltà Sketches Wireframes Prototipi Design Ideazione Validazione concetti User Experience
  56. 56. Iterazioni di avanzamento Tempo Fedeltà Sketches Prototipi Design Ideazione Validazione concetti User Experience
  57. 57. Prototipi a bassa fedeltà
  58. 58. “I prototipi a bassa fedeltà sono costituiti da limitate funzionalità e minima interazione. Sono costruiti per rappresentare conce i, alternative di design e diverse risoluzioni… Questi prototipi sono creati per comunicare, educare ed informare.” cit. Low vs. high-fidelity prototyping debate Esempi: Prototipi su carta Prototipi cliccabili
  59. 59. Prototipi su carta Realizzati con componenti molto semplici: carta, penna e nastro adesivo consentono di simulare esperienze in modo veloce, divertente e furbo. Non richiedono alcun tipo di investimento digitale e grazie alla creatività è possibile simulare avanzamenti di stato o interazioni particolari. Sono molto utili sopra u o in ambienti touch che richiedono all’utente la manipolazione degli elementi sullo schermo.
  60. 60. Prototipi su carta Pro • Possono esser creati in poco tempo, 1 ora • Facili da ada are e riada are • Economici • Possono essere prodo i con materiali facilmente reperibili in qualsiasi situazione • Possono esser prodo i in real-time con l’interlocutore • A ività divertente che può me ere a proprio agio l’interlocutore • Tengono basse le aspe ative di design e aiutano a rimanere focalizzati sulle funzionalità e i comportamenti Contro • La facilità di cambiamento può diventare dispersiva e time- consuming • Richiedono una buona immaginazione e un o imo livello di astrazione da parte dell’interlocutore • Il feedback è limitato alla stru ura di alto livello e al comportamento del prodo o
  61. 61. Prototipi su carta - Esempi
  62. 62. Prototipi su carta - Interviste Componenti per la sessione di test: • Un facilitatore che spiega la procedura e fornisce dei task all’utente, deve cercare di far parlare l’intervistato al fine di carpire il ragionamento che sta dietro ad ogni azione. • Un membro del team di design che fa il ruolo di computer, cambia i vari wireframe di fronte all’utente, fondamentale che chi fa il ruolo del computer rimanga completamente in silenzio. • L’intervistato può interagire con il prototipo su carta con una penna per evidenziare dove cliccherebbe o dove effe uerebbe l’azione di touch/swipe/etc.. nel caso di device mobile
  63. 63. Prototipi cliccabili Aumentano l’esperienza dell’utente e portano ad un livello superiore il grado di fedeltà. Richiedono un investimento digitale in cambio di un flusso di lavoro molto più realistico. Abbassano il livello di astrazione offrendo insight e feedback maggiori nel modo con cui l’utente interagisce con il prodo o.
  64. 64. Prototipi cliccabili Pro • Possibilità di rappresentare più stati della stessa interfaccia • Offrono maggiori “ostacoli” al completamento dei task principali • Consentono la valutazione della reperibilità degli elementi fondamentali • Richiedono meno persone per la sessione di test con l’utente • Offrono una base di discussione e condivisione interna al team Contro • Molti utenti possono non essere abbastanza esperti per comprendere che non si parla di un prodo o finito • Richiedono maggiore a enzione sul copy e sulle etiche e • Richiedono un’introduzione precisa di cos’è a ivo e di cosa si sta visualizzando
  65. 65. Prototipi cliccabili - Tools InVision Proto.io Mockup.io POP (import paper designs) Flinto Solidify Balsamiq Axure
  66. 66. Demo
  67. 67. Prototipi cliccabili - Interviste Componenti per la sessione di test: • Un facilitatore che spiega la procedura e fornisce dei task all’utente. • Un intervistato che può interagire con il prototipo. • Il device che riproduce il tool (desktop, mobile, tablet). L’intervista può essere più o meno guidata a seconda del grado di azioni abilitate nel prototipo.
  68. 68. Prototipi a medio-alta fedeltà
  69. 69. “Userete questa tipologia di prototipo per mostrare e testare le funzionalità concretizzate ad un livello di interazione, design e contenutistica simile (o indistinguibile da) all’esperienza del prodo o finale.“ cit. Lean UX book Esempi: Prototipi codati
  70. 70. Prototipi codati Offrono il più alto livello di esperienza simulata Possono essere utilizzati per qualsiasi tipo di scopo. Propongono un’esperienza pressoché reale, l’unico modo per l’utente di capire che sta navigando un prototipo e non il prodo o finale è entrare in qualche funzionalità non implementata. Si distinguono in due tipologie, codati a mano o guidati da dati reali.
  71. 71. Prototipi cliccabili Pro • Possibilità di riutilizzo del codice per la fase di produzione • Esperienza utente il più realistico possibile • Possono essere generati da asset esistenti • Possibilità di testare su diversi viewport e device contemporaneamente • Obbliga l’intero team a rimanere allineato sugli avanzamenti di proge o • Abba e il waterfall • Offre una precisa base di discussione e condivisione interna al team Contro • Il tempo di sviluppo per la realizzazione può esplodere • Potrebbe aumentare i diba iti del team su aspe i poco cruciali per le domande a cui si vuol dar risposta • Aggiornamenti e manutenzione possono portar via tempo • Tendenza ad o imizzare e perfezionare il codice o la qualità del rilascio
  72. 72. Demo
  73. 73. It’s really hard to design products by focus groups. A lot of times, people don’t know what they want until you show it to them. -Steve Jobs
  74. 74. Grazie a tu i @luscarpa www.gnvparterns.com

×