Taller de Prototipado Iterativo

Para IxDA Córdobapor Martín Szyszlican

Programa:

1) Presentación de los participantes y el coordinador

2) Proceso de Diseño Centrado en el Usuario

3) ¿Qué son los prototipos en papel? ¿Cuando utilizarlos?

4) Realización de ejercicio de prototipado

5) Realización de pruebas de usuario

6) Correcciones al prototipo y nueva ronda de pruebas

7) Conclusiones, debate y pizzas.

Taller de Prototipado Iterativo Página 1 de 9

Presenta: www.clinica-web.com.ar Invita: www.ixdacba.com.ar

Auspicia: www.lemon.com

Auspicia: www.nutus.com.ar

Diseño Centrado en el UsuarioMuchas veces ocurre, sobre todo en estas épocas de tercerización, que se está trabajando en un proyecto sin tener más que una vaga noción de para quién es ese sitio. Por más que conozcamos al dueño del sitio o al inversor, no trabajamos para ellos, sino para su negocio, y su negocio es el de darle un producto o servicio a alguien.

Ese alguien es el usuario del sitio que estamos construyendo. Es muy importante conocerlo, saber sus intereses, su forma de pensar y relacionarse tanto con las áreas temáticas sobre las que tratará nuestro sitio como con las formas de interacción que se proponen. Saber esto nos permitirá hacer un sitio más útil, fácil de comprender y efectivo ya que podremos incluir al usuario en cada una de las decisiones que tomemos durante el proyecto.Necesitamos saber sobre conocimientos y modos de uso, esta información tiende a ser dinámica y variar en cada grupo, es por eso que debemos realizar una investigación utilizando alguno de los siguientes métodos:

• Entrevistas.• Encuestas.• Informes de mercado.• Conocimiento previo.

Los resultados de la investigación deben ser consolidados en un formato liviano, fácil de comprender por todos los involucrados en el proyecto e incluso en otros proyectos. Para eso es muy bueno escribirhistorias que cuenten la vida de nuestros usuarios, incluso inventando para ellos nombres y fotografías, estas pequeñas biografías-cuentos se llaman personajes.Adicionalmente suelen escribirse textos en los que de describen las situaciones en las que esperamos que los usuarios accedan al sitio, de forma que podamos comprender su disposición mental en ese momento y así acercarles exactamente la información que necesitan. Estos relatos se llaman escenarios. Una versión más técnica de estos escenarios son los llamados casos de uso.Recién cuando sabemos para quién trabajamos y en qué momento se encontrará con nuestro sitio, es que podemos empezar a pensar en el contenido, la funcionalidad y la apariencia que el sitio necesita para ser efectivo.

Taller de Prototipado Iterativo Página 2 de 9

Diseño centrado en el usuario Agile

En el desarrollo de sistema o ciclo del software, lo se conoce como Desarrollo Ágil, nace como un mecanismo de supervivencia ante los requerimientos cambiantes por parte del cliente durante un desarrollo a medida. Esta estrategia se trata de reducir consideradamente la pesada documentación y generar entregables a corto plazo.

Esta idea podemos combinarla con el Diseño Centrado enel Usuario, para ello debe ser suficientemente flexibles desde la etapa del diseño, dividiendo el requerimiento global de manera que las interfaces resultantes puedas ser observadas y ajustadas a medida que se avanza las otras. No olvidar que el Diseño Centrado en el Usuario es un proceso cíclico y en constante evaluación que al agregar el modelo de desarrollo ágil nos puede facilitar la tarea de recibir los cambios o ajustes del cliente cuando le mostramos por partes el desarrollo de su producto agilizando la entrega de avances.

Taller de Prototipado Iterativo Página 3 de 9

Prototipado de baja fidelidad

“Es tu trabajo como profesional de la experiencia de usuario producir la mejor experiencia dentro del tiempo y el presupuesto disponible, tenés que confiar en que las herramientas y técnicas que elijas van a ser las correctas para darte la información que necesitás dentro de las limitaciones del proyecto” Por Jesmond Allen and James Chudley http://uxdesign.smashingmagazine.com/2013/01/24/effectively-planning-ux-design-projects/

