Medición y diagnóstico de emociones con eye tracking

En un artículo sobre medición y diagnóstico de emociones escribí sobre los antecedentes del análisis de expresiones para evaluar la experiencia de un usuario cuando utiliza un sistema.

Unos días después de publicarlo, recibí una pregunta:

¿por qué no se abordó el tema de análisis de emociones con un caso real en vez de sólo teorizar al respecto?

En mi experiencia profesional, la teoría va de la mano de la práctica y las dos son necesarias; en el artículo anterior quise abordar los antecedentes sobre cómo se hace el estudio de emociones en el ser humano desde hace siglos, y ahora quiero continuar con algo más práctico: un caso de estudio real.

Para este caso quiero compartir el análisis en el que trabajé hace algunos años: el del portal  Liverpool.com.mx. En este proyecto buscábamos identificar y resolver problemas de arquitectura de información y usabilidad para crear una experiencia de compra eficaz y eficiente a sus usuarios.

Uno de los objetivos finales de este proyecto era poder argumentar de manera objetiva un rediseño completo del sitio utilizando una evaluación de usabilidad y UX. En el rediseño, el equipo de análisis buscaba definir una mejor experiencia de persuasión de compra al usuario.

En el análisis de usabilidad y UX de la tienda online utilizamos varias herramientas, desde la observación directa a usuarios, casos uso, estudios contextuales en el proceso de compra de un producto específico hasta una herramienta de eye tracking.

El eye tracking  o “seguimiento de ojos” es una tecnología que consiste en seguir los movimientos oculares de un usuario para inferir en qué área del página está mirando y qué es lo que ve. Un dispositivo de eye tracking es un monitor especial que emite rayos infrarrojos a los ojos del usuario y hace el registro de la posición de los ojos frente a lo que está mirando u observando y del tiempo en la que se realiza. Los rayos rebotan en la pupila del usuario y devuelven la información al aparato que la decodifica para calcular la parte de la pantalla que el usuario está mirando.

El eye tracking se utiliza principalmente como una herramienta de análisis para hacer mapas de las zonas ciegas en una interfaz. Algunas personas piensan erróneamente que el eye tracking puede utilizarse para leer emociones por medio  micro expresiones faciales, cuando en realidad lo que puede hacer es medir la satisfacción de un usuario sobre un sistema, que después puede traducirse como emociones de agrado o desagrado.

Estas son algunas de las pantallas del análisis de eye tracking:

Home del sitio Liverpool: inicio de búsqueda para hacer estudio de caso de experiencia de compra.
Home del sitio Liverpool: inicio de búsqueda para hacer estudio de caso de experiencia de compra.
Home del sitio Liverpool: inicio de búsqueda para hacer estudio de caso de experiencia de compra en recuadros rojos para enmarcar la arquitectura de información.
Home del sitio Liverpool: inicio de búsqueda para hacer estudio de caso de experiencia de compra.
Estudio de caso de experiencia de compra: cómo se despliegan los productos respecto a una búsqueda. Los recuadros rojos son para enmarcar la arquitectura de información.
Estudio de caso de experiencia de compra: cómo se despliegan los productos respecto a una búsqueda.
Estudio de caso de experiencia de compra: cómo se despliega la información  en la página. Se muestra un producto respecto a la búsqueda semántica a y los resultados arrojados.
Estudio de caso de experiencia de compra: cómo se despliega la información en la página. Se muestra un producto respecto a la búsqueda semántica a y los resultados arrojados.
Se muestra el producto en recuadros rojos para cuadricular el despliegue de la información y en la visualización de la arquitectura de información cómo afecta la experiencia de compra.
Se muestra el producto en recuadros rojos para cuadricular el despliegue de la información y cómo afecta la experiencia de compra.

Los recuadros rojos en las imágenes representan los bloques de arquitectura de información de las pantallas, aunque no entro en detalle en ese tema en este artículo. Los resultados que aquí comparto son parte de una sección del informe que se entregó al cliente con las observaciones y análisis, que eventualmente se implementaron como correcciones en el portal.

