Workshop de Diseo iterativo de Interfaces de Usuario: mtodos y tcnicas

prcticas
Diseo iterativo y prototipado rpido en papel.

Por Eduardo Mercovich (edumerco@gaiasur.com.ar)

La ltima versin de este documento se puede encontrar en:
http://planeta.gaiasur.com.ar/infoteca/diseno-iterativo-y-prototipado-
rapido.html.
1. Introduccin a este Workshop
1.1. Acerca de este documento

Este documento contiene las notas del Workshop sobre Diseo de Interfaces de
Usuario: mtodos y tcnicas prcticas, por Eduardo Mercovich, dado en SIGGRAPH
99 en Buenos Aires, Argentina.

Este workshop es el segundo mdulo de tres, que forman juntos una introduccin
y prctica al tema de Interfaces, Diseo y Usabilidad.

Estas notas no pretenden ser una referencia profunda ni una bibliografa extensa,
sino evitar la toma de apuntes durante la ponencia, para que los asistentes puedan
brindar su atencin a los contenidos y a su discusin.
1.2. Acerca de este Workshop

Para ver los objetivos, audiencia y resumen del contenido de este workshop, vea
por favor la presentacin de los 3 mdulos donde est esta informacin
presentada en contexto.
1.3. Tabla de contenidos

1. Introduccin a este Workshop
1. Acerca de este documento
2. Acerca de este WorkShop
3. Tabla de contenidos
2. Contenidos del Workshop
1. Revisin de conceptos de la ponencia
2. Prctica
3. Sntesis
3. Apndice: Cuestionario post-workshop

2. Contenidos del Workshop
2.3. Revisin de conceptos de la ponencia

Haremos un repaso rpido de los 3 conceptos bsicos (analizados en la Ponencia
"Diseo de Interfaces y Usabilidad: cmo hacer productos ms tiles, eficientes y
seductores") que aplicaremos a lo largo de este workshop:
Interfaz Llamamos interfaz a aquello que est entre nosotros y el sistema o
herramienta. La interfaz es lo que nos permite conocer su estado, interactuar o
accionar sobre el sistema y ver los resultados de nuestras acciones.
Usabilidad Definimos Usabilidad de un sistema o herramienta como una medida
de su utilidad, facilidad de uso, facilidad de aprendizaje y apreciacin para una
tarea, un usuario y un entorno dado.
Diseo iterativo Llamamos diseo iterativo al ciclo de Diseo, Implementacin,
Medicin y Anlisis.
El output de cada etapa es el input de la que sigue, incluso el de la ltima. Los
resultados de la etapa de anlisis se toman para redisear la interfaz,
implementarla nuevamente, medir, y as sucesivamente.
2.2. Prctica
Usuario, tarea y entorno

Pertenecemos al nuevo consorcio de trenes de Buenos Aires. La empresa ha
detectado que en horas pico, en ciertas estaciones, no es suficiente con la atencin
personalizada (de humanos) en las ventanillas para la venta de boletos. Por lo
tanto, se instalarn mquinas para el autoservicio de compra de boletos.

Nosotros somos los encargados de disear la interfaz de esta mquina.

El usuario es cualquier persona que usa el tren y asumimos que sabe leer. La tarea
es obtener un boleto del valor correspondiente para la estacin a la que el usuario
viaja. Veremos ms adelante los diferentes escenarios.

Para armar la mquina tenemos una pantalla grande, de aproximadamente 60 cm
de ancho x 90 de alto y sensible al tacto, una impresora de boletos, una entrada
para billetes y monedas, una salida para el vuelto y un lector de tarjetas.

El valor del boleto depende de la estacin de destino, los transbordos, la cantidad
de boletos y si esos boletos son ida o ida y vuelta.

Adems, ciertos usuarios (escolares y jubilados), tienen un descuento especial. La
empresa les da una tarjeta magntica que valida este hecho y que mediante un ID
unvoco no permite ser utilizada dos veces en la misma transaccin.

El usuario debe saber cunto debe pagar y al final, obtener su/s boleto/s
impreso/s.

El futuro es suyo seores, y seoras. :-)
Escenarios

1. Un escolar desea sacar un boleto para ir a su escuela. Sabe cul es su estacin.
2. Un joven adolescente desea sacar boletos para l y su chica, ida hasta una
estacin y vuelta desde otra.
3. Una madre (o padre) con 3 hijos, uno en edad escolar, desea sacar boletos para
viajar a lo de la abuela, dejar a los pequeos y seguir desde all a dejar a su hijo en
la escuela.