Ventaja del prototipado en papel: Ahorrar tiempo. Un prototipo como el interlocutor de un proceso de pensamiento en lugar de un entregable (José Allona).

Etimología de prototipo http://www.etymonline.com/index.php?term=prototype http://dictionary.reference.com/browse/prototype

Griego prototypon: "una forma inicial o primitiva" De protos "inicial, primera" + typos "impresión."

Etimología de fidelidad http://www.etymonline.com/index.php?term=fidelity http://dictionary.reference.com/browse/fidelity

Latin fidelitatem (nom. Fidelitas), en inglés: "faithfulness, adherence,", adherenciaDe fidelis "fiel," de fides "fe"

Apego a hechos o detalles, correspondencia exacta con los hechos.

En síntesis, un prototipo de baja fidelidad es:

Una primera impresión en la que tenemos poca fé, que no se apega exactamente a los hechos.

El prototipado de baja fidelidad es:

Una técnica de diseño y prueba que permite crear y probar ideas o formas tempranamente, facilitando su modificación, evolución y discusión con otros.

Cuándo hacer prototipado de baja fidelidad:

Sí, cuando...:

• aún no existe forma definida, no está clara o hay varias posibles.• queremos probar un concepto quitando (tanto como se puede) otras posibles interferencias.• la resistencia al cambio es un problema.• tenemos poco tiempo y/o la implementación es complicada.

No, cuando...:

• hay una interacción muy rica y la falta de fidelidad impacta sobre la función.• se desea evaluar un sistema que ya existe y funciona, y/o compararlo con otro.• implementar es muy fácil/poco costoso.

Taller de Prototipado Iterativo Página 4 de 9

Valor de negocio• Baja inversión de recursos (tiempo, energía, ganas, etc.) que facilitan el cambio.• Realimentación rápida para el proceso de diseño.• Evaluaciones tempranas, previas a grandes inversiones.• Ahorro de tiempo (que vale oro).• Minimiza fricciones en el equipo de desarrollo.

Guías generales para prototipar en baja fidelidad• Geometría: laxa (a mano alzada, muestra claramente que no es definitiva)

•Color: sólo grises, y azul para links. Usar colores sólo cuando haya una razón.

Taller de Prototipado Iterativo Página 5 de 9

•Tipografía y texto: tipografía neutra (sólo 3 tamaños) y texto simulado (puede ser lorem ipsum).

En dispositivos táctiles y en prototipos de papel la interacción

es “digital”:

Taller de Prototipado Iterativo Página 6 de 9

Prototipado iterativo

El prototipado iterativo es una técnica utilizada para probar con usuarios un diseño tempranamente y pulir el concepto de interacción (y/o sus interfaces de usuario).

Es similar a un test de usabilidad en cuanto a que se arma un guión del test con tareas y se lleva a cabo con usuarios reales, pero es diferente ya que no se pretende medir el desempeño, sino pulir un diseño.

Esta técnica consiste en una serie de sesiones iterativas de tests con 1 usuario cada una donde cada vez que se encuentra un problema -si los expertos creen que no es un error puntual- se modifica el prototipo entre usuarios, y el próximo ya lo prueba con la modificación hecha.

Para poder tener esa flexibilidad, es necesario trabajar con algún prototipo de baja fidelidad y programar un tiempo entre usuario y usuario, normalmente puede ser de 20~25 minutos.

Es una técnica que requiere esfuerzo y coordinación en el equipo, pero brinda resultados muy interesantes. Dependiendo de la complejidad del problema, se pueden hacer entre 3 y 5 usuarios por día; en pocos días, se pueden hacer 12 a 15 iteraciones. Si partimos de un concepto bien plantado, deberíamos tener un prototipo anotado, documentado y libre de problemas de usabilidad importantes en 1 semana.