Entre los principales descubrimientos encontramos los siguientes problemas de la interfaz, las consecuencias para la UX y la emoción que generaba en el usuario:

  • No había indicadores de sección en la que está navegando el usuario, lo que le creaba confusión (frustración).
  • Existían demasiados elementos y secciones, lo que saturaba la discriminación de información del usuario (frustración).
  • No había jerarquías de muestreo y se saturaba la discriminación de información del usuario (frustración).
  • No había opciones de accesibilidad en búsqueda. Se saturaba la discriminación de información del usuario (frustración).
  • No había invitación escrita para usarla. Se saturaba la discriminación de información del usuario (frustración).
  • El layout era estático y se saturaba la discriminación de información del usuario (frustración).
  • El diseño era poco estructurado y se saturaba la discriminación de información del usuario (frustración).
  • No había indicadores de sección en la que estaba navegando el usuario y se saturaba su discriminación de información (frustración).
  • En el segundo clic aparecía un menú diferente en grandes dimensiones organizado por categorías (duda).
  • No había uniformidad ni constancia que refirieran a una identidad gráfica además del encabezado y se saturaba la discriminación de información (duda el usuario).
  • En el tercer clic aparecía un nuevo menú de categorías en barra lateral que saturaba la discriminación de información del usuario (frustración).
  • No había congruencia visual ni con la pantalla anterior ni con la de inicio. Se saturaba la discriminación de información (duda).
  • Al seleccionar la opción “mayores de 7 años” se mostraban juguetes para menores de un año (error de semántica).
  • Daba opciones para mostrar secciones dentro de las categorías pero no permitía filtrar la información mostrada, produciendo ruido visual (duda).

Después de varios años de este estudio muchas de las recomendaciones que hicimos siguen vigentes. El portal aún tiene problemas en cuanto a los sistemas de actualización de información, los de inventario, de envío, de formas de pago, y varios más en los que hay otros factores involucrados y que son tema para comentar después en otros artículos.

* * *

Los diagramas y mapas de atención ocular obtenidos mediante eyetracking aportan a la comunicación en el análisis de usabilidad: siempre es más importante escuchar y observar al usuario. De esta manera, las personas que realicen la interpretación de los resultados  podrán enfocarse en el mensaje a comunicar para un público objetivo sin conocimientos técnicos.

Hay varios beneficios al ligar la emoción y el sentimiento usando las fuentes que proporcionan los datos de los usuarios: pueden proporcionar comprensión y contexto de la actitud del usuario frente a una interacción, que servirán para definir la mejor acción al ofertar mejoras al usuario. Lo más importante, es que  proporcionan información para crear una mejor experiencia de usuario/cliente más satisfactoria desde la primera interacción que tenga con una interfaz.

Las herramientas de eye tracking y análisis de experiencia de usuario que existen en el mercado ya incluyen mejoras sobre la precisión para cuantificar los resultados de los análisis. Las herramientas para el análisis de emociones y expresiones faciales siguen siendo costosas y de cierta forma restrictivas; las personas que las utilicen deben estar capacitados para hacer interpretación de los resultados, entre otras cuestiones técnicas.

Referencias

Diseñadora gráfica y psicóloga especializada en diseño editorial e hipermedios, ha sido investigadora y consultora en usabilidad, user experience y diseño emocional desde 2007.

La fábula del diseñador centrado en el usuario

“Érase una vez un joven brillante que estaba buscando a un diseñador efectivo. No buscaba un diseñador cualquiera, quería encontrar uno que diseñara tecnologías complejas que fueran simples de usar. Quería trabajar y aprender con él para convertirse en uno de ellos”.

La “fábula del diseñador centrado en el usuario” es el viaje de un joven que descubre los tres secretos del Diseño Centrado en el Usuario (UCD). David Travis un reconocido investigador y consultor de usabilidad escribió esta sencilla pero profunda historia inspirado en el popular libro The One Minute Manager en el que se abordan los consejos que recibe un joven para convertirse en un buen gerente. Travis utiliza la misma alegoría pero llevada al terreno de User Experience.