Los mitos

Todos tenemos ideas preconcebidas acerca de cmo los usuarios van a usar (o no
podrn hacerlo) un sitio o sistema. Muchas veces estas ideas no estn basadas en
observaciones objetivas sino en sensaciones, comentarios, etc.

Estos preconceptos son llamados mitos. Afectan, y son a su vez afectados, por la
percepcin de los hechos de un test.

Antes de comenzar el test, cada uno escriba en una hoja (sin comentar con los
dems) sus mitos. Al final, los compararemos con las observaciones.
Materiales y equipo

Para generar la mquina tienen papel, tijera, marcadores y cinta adhesiva. Con
estos materiales harn el prototipo de la interfaz.

Uno de los integrantes del equipo har de computadora, moviendo el prototipo
de acuerdo a las acciones del usuario.

Dentro de cada grupo, debe haber representantes de:

* Sistemas: quien tratar de simplificar la implementacin
* Marketing: quien tratar de que la gente compre la mayor cantidad posible de
boletos, an con descuentos.
* Atencin al pasajero: quien tratar de hacerlo fcil y a prueba de tontos.
* Responsable de Estacin: quien tratar de asegurar su emplazamiento dentro
de cada estacin y su seguridad.

Mtodo de trabajo: diseo iterativo

Basndonos en estos datos, haremos el diseo de la interfaz, los prototipos en
papel, una prueba con un usuario que pasar por los tres escenarios propuestos, y
analizaremos los resultados y los posibles problemas.

Basndonos en estos hallazgos, redisearemos la interfaz, haremos los nuevos
prototipos en papel o modificaremos los que tenemos y volveremos a probarlos
tantas veces como nos permita el tiempo.

Ganar el equipo que tenga el mayor nmero de tareas cumplidas. Para esto,
deber hacer los ciclos rpidamente pero tratando de mejorar en cada ciclo todo lo
posible.

Durante los tests, el grupo y su mquina tienen terminantemente prohibido hablar.
Recuerden que la mquina no posee un sintetizador de voz y cualquier ayuda
puede ocultar errores.
Consejos

* No hagan grandes dibujos. Armen la interfaz por partes. Corten las pantallas en
sus componentes, hganlos modulares.
* Preparen con anticipacin todo lo necesario (boletos, dinero, resultados, etc.).
* No se olviden de lo que est fuera de la pantalla: tambin es parte de la interfaz
(ranura para el dinero, cambio, boleto, etc.).
* Uds. ponen el lmite de lo que la mquina puede hacer: en la vida real siempre
hay que hacer concesiones.

Al terminar

Relean sus mitos y comprenlos con lo que vieron. Qu tanto se acercaban a la
realidad? Hubo alguna sorpresa importante?

Piensen en las discusiones previas: cuntas estaban basadas en mitos y se
resolvieron simplemente mirando el test?

Analicen los cambios que tuvieron que hacer y los puntos en que los usuarios
tuvieron problemas. Hay algn patrn comn? Cul fue la mayor dificultad?
2.3. Sntesis

Los prototipos de baja fidelidad en papel tienen pros y contras:
Pros

* alta velocidad de generacin y pruebas,
* baratos,
* poca inversin de recurso y esfuerzo,
* no distraen con detalles.

Contras

* no tienen el look exacto de la aplicacin,
* pueden ser difciles de simular,
* la velocidad de respuesta no es la real.

Como hemos visto, el diseo iterativo puede dar grandes beneficios si se lo aplica
correctamente y en forma temprana dentro del ciclo de vida del producto,
reduciendo tiempos de desarrollo y asegurando su usabilidad, que es un
componente muy importante en su calidad total.

Con un equipo bien entrenado, pueden hacerse ciclos muy rpidos, que mejoren la
interfaz en cada vuelta y logren avances importantes en poco tiempo y con poca
inversin.

Por otro lado, el prototipado en papel tiene pros y contras. Es importante tener
esto en mente y no caer en decisiones fciles basadas en una sola tcnica.

Les agradezco el tiempo invertido en este workshop y les ruego que llenen la
encuesta para ayudarnos a mejorarlo en su prxima versin.

Muchas gracias. :-)