Mobile design 01 _ Diseño centrado en el usuario

1,194 views

Published on

Presentación introductoria a la metodología de diseño centrado en el usuario para el diseño de aplicaciones móviles. Curso a cargo del profesor Juan Paulo Madriaza - Uniacc - 2011

Published in: Design
1 Comment
2 Likes
Statistics
Notes
No Downloads
Views
Total views
1,194
On SlideShare
0
From Embeds
0
Number of Embeds
22
Actions
Shares
0
Downloads
55
Comments
1
Likes
2
Embeds 0
No embeds

No notes for slide

Mobile design 01 _ Diseño centrado en el usuario

  1. 1. Clase 01
  2. 2. MetodologíaDISEÑO CENTRADO EN EL USUARIO
  3. 3. UCD• Filosofía de diseño que tiene por objetivo la creación de productos que resuelvan necesidades concretas de sus usuarios finales
  4. 4. UCD• Toma forma como un proceso en el que se utilizan una serie de técnicas multidisciplinares y donde cada decisión tomada debe estar basada en las necesidades, objetivos, expectativas, motivaciones y capacidades de los usuarios.
  5. 5. UCD• Tienen el siguiente esqueleto: – Conocer a fondo a los usuarios finales – Diseñar un producto que resuelva sus necesidades y se ajuste a sus capacidades, expectativas y motivaciones – Poner a prueba lo diseñado
  6. 6. User Centered DesignMETODOLOGIA UCD
  7. 7. MetodologíaEtapa 1 - Research• Entender / Establecer el problema – Insightment – Rebrief – Benchmark – Personas
  8. 8. Metodologías Etapa 1Insightment ¿Para qué sirve? Para encontrar productos o servicios que le hagan sentido a los usuarios ¿Cuándo se hace? Al momento de empezar un proyecto, para definir la problemática a abordar ¿Cómo se hace? Se define superficialmente un tipo de usuario y un contexto de relación Se levantan observaciones por parte de los usuarios Las observaciones se categorizan y jerarquizan Se crean frases representativas con la estructura «Quiero___porque___pero___»
  9. 9. Metodologías Etapa 1Rebrief ¿Para qué sirve? Para entender mejor a nuestro cliente y sus solicitudes ¿Cuándo se hace? Al momento de empezar un proyecto que es solicitado por un cliente ¿Cómo se hace? Se presenta al cliente un cuestionario de preguntas predefinidas Se elabora una ficha de proyecto que contenga los puntos más relevantes a abordar Se valida con el cliente
  10. 10. Metodologías Etapa 1Benchmark ¿Para qué sirve? Para no inventar la rueda, para no cometer los mismos errores de otros, para diferenciarme de mi competencia ¿Cuándo se hace? Al momento de empezar un proyecto que ya está relativamente definido en su contexto ¿Cómo se hace? Se seleccionan referentes atingentes Se analizan en detalle y se seleccionan las razones de su selección Se monta una presentación con los hallazgos
  11. 11. Metodologías Etapa 1Personas y escenarios ¿Para qué sirve? Para entender a los usuarios, sus intereses, motivaciones, contextos de uso, preocupaciones, etc ¿Cuándo se hace? Al momento de empezar un proyecto ¿Cómo se hace? Se definen arquetipos de usuarios Se hacen entrevistas con los involucrados Se crean fichas por cada usuario mencionando sus características como si estuviéramos definiendo a una persona real
  12. 12. MetodologíaEtapa 2 – Diseño de concepto• Entender / Establecer el problema – Brainstorming – Design The box
  13. 13. Metodologías Etapa 2BrainStorming ¿Para qué sirve? Para crear ideas de manera colaborativa que permitan resolver el problema ¿Cuándo se hace? En cualquier momento del proyecto, cuando sea necesario el acopio de ideas ¿Cómo se hace? Se reúne al equipo creativo Se define a uno o dos escritores de ideas Se lanzan ideas a la mesa Se escriben en postits Se categorizan los postits Se jerarquizan y evalúan las ideas
  14. 14. Metodologías Etapa 2Design The Box ¿Para qué sirve? Para asentar las ideas y funcionalidades de la solución ¿Cuándo se hace? Cuando está terminando el proceso creativo del concepto ¿Cómo se hace? Se forra con papel una caja de leche Se dibuja en la caja el nombre, tagline, promesas, gráfica, descri pción detallada y requerimientos del proyecto
  15. 15. MetodologíaEtapa 3 – Diseño de Interacción• Proponer estructuras de solución – Mapas de flujo – Capacidades del sistema – Mapas de navegación
  16. 16. Metodologías Etapa 3Mapas de Flujo ¿Para qué sirve? Para visualizar los pasos necesarios para completar las tareas disponibles ¿Cuándo se hace? Cuando están definidas las tareas posibles a realizar en el sistema ¿Cómo se hace? Se definen las tareas de los personas Se crea un diagrama que permite ver los pasos y decisiones que debe tomar el usuario para completar cada tarea Se integran las distintas tareas en un único mapa
  17. 17. Metodologías Etapa 3Capacidades del sistema ¿Para qué sirve? Para definir específicamente todas las funcionalidades de la solución ¿Cuándo se hace? Cuando se tiene claridad sobre las necesidades de interacción del usuario ¿Cómo se hace? Se crea una tabla con todas las posibles funcionalidades del sistema Se asignan niveles de importancia y complejidad a cada funcionalidad Se definen las funcionalidades que van finalmente en la solución
  18. 18. Metodologías Etapa 3Mapa de navegación ¿Para qué sirve? Para visualizar las distintas pantallas de la solución ¿Cuándo se hace? Cuando se tiene claridad sobre las funcionalidades del sistema ¿Cómo se hace? Se establecen todos los contenidos del sistema Se definen las distintas secciones, subsecciones y páginas Se crea un diagrama que permita entender las relaciones entre las distintas páginas de la solución
  19. 19. MetodologíaEtapa 4 – Diseño de Prototipos• Proponer prototipos de solución – Sketching – Wireframing – Prototipado Interactivo – User Testing
  20. 20. Metodologías Etapa 4Sketching ¿Para qué sirve? Para proponer mediante dibujos el diseño de las pantallas de la solución ¿Cuándo se hace? Cuando está definido el mapa de navegación ¿Cómo se hace? Se dibujan propuestas preliminares de las principales pantallas en hojas de papel Se van seleccionando y mejorando rápida y progresivamente Se puede hacer una sesión de co-creación con el cliente
  21. 21. Metodologías Etapa 4Wireframing ¿Para qué sirve? Para especificar el diseño de cada página, comprobar su funcionalidad ¿Cuándo se hace? Cuando se está conforme con los resultados del sketching ¿Cómo se hace? Se definen las plantillas a prototipar Se utiliza un software de wireframing (axure) Se validan los resultados Se realizan iteraciones hasta estar convencido de la solución
  22. 22. Metodologías Etapa 4Prototipado Interactivo ¿Para qué sirve? Para agregar interactividad a la solución antes de poder probarla con usuarios ¿Cuándo se hace? Cuando se obtiene la validación del proceso de wireframing ¿Cómo se hace? Se definen tareas a probar por parte de los usuarios Se le aplica interactividad a los wireframes seleccionados para poder probarlos en el dispositivo
  23. 23. Metodologías Etapa 4User testing ¿Para qué sirve? Para testear el funcionamiento de la solución antes de entrar a la propuesta visual ¿Cuándo se hace? Cada vez que se pueda ;) ¿Cómo se hace? Se definen tareas a probar Se captan usuarios reales que puedan probar la solución Se les solicita que traten de realizar las tareas Se toma registro de lo sucedido Se hacen cambios en la interfaz que solucionen los problemas encontrados
  24. 24. MetodologíaEtapa 5 – Diseño Visual• Proponer interfaces de solución – Key Visual – Diseño visual de interfaces
  25. 25. Metodologías Etapa 5Key Visual ¿Para qué sirve? Para acercarse a la definición visual de la solución ¿Cuándo se hace? Cuando se tiene claridad sobre las funcionalidades del proyecto ¿Cómo se hace? Se crean «posters» de la gráfica de la solución No deben ser pantallas de la solución, tienen una orientación netamente estético- comunicacional Se validan con usuarios
  26. 26. Metodologías Etapa 5Diseño visual de interfaces ¿Para qué sirve? Para definir el diseño de las pantallas de la solución ¿Cuándo se hace? Cuando se tiene aprobado el prototipo interactivo ¿Cómo se hace? Se toman de referencia los prototipos interactivos Se procede a aplicar gráfica a las pantallas (colores, tipografías, texturas, imágenes, etc .) Se valida con usuarios
  27. 27. MetodologíaEtapa 6 – ProgramaciónEtapa 7 – ValidaciónEtapa 8 – PublicaciónEtapa 9 – Actualización
  28. 28. Resumen
  29. 29. ¿Preguntas? Gracias Juan Paulo Madriaza Diseñador de Interfaces www.uxd.cl
  30. 30. ¿Preguntas? Gracias  Juan Paulo Madriaza Diseñador de Interfaces www.uxd.cl

×