Después de conocer la naturaleza de User Experience como disciplina y de entender la filosofía de Diseño Centrado en el Usuario, el siguiente paso es descubrir cómo llegar a ser un diseñador centrado en el usuario. La lectura de este libro y la comprensión de los conceptos que enuncia es un buen principio para convertirse en un diseñador centrado en el usuario.

* * *

El viaje del joven de la historia inicia cuando se pregunta ¿cómo se diseña tecnología?, porque lo que veía a su alrededor no siempre le parecía adecuado. Así comenzó preguntándole a todos los diseñadores que encontraba en su camino: “¿qué tipo de diseñador diría que es usted?”.

Las respuestas que escuchó lo dejaron intrigado, ya que parecía que la mayoría de los diseñadores, sólo hacía una parte del trabajo, a veces preocupados por la estética de la interfaz, otras por los intereses del cliente y a veces sólo por la innovación tecnológica. “Es como si sólo fueran parte de un diseñador”, reflexionó el joven.

Cuando la desesperanza comenzó a hacer mella en nuestro intrépido y aguzado amigo, escuchó rumores sobre un diseñador muy especial que vivía en un pueblo cercano. Después de algunos esfuerzos ambos llegan a estar frente a frente, y lo que nuestro joven diseñador hizo fue hacerle la misma pregunta:

– “¿Qué tipo de diseñador diría que es usted?”
– “Soy un diseñador centrado en el usuario”, respondió el otro.

El joven estaba intrigado, así que preguntó: “¿entonces qué haces?” El diseñador centrado en el usuario le respondió que para averiguar la respuesta tendría que preguntárselo a sus clientes, así que le proporcionó los datos de tres de ellos y lo mandó a conocerlos. Sólo le impuso una condición: después de tener la respuesta en sus manos, debería compartirla con otros. El joven dio su palabra que así lo haría.

Primer secreto del diseño centrado en el usuario

El joven conoció al primer cliente del diseñador centrado en el usuario, quien le contó acerca de lo desconcertante que resultó trabajar con él cuando inició el proyecto porque no se interesó de manera inmediata en el diseño visual o en la innovación tecnológica.

Él hablaba de nuestros clientes”, dijo. El joven se sorprendió y preguntó inmediatamente: “¿Y eso cómo ayudó?” El cliente respondió que eso les permitió descubrir que ellos realmente no conocían cómo las personas usaban su producto.

– “¿Y qué hizo el diseñador centrado en el usuario para ayudar?” — preguntó el diseñador con curiosidad.
– “Su primer paso fue identificar a los usuarios de nuestro sistema y saber qué querían hacer con él” — replicó el cliente.

Primer secreto del diseño centrado en el usuario: Hay que enfocarse desde el principio y continuamente en el usuario y sus tareas

Es así como Travis revela el primer secreto del diseño centrado en el usuario: conoce a tus usuarios, sus tareas y el entorno de uso. Este descubrimiento debe originarse de la investigación y no de la suposición: suponer es bueno, pero averiguar es mejor.

Otro concepto clave es identificar “rutas rojas”: aquellas tareas críticas que el usuario realizará y que deben diseñarse de la forma más eficaz y eficiente posible. Al enfocarse en las rutas rojas se evita que otras funcionalidades menos importantes desordenen la interfaz.

Después de que el joven diseñador conoció el primer secreto de UCD, se despidió del cliente y partió. Al reflexionar sobre lo que había aprendido pensó “realmente tiene sentido. Después de todo, ¿cómo puedes ser un diseñador efectivo si no sabes para quién estás diseñando o lo que la gente hace con el producto que estás creando?”.

Segundo secreto del diseño centrado en el usuario

El viaje del joven diseñador lo llevó con el segundo cliente. Al terminar las respectivas presentaciones le preguntó sobre el siguiente paso después de enfocarse en el usuario y sus tareas

– “Se necesita garantizar que el diseño funcione tal y como los usuarios esperan”, respondió el cliente.