Las limitaciones con esta técnica están relacionadas con la factibilidad de interactuar y modificar el prototipo. Si es una aplicación con mucha interactividad (como un sistema de visualización complejo, por ejemplo), es muy difícil hacer un test realista (que interactúe) con prototipos de baja fidelidad. En ése caso, la flexibilidad del marco (framework) usado para los prototipos pone el límite a la innovación entre usuario y usuario. Si el esfuerzo/tiempo es mucho (pasa de 1 hora para modificaciones relativamente simples), se pierde la dinámica de la iteración y es preferible un test de usabilidad.

Taller de Prototipado Iterativo Página 7 de 9

Pruebas con usuarios

¿Por qué hacer pruebas?

Así como para saber si el código está bien escrito tenemos que ejecutar un compilador, para saber si una interfaz está bien, tenemos que pedirle al usuario que ejecute una serie de tareas. Tanto si no puede completar la tarea como si no entiende alguna cosa, consideraremos que la interfaz tiene un error a mejorar.

¿Cómo se hace una prueba?

1. Se convocan usuarios. Estos deben ser lo más cercano posible a un usuario real del sitio.

2. Se les da una serie de tareas, se les pide que piensen en voz alta.

3. Se toma nota del comportamiento del usuario y de los problemas que encuentra.

4. Se analizan las notas buscando oportunidades de mejora.

¿Cómo se prepara el guión?

Primero debemos tener el claro qué características de la interfaz estamos probando. En una prueba inicial, debemos probar si el usuario puede completar o no la tarea principal. La tarea principal de la interfaz depende de la funcionalidad de la misma, puede ser hacer una compra, encontrar un item, agregar un contacto. Además prestar atención a si los rótulos que tienen los botones y enlaces son comprensibles.

Una vez que tengamos esto en claro, podemos definir las tareas que vamos a pedir al usuario. Es importante ser cuidadoso en la redacción de la consigna, ya si esta contiene palabras presentes en la interfaz, estaríamos facilitándole el trabajo, por ejemplo si el boton dice “buscar”, no pedirle al usuario que “busque” algo, sino que “encuentre” o cualquier otra forma indirecta.

Contenido del guión para el facilitador:

1. Saludar al usuario

2. Dejar en claro que estamos probando la interfaz, que esto no estamos tomándole un exámen al usuario.

3. Cuestiones legales y de privacidad.

4. Pedirle que piense en voz alta mientras realiza las tareas (protocolo think-aloud)

5. Explicar la tarea a realizar y pedirle que nos avise cuando haya terminado.

Análisis del test• Compilación de datos registrados.• Comprobación de cumplimiento de metas cuantitativas.• Detección de patrones de conducta, ilustrados con frases y episodios.• Creación de informe con conclusiones y recomendaciones de diseño.• Presentación del informe a los interesados.

Taller de Prototipado Iterativo Página 8 de 9

Fuentes:• Simplementewiki.org , wiki creada por Eduardo Mercovich con licencia Licencia Creative

Commons Atribución-Compartir Obras Derivadas Igual 2. 5

• "Diseño centrado en el usuario Agile”, de Diseño de Experiencia Usuaria, blog de Percy Negrete http://blog.pucp.edu.pe/ux con licencia Creative Commons Attribution-NonCommercial - NoDerivs 2.0 Generic (CC BY-NC-ND 2.0)

• “Effectively Planning UX Desing Projects”, de SmashingMagazine.com

Bibliografía sugerida:• About Face 3, Alan Cooper

• Handbook of Usability Testing: How to Plan, Design, and Conduct Effective Tests

• Libro de UX de SmashingMagazine.com: http://media.smashingmagazine.com/wp-content/uploads/2012/09/06_9780470666852-ch02.pdf

• Lean UX: Applying Lean Principles to Improve User Experience, de Jeff Gothelf• UX Design For StartUps de UXPin.com: http://uxpin.com/ux-design-for-startups.html

Sobre este texto:Este texto fué compilado y adaptado por Martín Szyszlican para el Taller de Prototipado Iterativo organizado por IxDA Córdoba el 8 de febrero de 2013, y se ofrece bajo una Licencia Creative Commons Atribución-Compartir Obras Derivadas Igual 2. 5

Taller de Prototipado Iterativo Página 9 de 9