Prototipado Rápido
ANALIA BASUALDO
@anagraphics - analiabasualdo@gmail.com
IxDA es una asociación creada para difundir la disciplina del
Diseño de Interacción, que conforma (junto a usabilidad,
arq...
Queremos mejorar la educación y divulgación de UX en español.
Queremos llegar a un nuevo estándar profesional.
Y queremos ...
¿Qué se espera de este taller?
Técnicas y conceptos básicos
y fundamentales de UX
Ideas principales para poder
arrancar su...
0. Introducción
1. Prototipado rápido
2. Heurísticas
3. Evaluaciones de
Usabilidad
4. Diseño Visual
5. Accesibilidad
6. Ne...
Agenda:
1. El proceso iterativo de validación de ideas
2. La hipótesis
3. Prototipado
4. Un poco de contexto: Por qué, par...
Uno simplemente no puede crear
un prototipo de la nada
El proceso iterativo de
validación de ideas.
Necesitás
Proceso iterativo
1. Hipótesis
2. Personas
3. Producto Mínimo Viable
4. Validación
1. Hipótesis
¿Cómo las definimos?
● Declararamos suposiciones.
● Definimos el problema.
● Definimos la hipótesis.
Creemos que
creando un módulo para compartir notas en
redes sociales en el blog de UX
para
desarrolladores y diseñadores d...
2. Personas
Son nuestra mejor predicción
de quién está usando (o usará)
nuestro producto y porqué.
Método para definir personas
Boceto y nombre
Conductas.
Información demográfica.
Puntos de fricción
y necesidades
Solucion...
¿Qué es un prototipo?
Rosenfeld Media . MF211: Figure
Un prototipo es una
aproximación a una experiencia
que te permite simular como se
usaría el producto en cuestión.
¿Cómo empezar?
● ¿Quién interactuará con el proyecto?
● ¿Qué es lo que esperás aprender?
● ¿Cuánto tiempo tenés para crear...
Los prototipos sirven para:
● Exteriorizar ideas.
● Hacer en lugar de analizar.
● Aprender antes de escalar.
● Permitirse ...
Clases de prototipos:
a. Prototipos de baja fidelidad.
b. Wireframes clickeables.
c. Bocetos de mediana/alta calidad.
d. P...
a. Prototipos de baja fidelidad:
Papel, elementos de oficina.
a. Prototipos de baja fidelidad:
Pros
● Se pueden crear en una hora o menos
● Se puede reubicar el contenido fácilmente.
●...
a. Prototipos de baja fidelidad:
Contras
● La iteración rápida puede consumir mucho
tiempo.
● La simulación puede ser muy ...
b. Wireframes clickeables
Powerpoint/Keynote/Invision
b. Wireframes clickeables
Pros
● Provee una idea del flujo de trabajo del producto.
● Revela posibles obstáculos.
● Permit...
b. Wireframes clickeables
Contras
● Los usuarios notan que es algo inacabado.
● Se pone atención extra en el copy.
c. Bocetos media/alta calidad
Axure/Fireworks
Rosenfeld Media . PT051: Figure 9.1
c.Bocetos media/alta calidad
Pros
● Bocetos de alta calidad y realismo.
● Se pueden testear elementos visuales y marcas.
●...
c. Bocetos media/alta calidad
Contras
● Los usuarios no pueden interactuar con datos
reales.
● Consumen mucho tiempo de pr...
d.Prototipos codeados
Pros
● Reutilización del código en producción.
● Es la simulación más realista que existe.
● Se pued...
d. Prototipos codeados
Contras
● Se puede estancar el avance por los detalles finos.
● Crear la experiencia deseada lleva ...
3. Proyecto Mínimo Viable
● Crearlo nos ayuda a testear nuestras
suposiciones.
● Se usa para correr experimentos y
validar...
3. Proyecto mínimo viable
¿Cómo definirlo?
● ¿Hay una necesidad para lo que estoy
construyendo?
● ¿Hay valor en la solució...
4. Validación
Feedback e investigación
● Decidir que se quiere aprender.
● Definir con quién se debería hablar para aprend...
Seguir aprendiendo
links y libros de interés
1. Lean UX - Applying Lean Principles to Improve User
Experience.
2. Google V...
¡GRACIAS!
01. Prototipado rápido: teoría
01. Prototipado rápido: teoría
Upcoming SlideShare
Loading in...5
×

01. Prototipado rápido: teoría

398

Published on

Prototipado rápido, nociones teóricas de experiencia de usuario para comenzar a prototipar y validar tus ideas. Queremos mejorar la educación y divulgación de UX en español. Técnicas y conceptos básicos y fundamentales de UX. El proceso iterativo de validación de ideas. Cómo definir hipótesis, personas y un producto mínimo viable para prototipar rápido. Tipos de prototipos, pros y contras. Validar los prototipos.

Published in: Design
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
398
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
22
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

01. Prototipado rápido: teoría

  1. 1. Prototipado Rápido ANALIA BASUALDO @anagraphics - analiabasualdo@gmail.com
  2. 2. IxDA es una asociación creada para difundir la disciplina del Diseño de Interacción, que conforma (junto a usabilidad, arquitectura de la información y accesibilidad, entre otras) el ecosistema del Diseño de Experiencias del Usuario.
  3. 3. Queremos mejorar la educación y divulgación de UX en español. Queremos llegar a un nuevo estándar profesional. Y queremos construirlo colaborativamente.
  4. 4. ¿Qué se espera de este taller? Técnicas y conceptos básicos y fundamentales de UX Ideas principales para poder arrancar su aprendizaje en el área
  5. 5. 0. Introducción 1. Prototipado rápido 2. Heurísticas 3. Evaluaciones de Usabilidad 4. Diseño Visual 5. Accesibilidad 6. Needfinding 7. Arquitectura de la Información
  6. 6. Agenda: 1. El proceso iterativo de validación de ideas 2. La hipótesis 3. Prototipado 4. Un poco de contexto: Por qué, para qué y cuándo se usan los prototipos 5. Validación 6. Conclusiones ¡Práctica de conceptos!
  7. 7. Uno simplemente no puede crear un prototipo de la nada
  8. 8. El proceso iterativo de validación de ideas. Necesitás
  9. 9. Proceso iterativo 1. Hipótesis 2. Personas 3. Producto Mínimo Viable 4. Validación
  10. 10. 1. Hipótesis ¿Cómo las definimos? ● Declararamos suposiciones. ● Definimos el problema. ● Definimos la hipótesis.
  11. 11. Creemos que creando un módulo para compartir notas en redes sociales en el blog de UX para desarrolladores y diseñadores de experiencias conseguiremos una difusión exitosa de los contenidos y un aporte significativo a la comunidad tecnológica Sabremos que es verdad cuando veamos que se incrementan las visitas y comentarios (y su calidad) en el blog y, estos provenienen de redes sociales.
  12. 12. 2. Personas Son nuestra mejor predicción de quién está usando (o usará) nuestro producto y porqué.
  13. 13. Método para definir personas Boceto y nombre Conductas. Información demográfica. Puntos de fricción y necesidades Soluciones potenciales 1 3 4 2
  14. 14. ¿Qué es un prototipo?
  15. 15. Rosenfeld Media . MF211: Figure
  16. 16. Un prototipo es una aproximación a una experiencia que te permite simular como se usaría el producto en cuestión.
  17. 17. ¿Cómo empezar? ● ¿Quién interactuará con el proyecto? ● ¿Qué es lo que esperás aprender? ● ¿Cuánto tiempo tenés para crearlo? Contestando las siguientes preguntas:
  18. 18. Los prototipos sirven para: ● Exteriorizar ideas. ● Hacer en lugar de analizar. ● Aprender antes de escalar. ● Permitirse fracasar.
  19. 19. Clases de prototipos: a. Prototipos de baja fidelidad. b. Wireframes clickeables. c. Bocetos de mediana/alta calidad. d. Prototipos codeados.
  20. 20. a. Prototipos de baja fidelidad: Papel, elementos de oficina.
  21. 21. a. Prototipos de baja fidelidad: Pros ● Se pueden crear en una hora o menos ● Se puede reubicar el contenido fácilmente. ● Es barato. ● Es divertido.
  22. 22. a. Prototipos de baja fidelidad: Contras ● La iteración rápida puede consumir mucho tiempo. ● La simulación puede ser muy artificial. ● Se puede reubicar el contenido fácilmente. ● El feedback es muy limitado.
  23. 23. b. Wireframes clickeables Powerpoint/Keynote/Invision
  24. 24. b. Wireframes clickeables Pros ● Provee una idea del flujo de trabajo del producto. ● Revela posibles obstáculos. ● Permite aislar elementos esenciales del producto. ● Se puede aprender con recursos existentes.
  25. 25. b. Wireframes clickeables Contras ● Los usuarios notan que es algo inacabado. ● Se pone atención extra en el copy.
  26. 26. c. Bocetos media/alta calidad Axure/Fireworks
  27. 27. Rosenfeld Media . PT051: Figure 9.1
  28. 28. c.Bocetos media/alta calidad Pros ● Bocetos de alta calidad y realismo. ● Se pueden testear elementos visuales y marcas. ● Se pueden observar el flujo de trabajo e interacciones con la interfase.
  29. 29. c. Bocetos media/alta calidad Contras ● Los usuarios no pueden interactuar con datos reales. ● Consumen mucho tiempo de preparación y mantenimiento.
  30. 30. d.Prototipos codeados Pros ● Reutilización del código en producción. ● Es la simulación más realista que existe. ● Se puede generar con elementos existentes.
  31. 31. d. Prototipos codeados Contras ● Se puede estancar el avance por los detalles finos. ● Crear la experiencia deseada lleva mucho tiempo. ● Actualizar e iterar puede consumir mucho tiempo.
  32. 32. 3. Proyecto Mínimo Viable ● Crearlo nos ayuda a testear nuestras suposiciones. ● Se usa para correr experimentos y validar las hipótesis o saber en qué dirección seguir explorando.
  33. 33. 3. Proyecto mínimo viable ¿Cómo definirlo? ● ¿Hay una necesidad para lo que estoy construyendo? ● ¿Hay valor en la solución que estoy ofreciendo? ● ¿Mi solución es usable? Contestando las siguientes preguntas:
  34. 34. 4. Validación Feedback e investigación ● Decidir que se quiere aprender. ● Definir con quién se debería hablar para aprender. ● Crear una guía de entrevistas. ● Comenzar conversando. ● Mostrarle al cliente el PMV. ● Recolectar notas.
  35. 35. Seguir aprendiendo links y libros de interés 1. Lean UX - Applying Lean Principles to Improve User Experience. 2. Google Ventures 3. Participar de IxDA Mendoza! 4. Templates gratuitos y popapp.in 5. Plantillas en google docs
  36. 36. ¡GRACIAS!
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×