El diseñador centrado en el usuario había ayudado al segundo cliente a realizar pruebas de usabilidad a un producto, pidió a un grupo de usuarios realizar ciertas tareas específicas y a expresar en voz alta sus pensamientos y emociones al interactuar con el producto. Esto le permitió obtener las tres métricas básicas de la usabilidad:

  • Efectividad, medir cuántos usuarios logran completar con éxito una ruta crítica.
  • Eficiencia, medir cuánto tiempo tardan los usuarios en realizar la tarea.
  • Satisfacción: medir cómo se sienten los usuarios respecto al diseño del producto.

Segundo secreto del diseño centrado en el usuario: hay que medir de forma empírica el comportamiento del usuario

El joven nuevamente quedó fascinado por el descubrimiento: “¡cierto!, ¿cómo se puede ser un diseñador efectivo si no se sabe cómo usa el usuario su diseño?” reflexionó. Sin embargo, una duda lo intrigaba:  “después de realizar sus pruebas,  ¿siempre se encuentran problemas con el producto?

– “Siempre” — respondió el cliente.
– “¿Y luego de arreglar los problemas ustedes siempre tienen que volver a probar el sistema?”, preguntó el joven.
– “Exacto” — dijo el cliente.
– “Pero eso debe tomar mucho tiempo…” — dijo el joven.
– “Creo que ya es hora de que averigües acerca del tercer secreto del diseñador centrado en el usuario”, concluyó el cliente.

Tercer secreto del diseño centrado en el usuario

Finalmente, el joven diseñador llega con el tercer cliente a quien le dice: “he estado oyendo sobre las pruebas de usabilidad. Parece que tienen mucho sentido, pero me preocupa que consuman demasiado tiempo”.

El cliente le explica que el Diseño Centrado en el Usuario define una técnica que permite probar nuevos diseños muy rápido, llamada prototipos en papel. A través de los prototipos en papel es posible validar conceptos de alto nivel, como la arquitectura de información; posteriormente, los prototipos digitales permitirán refinar otros aspectos, como el diseño visual.

Para lograr un buen diseño hay que generar muchas ideas tan rápido como sea posible para validarlas con usuarios: “no puedes tener correcto el diseño hasta que tienes el diseño correcto”, le dijo el tercer cliente al joven diseñador.

Tercer secreto del diseño centrado en el usuario: el diseño debe ser iterativo

El diseñador se sorprendió al conocer el tercer secreto: todo parecía tan claro y obvio, ¿cómo se puede ser un diseñador efectivo si solamente se diseña una vez sin validar, corregir y volver a validar?

Despues de reflexionar un poco, el joven se cuestionó: “¿por qué hay tan pocas compañías que diseñan de esta forma?”.

El tercer cliente sonrió y dijo: “vamos a dejar que le hagas esa pregunta al diseñador centrado en el usuario”, y se despidió.

* * *

La fábula termina con el reencuentro entre el joven y el diseñador centrado en el usuario. Al cuestionarlo sobre por qué muchas empresas no llevan a cabo los tres secretos, el diseñador centrado en el usuario responde: “la mayoría de las compañías creen que están centradas en el usuario, pero cuando les preguntas a sus clientes muy pocos están de acuerdo”.

Muy pocas empresas dedican el esfuerzo necesario en conocer a sus usuarios, tareas y entorno de uso de manera continua. Algunas compañías realizan investigación de sus productos, pero usualmente a través de actividades como focus groups, y eso no es suficiente.

Con productos interactivos lo que importa no es lo que los usuarios dicen, lo importante es lo que hacen. Las actividades como los focus groups no ayudan a encontrar los problemas del producto, por eso es que se deben realizar pruebas de usabilidad con métricas sólidas y bien definidas.

Prácticamente ninguna compañía realiza un proceso de diseño iterativo: se tiene la idea errónea que si cada iteración implica diseñar, validar con usuarios e implementar mejoras nunca se van a lograr cumplir tiempos de entrega, se reventará al presupuesto o que se verán limitados con sus recursos humanos disponibles.

