1. 1. Vol.10 Prototipado Cundo usar prototipos digitales? Carlos Elas Ochoa @carluxdns
2. 2. Carlos Elas Ochoa
3. 3. Lo que me gustara dejarte 1. Para qu sirve un prototipo? 2. Qu fidelidad y proceso utilizar? 3. Cundo utilizar una herramienta digital? 4. Qu herramienta utilizar?
4. 4. Qu es un prototipo?
5. 5. Del Griego. prttypos. 1. m. Ejemplar original o primer molde en que se fabrica una figura u otra cosa.
6. 6. -Kara Pierce Senior Vice President at Nielsen Norman Group A user interface prototype is a hypothesis a candidate design solution that you consider for a specific design problem
7. 7. Por qu hacemos prototipos?
8. 8. 1. Comunicar y colaborar 2. Entender problemas y resolverlos 3. Experimentar 4. Obtener retroalimentacin 5. Prioridades de diseo
9. 9. Qu fidelidad y proceso utilizar?
10. 10. OBJETIVOS
11. 11. Visual Fidelity vs Functionality Fidelity
12. 12. Photo Credit: Marcin Treder, UXPin Based on: Integrating Prototyping Into Your Design Process by Fred Beecher
13. 13. Low Visual + Low Functionality Paper prototype/ Most wireframes
14. 14. 1. Definir y entender el proyecto 2. Identificar caractersticas necesarias 3. El flujo tiene sentido? 4. Conceptos de UX funcionan mejor 5. Validar la direccin del diseo de UX con los Stakeholders
15. 15. High Visual + Low Functionality Mockups
16. 16. Lnea base de diseo Impresionar stakeholders Aspecto visual afecta en la facilidad de uso
17. 17. Low Visual + High Functionality Interactive wireframes/ Mid-fi Prototype
18. 18. Wireframes animados Rpido Eficiente Experiencia , no en entregables Evaluar usabilidad para nuevos sistemas Obtener validaciones de los stakeholders Complementar la documentacin Diseo de interaccin
19. 19. High Visual + High Functionality Hi-fi Prototype
20. 20. A un paso MVP Evaluar de usabilidad para sistemas existentes Estimaciones ms exactas Realizar de pruebas de usabilidad remotas El equipo est en diferentes partes Complementar la documentacin
21. 21. TIEMPO, ESFUERZO Y CONOCIMIENTO
22. 22. Tiempo Esfuerzo Low Visual + High Functionality High Visual + High Functionality Low Visual + Low Functionality High Visual + Low Functionality Conocimiento tcnico
23. 23. Qu herramienta digital usar?
24. 24. 1. Qu problema voy a resolver? 2. Cunto tiempo disponible ? 3. Cmo integrarlo a mi flujo de trabajo? 4. Para quin es? Stakeholders, Usuario, Desarrolladores 5. Qu es lo que quiero conocer? 6. Voy a colaborar con alguien?
25. 25. "Traversing the UX Prototyping Landscape Lucid Software Design ...." 7 jun.. 2016, https://medium.com/lucid- software-design/traversing-the-ux-prototyping-landscape-33edc700c1bd. Se consult el 23 mar.. 2017.
26. 26. "Traversing the UX Prototyping Landscape Lucid Software Design ...." 7 jun.. 2016, https://medium.com/lucid- software-design/traversing-the-ux-prototyping-landscape-33edc700c1bd. Se consult el 23 mar.. 2017.
27. 27. Buenas prcticas
28. 28. 1. Evitar LOREM IPSUM 2. Usar Informacin Genrica 3. Informacin real
29. 29. Conclusiones
30. 30. 1. Para qu sirve un prototipo? 2. Qu fidelidad y proceso utilizar? 3. Cundo utilizar una herramienta digital? 4. Qu herramienta utilizar?
31. 31. @carluxdns carlos.ochoa.uxnights@gmail.com GRACIAS
32. 32. "MF212: Figure 6.16 |Rosenfeld Media" 22 mar.. 2012, https://www.flickr.com/photos/rosenfeldmedia/7171777152. Se consult el 25 mar.. 2017. "Wireframes | VFS Digital Design." 8 feb.. 2011, https://www.flickr.com/photos/vfsdigitaldesign/5431725069. Se consult el 25 mar.. 2017. "Traversing the UX Prototyping Landscape Lucid Software Design ...." 7 jun.. 2016, https://medium.com/lucid-software-design/traversing-the- ux-prototyping-landscape-33edc700c1bd. Se consult el 23 mar.. 2017. "Traversing the UX Prototyping Landscape Lucid Software Design ...." 7 jun.. 2016, https://medium.com/lucid-software-design/traversing-the- ux-prototyping-landscape-33edc700c1bd. Se consult el 23 mar.. 2017. Jerry Cao (co-written by Kamil Zieba & Matt Ellis), (2005).The Ultimate Guide to Prototyping. The best prototyping methods, tools and processes. UXPin Inc. https://www.uxpin.com/studio/ebooks/guide-to-prototyping/ "Integrating Prototyping Into Your Design Process Boxes and Arrows." 22 sept.. 2009, http://boxesandarrows.com/integrating-prototyping- into-your-design-process/. Se consult el 23 mar.. 2017. "High-Fidelity Prototypes | Silicon Valley Product Group." 29 abr.. 2008, http://svpg.com/high-fidelity-prototypes/. Se consult el 29 mar.. 2017. "Traversing the UX Prototyping Landscape Lucid Software Design ...." 7 jun.. 2016, https://medium.com/lucid-software-design/traversing-the- ux-prototyping-landscape-33edc700c1bd. Se consult el 23 mar.. 2017.