Todo es un asunto de administración del riesgo: se involucran usuarios siempre que haya que tomar decisiones importantes sobre el diseño. Hay otras técnicas que se pueden usar de forma paralela a las pruebas de usabilidad, como la revisión por un experto, aunque éstas nunca reemplazarán por completo una prueba de usabilidad.

Después de asimilar todos estos principios y de ponerlos en práctica durante un cierto tiempo, ocurrió lo esperado, el joven se convirtió en un diseñador centrado en el usuario.

El joven diseñador nunca olvidó la promesa que hizo y a partir de ese momento compartió con todos sus colaboradores y clientes las lecciones que aprendió del diseñador centrado en el usuario.

Espero que todos podamos honrar la misma promesa.

Diseñador de Experiencia de Usuario. Scrum Master Certified. Fotógrafo. Ha participado en proyectos vinculados a HCI, usabilidad y UX en el ámbito académico, empresarial y gobierno desde 2007. Es parte del equipo de UX Nights.

UX no es copiar y pegar

Hay una línea muy delgada entre la inspiración y el plagio. Aunque en UX se promueve el uso de “lo que ya funciona”, el Diseño Centrado en el Usuario debe explorar cómo crear interfaces visuales innovadoras en lugar de utilizar la misma idea una y otra vez.

He leído recientemente a varios UXers discutiendo sobre diseño gráfico: cómo éste comienza a estancarse y cómo todos los sitios se ven iguales sin distinción aunque traten sobre autos o comida, y tienen un punto bastante válido: cada vez más las páginas web actuales utilizan la ya estandarizada estructura de a) un menú superior; b) hero banner con carrusel; c) 3 mini banners debajo; d) un botón de acción y demás, como el que se exhibe en everyfuckingwebsite.com

El trabajo de los profesionales de UX es desarrollar el criterio para comprender que solo porque algo sea una “buena práctica” y funcione en un sitio tiene que ser implementado exactamente igual en todos los demás. “Hacer UX” no es seguir ciegamente una guía o una lista con instrucciones, ni lo es poner un hero banner con un gráfico animado que cubra toda la pantalla o implementar un hamburger menu en un sitio para móviles y atiborrar ahí 15 elementos de un menú de navegación solo porque Facebook lo hace.

Un principio moderno que rige la arquitectura contemporánea y también la arquitectura de información y el desarrollo de interfaces digitales es que la función determina la forma (“form follows function”). La función se determina utilizando nuestras entrevistas, datos, estadísticas y análisis para definir con exactitud cuál es el contenido de valor para el usuario; el siguiente paso es definir cómo se va a estructurar ese contenido para presentarlo al usuario.

Jakob Nielsen definió en 1995 los 10 elementos de la heurística para diseño de interfaces. Esos principios son universales y agnósticos de sistema operativo, plataforma, tecnología y contexto de los sistemas que se analizan. La palabra ‘heurística’ hace referencia a una forma de análisis que no pretende ser óptima o perfecta, pero sí suficiente para cumplir objetivos inmediatos de usabilidad y UX. Tampoco son mandamientos, sino sugerencias fundamentadas. Nielsen definió estos elementos antes de que el iPhone, las tablets modernas, las interfaces completamente táctiles o HTML5 fueran creados y aún mantienen su validez.

Sugerencias como:

  • el usuario siempre necesita estar informado del estado del sistema;
  • el sistema debe hablar el lenguaje del usuario, siguiendo sus convenciones;
  • el usuario requiere una ‘salida de emergencia’ en caso de cometer un error;
  • no incluir información irrelevante o innecesaria;

hoy parecen conceptos derivados del sentido común y aún así parecen estar completamente ausentes de la mayoría de las páginas web “modernas” que se  desarrollan actualmente y que solo apelan a la forma, pero no a la función.

UX no es algo que puedes plasmar en BehanceDribble, ni copiar un layout o un esquema visual solo porque se ve bonito o porque al cliente le gustó de otra página. UX no es una lista de buenas prácticas que se repiten sin cuestionarlas independientemente de un contexto bien definido.

UX nace de una necesidad específica para encontrar la mejor manera en la que un usuario puede interactuar con un producto o servicio digital. Somos ‘User Experience Designers’, no ‘User Experience Copycats’. Si estás creando una arquitectura o layout para un cliente nuevo y lo primero que haces es buscar “inspiración visual” entonces no estás pensando como UXer; no importa si eres diseñador gráfico, desarrollador, estadista, analista, estratega, arquitecto o maquetador, siempre la función dicta la forma, siempre.

Ojo: las buenas prácticas y la inspiración visual tienen su momento protagónico en el proceso de desarrollo, pero la función dicta cuál herramienta de nuestro extenso arsenal vamos a utilizar, no al revés.

Ahora si, vayan y creen interfaces que el mundo nunca ha visto;  salgamos del ciclo de copiar + pegar interfaces genéricas que solo piensan en el diseño y no en la experiencia.

Trabaja como Planner en SCLBITS. Es curador de UX Mexico y parte del equipo de UX Nights.

El cavernícola que no podía tener un iPad

Imaginemos un mundo en el cual nunca hubiéramos tenido contacto con una iPad; de repente al caminar por la calle nos topamos con este “objeto mágico” y una nota que nos dice: “puedes leer libros en ella”.

Antes de prender la tableta lo más seguro es que podríamos imaginar cómo se verían las páginas del libro. También intuiríamos cómo pasar las hojas, cómo poner un marcador o hasta cómo subrayar texto.

Este resultado no sería por casualidad o gracias a un poder mágico, sino que sería la consecuencia de los modelos mentales que tenemos construidos bajo la experiencia de leer un libro impreso.

¿Pero qué diablos es un modelo mental y por qué debería de importarme?

El concepto no es nuevo: el primero de hablar de ello fue  K.J.W. Craik en 1943 en su libro The Nature of Explanation, pero con su muerte este concepto queda latente y no es hasta la década de 1980 cuando reaparece en escena.

En el libro Diseño Inteligente: 100 cosas sobre la gente que cada diseñador necesita saber, la psicóloga Susan Weinschenk define los modelos mentales como: “Las representaciones que construimos mentalmente de los objetos con los que interactuamos”, a diferencia de los modelos conceptuales, que son “los modelos reales que percibimos a través del diseño y la interfaz de los productos

Los modelos mentales que tienen las personas sobre una tarea en particular influyen en el uso que esos usuarios les vayan a dar a nuestras interfaces, y sobre todo a las experiencias que vayan a tener con ellas.

Imaginemos ahora la misma escena del iPad tirado con la nota y que quien lo encuentra es un cavernícola. A diferencia del caso anterior, lo más probable es que no sepa cómo usar el “objeto mágico” y acabe ignorándolo o destruyéndolo.

Esa reacción no sería culpa del cavernícola; para que pudiera usar la tableta necesitaría por lo menos dos modelos mentales previos: el del libro (objeto) y el de la lectura (acción); también, claro, el de la electricidad, pero dejemos esta de lado por un momento.

Con el fin de generar experiencias que no resulten frustrantes para los usuarios es necesario que el modelo conceptual de nuestros productos coincida con los modelos mentales de esos usuarios. No podemos mostrarles algo que huele a pollo, tiene cresta, alas y plumas y acabar diciéndoles que es un hipopótamo. ¿Será que estos modelos mentales limitan nuestra creatividad?

En realidad no: es posible desarrollar modelos conceptuales capaces de generar nuevos modelos mentales o modificar los ya existentes y para ello hay varios factores clave a considerar: la repetición, la formulación de mensajes claros y la formación del usuario, además del hecho de que los modelos mentales se interiorizan y acumulan. ¡No son mágicos!

Uno de mis recursos favoritos para la generación de nuevos modelos conceptuales es el uso de las figuras retóricas, en especial las metáforas

¿Cuáles otros recursos conocen?

Head of Art en Terán TBWA. Creadora de la Geekoteca y de inmensidad de #pensamientosrandom. Es parte del equipo de UX Nights.