Saltar navegación

Usted está en: Inicio > Blog de Usolab

Blog de Usolab

Actualidad en usabilidad, diseño y experiencia de usuario

Swimlanes de experiencia de usuario

Escrito por Sergio Sánchez Mancha el 20 Nov 2008

En CanUX 2008, el workshop anual de experiencia de usuario en Canadá, la gente de nForm ha presentado un nuevo concepto de entregable que nos ha llamado la atención: se trata de los diagramas de Swimlanes (o "carriles de natación").

Ejemplo de swimlane de experiencia de usuario

Según sus autores, los Swimlanes son una gran herramienta para ayudar a los clientes a entender de un solo vistazo, los usuarios, las necesidades del negocio y la tecnología. También aportan a superar las diferencias entre las diferentes partes implicadas en los proyectos, mostrando en un solo documento, todos los actores que participan en la experiencia del usuario.

Las ventajas de este entregable son:

  1. Síntesis. Se visualiza en una vista de pájaro y de forma paralela la experiencia del usuario, el modelo de negocio, y los sistemas tecnológicos implicados en el proceso.
  2. La simplicidad.
  3. Se trata de una clara mejora, en términos de facilidad de uso, con respecto a los tradicionales modelados RUP de procesos de negocio.
  4. Comunicación. Ayuda al equipo hablar sobre el "qué" y "por qué". El carril del comics es especialmente útil para comunicar a los responsables de negocio (ver ejemplos de uso de cómics para comunicar resultados de tests de usuarios).
  5. Facilitan los pasos siguientes.

 

Etiquetas: , , ,

Hay 2 comentarios a esta entrada, participa y escribe uno

Infografía para tiempos de crisis

Escrito por Sergio Sánchez Mancha el 18 Nov 2008

El diseño de la información y la infografía son disciplinas que se centran en el diseño gráfico eficiente, es decir reducir, sintetizar, resumir y clarificar datos complejos en información visual asimilable y comprensible.

En los últimos meses se han hecho muchos esfuerzos para explicar al público en general las razones de la crisis financiera actual, donde la infografía ha tenido un papel protagonista, ya que las razones del “efecto mariposa” de esta crisis no son fáciles de comprender.

Algunos de los ejemplos que más me han llamado la atención son los siguientes:

Y para terminar (y si disponéis de media hora), os recomiendo que veáis “Després de la Bombolla” (en catalán), un reportaje del equipo de 30 minuts de Televisió de Catalunya, donde se utilizan infografías haciendo alegoría a los gráficos del tiempo, para explicar las implicaciones mundiales de la crisis en Estados Unidos.

Por supuesto, si conocéis más ejemplos nos encantaría que los compartierais.

Etiquetas: ,

No hay comentarios, se el primero en escribir uno

Diseño de interacción: prácticas en Usolab

Escrito por Sergio Sánchez Mancha el 12 Nov 2008

En Usolab necesitamos incorporar a una persona en contrato de prácticas a media jornada, que colabore con nosotros para realizar tareas de diseño de interacción y usabilidad en nuestras oficinas de Sant Cugat (Barcelona).

Buscamos estudiantes de último curso de una escuela de diseño, licenciatura, ingeniería (o cursando un master), que deseen orientarse profesionalmente en HCI. Ofrecemos la posibilidad de incorporarse definitivamente en plantilla una vez finalizado el contrato de prácticas.

Requisitos:

  • Gusto por el diseño sencillo, limpio y simple.
  • Nociones de diseño centrado en usuarios y diseño de interacción.
  • Persona proactiva y dinámica, con ganas de aprender.
  • Pasión por la usabilidad y por el diseño.
  • Ser estudiante de último curso de una licenciatura o ingeniería, o cursando un master.

Requisitos deseados:

  • Conocimientos de herramientas de diseño web.
  • Participar de la filosofía del diseño de la sencillez o simplicidad
  • Conocer y tener sensibilidad por la accesibilidad

Si estáis interesados, enviad vuestro currículum vitae a trabajo@usolab.com (a ser posible con ejemplos de trabajos realizados) indicando en el asunto "Prácticas de diseño de interacción en Usolab".

Etiquetas: ,

No hay comentarios, se el primero en escribir uno

El diseño del asistente de instalación también cuenta

Escrito por Dani Armengol Garreta el 11 Nov 2008

La primera impresión que se lleva un usuario al utilizar la versión de prueba de una aplicación es muy importante. De ella puede depender ganar un cliente, por lo que tener bajo control esa experiencia inicial es esencial.

Si dejamos a un lado la localización y descarga de la aplicación, lo primero que se encontrará el usuario será el asistente de instalación. Por lo general su diseño acostumbra a descuidarse mucho, a favor del resto de la aplicación, pero un pequeño problema durante la instalación puede suponer el descarte directo del producto frente a otros de la competencia.

Ayer, después de descargar la versión de prueba de una aplicación, nos encontramos con el asistente de instalación de la siguiente imagen:

Asistente de instalación que incluye una lista con 12 pasos

Es positivo ofrecer una visión de los pasos que se realizarán durante la instalación, pero este asistente tiene varios problemas que podrían llegar a disuadir al usuario de seguir con la tarea:

  • El número de pasos denota un proceso largo y complejo. Algunos usuarios pueden decidir posponer la instalación o incluso abandonarla sólo al ver la lista.
  • Algunos de los pasos son tareas internas del asistente, en los que el usuario no tiene ningún control ni tienen ningún sentido para él: ¿qué significado tiene “Looking for ISMP Compo…”? ¿qué tiene que hacer en “Looking data” ?
  • Se incluyen pasos “opcionales” que normalmente no se utilizarán, como “Upgrade or install?” (es poco probable que el usuario esté actualizando una versión de prueba de la aplicación).

Sólo eliminando los elementos comentados, y sin hacer un análisis más profundo, el número de pasos se reduciría a la mitad, reduciendo también la probabilidad de abandono por parte del usuario y, con ello, aumentando las oportunidades de venta.

Etiquetas: ,

No hay comentarios, se el primero en escribir uno

Alentando a los usuarios

Escrito por Sergio Sánchez Mancha el 24 Oct 2008

¿Quién no ha empezado a trastear con Photoshop sin leerse el manual? ¿Quién no se ha encontrado montando una puerta colocada al revés en un mueble de Ikea?

Al empezar a utilizar un software, los usuarios están muy motivados y tienden a ir al grano sin acabar de aprenderlo. Esta tendencia se conoce como la paradoja del usuario activo: los usuarios nunca leen los manuales, pero empiezan a utilizar el software inmediatamente, aunque a largo plazo se ahorrarían tiempo si hubieran dedicado tiempo a conocerlo.

Siendo conscientes de esta realidad, los diseñadores de interacción deben utilizar estrategias para alentar a los usuarios a emplear de forma más eficiente el sistema.

Algunos ejemplos interesantes:

  • Google Reader ofrece un módulo lateral en la página de inicio, con sugerencias o trucos para enriquecer la experiencia de usuario con la aplicación.
    Módulo de sugerencias en Google Reader
  • LinkedIn anima a sus usuarios a completar su perfil mediante una barra de progreso que da una idea del porcentaje de exhaustividad del perfil, además sugiere una "próxima acción" debajo de la barra de progreso para completar más el perfil.
    Barra de progreso en LinkedIn
  • En Unvlog, un sitio para compartir y descubrir videos con tus amigos, utiliza una sencilla lista de tareas para empezar a familiarizarte con el sistema.
    Módulo de sugerencias en Unvlog
  • The Hype Machine, un agregador de música que utiliza como fuentes los MP3 de los blogs musicales, recientemente ha alentado a sus usuarios a completar su perfil de una forma muy curiosa, utilizando por defecto la foto de John McCain como avatar.
    Avatar de John McCain en The Hype Machine

Etiquetas: , ,

Hay 3 comentarios a esta entrada, participa y escribe uno

Diseño de gráficos: pensar antes de dibujar

Escrito por Dani Armengol Garreta el 8 Oct 2008

Vemos tantos gráficos a diario en periódicos, informes, televisión y otros medios, que es comprensible que a veces perdamos de vista su verdadero objetivo.

El fin de un gráfico no es mostrar una información de forma más atractiva, sino contribuir a que la resolución de una cuestión numérica pase a ser una actividad de percepción visual.

Esto permite resolver la cuestión en las primeras fases de nuestro procesamiento cognitivo, con todas las ventajas que ello comporta: menores exigencias de aptitud numérica, mayor agilidad en la resolución, sensación que la solución está “fuera” y nosotros nos limitamos a “leerla”, etc.

Para que se den estas ventajas, sin embargo, se necesita un gráfico bien diseñado, y la clave para ello es pensar primero qué cuestión, o cuestiones, debe ayudarnos a resolver. Un gráfico que no responda a nuestras preguntas podremos calificarlo de un mal gráfico, pero resulta inocuo comparado con el gráfico que sí las responde, pero mal.

En la siguiente imagen tenemos un ejemplo de gráficos que nos mienten al hacerles ciertas preguntas. Se trata de un fragmento del dashboard (cuadro de mandos) de Google Analytics (la herramienta de Google para contabilizar y analizar los accesos a un sitio web) donde se muestra la evolución de las visitas de cuatro entradas de nuestro weblog en un cierto período de tiempo.

Gráficos del dashboard de Google Analytics

Al configurar un dashboard con varios elementos nuestro objetivo no es únicamente valorar la evolución individual de cada uno de ellos, sino también dar respuesta a preguntas como: qué elemento está teniendo más visitas, en cuál suben más, en cuál menos, etc.

Los gráficos anteriores nos engañan si tratamos de dar respuesta a estas cuestiones. Un primer vistazo a los dos de la parte superior nos podría indicar que la página representada por el de la derecha tiene muchas más visitas y una evolución mucho más esperpéntica que la de la izquierda, sin embargo si prestamos atención al eje de las ordenadas y al número total de visitas (pageviews) comprobamos que es justamente al revés: el de la derecha tiene menos de una cuarta parte de las visitas que el de la izquierda. Con los dos gráficos de la parte inferior pasa algo parecido.

El problema con estos gráficos es que el eje de las ordenadas de cada uno de ellos utiliza unos límites distintos. Si las ordenadas fueran absolutas, utilizando la misma escala en todas ellas, podríamos comparar los gráficos entre sí.

Esta solución, sin embargo, debe entenderse como una solución particular para las cuestiones que nos interesan. Al aplicarla perderemos otra información que ahora sí tenemos, como por ejemplo el detalle de la evolución individual de cada gráfico. Esto pone de manifiesto la importancia de conocer el escenario de uso y el objetivo final del gráfico que se quiere diseñar.

No hacer este análisis previo al diseñar un entorno donde se utilicen gráficos para ayudar a la toma de decisiones puede provocar que sus usuarios saquen conclusiones falsas. En algunos contextos las consecuencias de tomar una decisión errónea pueden ser insignificantes, pero en otros pueden ser nefastas, como pérdidas económicas, o incluso trágicas, como la muerte de un paciente en un hospital.

Etiquetas: ,

Hay 2 comentarios a esta entrada, participa y escribe uno

Experiencias paralelas: Mihály Csíkszentmihályi y la experiencia óptima

Escrito por Dani Armengol Garreta el 1 Oct 2008

La estrecha vinculación del protagonista de la experiencia paralela que os presentamos en esta ocasión con el mundo de la experiencia de usuario es prácticamente indiscutible, pues fue él quien describió, hace unos 18 años, qué es y cómo se llega a la “optimal experience”, la experiencia óptima.

Foto de Mihály Csíkszentmihályi Mihály Csíkszentmihályi (pronunciado [miha:ɪ :tʃɪ:k'sɛntmiha:ɪi]) es profesor de psicología en la Claremont Graduate University de California y conocido en el mundo científico por sus estudios y artículos sobre felicidad, creatividad y diversión. 

El público general lo descubrió cuando publicó su primer libro: “Flow: The Psychology of Optimal Experience”, traducido aquí como “Fluir. Una psicología de la felicidad”, que recogía las conclusiones que había obtenido de un estudio a gran escala sobre la felicidad. El texto estaba a medio camino entre un libro clásico de auto-ayuda y un ensayo sobre psicología, pero escrito en un lenguaje llano y comprensible, lo que contribuyó a que se convirtiera en un éxito en ventas.

Csíkszentmihályi utilizó toda la extensión de su libro para describir y hablar sobre el concepto de “fluir”, que intenta resumir en una entrevista con Wired:

"[Fluir es] estar completamente involucrado en una actividad por ella misma. El ego desaparece. El tiempo vuela. Cada acción, movimiento y pensamiento se sucede inevitablemente del anterior, como al tocar jazz. Todo tu propio ser se involucra y usas todas tus habilidades al máximo."

Todos podemos entender esta sensación: son esos pequeños instantes de iluminación en los que todo parece encajar, todo funciona como se esperaría, todo, en definitiva, fluye.

Conseguir una experiencia de flujo no es algo trivial. Según Csíkszentmihályi el flujo sólo es posible manteniendo nuestra conciencia en una zona estrecha entre lo que sería el aburrimiento y la ansiedad. Para mantener el equilibrio en esta zona, el “canal de flujo”, es necesario controlar dos factores: nuestras propias habilidades y los desafíos externos.

Canal de flujo, entre la zona de ansiedad y la de aburrimiento, dependiente de los desafios y las habilidades

A medida que realizamos una actividad, es habitual que mejoremos nuestras habilidades y se nos empiece a antojar aburrida (vamos de A1 a A2 en el gráfico anterior); por este motivo es necesario replantear continuamente los objetivos y desafíos de la misma para volver al canal (en A4). Si, por el contrario, aumentan demasiado los desafíos sin tener en cuenta nuestras habilidades, nos saldremos también del canal y pasaremos a la zona de ansiedad.

Los diseñadores de sistemas interactivos pueden influir a los usuarios en ambos factores, habilidades y desafíos. Csíkszentmihályi no es ajeno a ello y comenta en la entrevista:

"La mayoría de sitios web se montan como una cafetería. Coges lo que quieres. Suena bien al principio, pero pronto empieza a no importar lo que elijas. Todo es soso e igual. Los diseñadores de sitios web asumen que el visitante ya sabe qué elegir. Esto no es cierto. La gente entra en los sitios web esperando ser conducido a algún sitio, esperando una recompensa."

Y añade:

"Los objetivos transforman un paseo cualquiera en una persecución. Se necesitan objetivos claros que encajen en una jerarquía, con pequeños objetivos que se construyen hacia objetivos mucho más significativos de alto nivel."

Los usuarios usan aplicaciones o entran a sitios web con un fin en mente, sin embargo acostumbra a ser un fin de muy alto nivel, muy abstracto, que es necesario redefinir o trocear en pequeños objetivos. El diseño del sistema debe contribuir a conducir al usuario a través de estas pequeñas metas y para ello el diseñador tiene a su disposición multitud de herramientas, como la scent information, la retroalimentación positiva, el feedback del estado del sistema, etc.

Acabamos con una última reflexión de Csíkszentmihályi:

"El placer es un componente importante de la calidad de vida, pero por si mismo no brinda la felicidad."

Mihály defiende el peso de las experiencias continuadas de flujo en frente las sobrevaloradas emociones viscerales que nos causan placer. La primera impresión al entrar en un sitio web, por ejemplo, es importante, pero esa primera impresión se olvida rápidamente si la experiencia a largo plazo que ofrece el sitio no es satisfactoria.

 

Últimas experiencias paralelas que hemos publicado:

Etiquetas: , ,

Hay 2 comentarios a esta entrada, participa y escribe uno

Intentando dar con la alternativa a Google

Escrito por Gerard Adell el 29 Sep 2008

La mayoría de nosotros, cuando buscamos información lo hacemos en Google, mostrándonos convencidos que encontraremos lo que necesitamos en los primeros resultados de la larga lista que nos ofrece el buscador.

A menudo, esta lista de resultados no responde a un orden de calidad ni relevancia, sino a un orden marcado por SEO, condicionado por muchos elementos como: keywords, metatags, la disposición de los elementos en la página o el famoso Page Rank de Google, pero no por la calidad de la información.

Es verdad que la mayoría de la población realiza consultas que Google puede responder, y que les responde en los 10 primeros resultados, pero existen otro tipo de búsquedas más complejas a las que Google no responde en su primera página de resultados y que, por lo tanto, el usuario no encontrará. Seguramente la respuesta se encuentra en Google, perdida entre la larga lista de resultados que ofrece ¿Qué pasa entonces con todos esos resultados? Si está comprobado por varios estudios que la mayoría de los usuarios no las consulta ¿de qué sirve ofrecer una lista impresionante de resultados que nadie va a consultar?

En ese punto es donde toman importancia los buscadores como Iboogie o Cuil que, en vez de basar la ordenación de los resultados en SEO, analizan la información que ofrece cada resultado (de la búsqueda introducida y segmentando la información).

Estos dos buscadores, presentan los resultados de las búsquedas realizadas en categorías más específicas, centrándolos en lo que realmente le interesa al usuario. De esta manera, no sólo tienen importancia los 10 resultados de la primera página, sino que aumenta las posibilidades de que también sean consultados los principales resultados de cada cluster, cogiendo relevancia aquellos resultados que andaban perdidos en la interminable lista de Google.

Si realizamos una búsqueda genérica usando el término “usabilidad”, vemos cómo los buscadores nos permiten satisfacer nuestra necesidad de información mediante la división de los resultados en disciplinas y categorías específicas de la materia buscada. En Cuil se dividen los resultados en: “Diseño”, “Investigadores en HCI”, “Arquitectos de la información” y “Software para realizar test”. Iboogie, por su parte, divide los resultados en más categorías, centradas en subdisciplinas de la usabilidad como: “usabilidad y los usuarios”, “software para hacer test”, “profesionales”, “consultoría”, “investigación”, etc. creando más subcategorías jerárquicas.


Búsqueda realizada en Cuil

 

Búsqueda realizad en Iboogie


Gracias a ésta presentación de los resultados, el usuario puede, en primer lugar, tener una visión global del contenido que ha recuperado el buscador, en segundo lugar, acceder directamente al contenido relacionado con la usabilidad desde la perspectiva que más le interese y, en tercer lugar, acceder a resultados relevantes que, con una lista de resultados, no hubiera consultado.

Es evidente que se trata de buscadores en fase de pruebas o que deberían estarlo, pues aun deben mejorar en algunos aspectos. En primer lugar, el diseño de la interfaz deja mucho que desear, sobretodo en el caso de Cuil, donde la presentación de los resultados y la relación con las tags creadas no se hace evidente. En segundo lugar, las categorías creadas, al ser elaboradas por una máquina, no siempre son relevantes para el usuario ni pertinentes a la búsqueda realizada. Queda mucho trabajo para hacer, aun así, pero el concepto puede ser una buena alternativa a Google para facilitar el acceso a la información verdaderamente relevante a los usuarios.

Etiquetas: , , , , ,

Hay 1 comentario a esta entrada, participa y escribe uno

Mashups de elementos de diseño

Escrito por Sergio Sánchez Mancha el 25 Sep 2008

Un mashup (o remezcla) es una obra que contiene partes procedentes de creaciones anteriores para crear una nueva obra derivada. Por ejemplo, si hablamos en términos de diseño, una navaja suiza o un sacacorchos de palanca son mashups en toda regla.

En el diseño de interfaces digitales, la maleabilidad del medio permite crear con relativa facilidad combinaciones de elementos de diseño e implementarlos de forma ágil.

Nubes de etiquetas desplegables

Recientemente hemos descubierto un nuevo elemento de diseño que nos ha sorprendido bastante: las nubes de etiquetas (o tag clouds) desplegables. Se trata de nubes de etiquetas que despliegan un menú al pulsar sobre un ítem.

Algunos ejemplos:

Nube de etiquetas o tag cloud con subemnú

Tag cloud con menú desplegable

Ya comentamos en su día las bondades y desventajas del uso de nubes de etiquetas:

  • Son una buena herramienta para dar una idea de los contenidos de un sitio, siendo efectivas para mostrar "tendencias" en un tema.
  • Reflejan que detrás hay actividad mental y social
  • Tienen un efecto SEO positivo

No obstante no son buenas como elemento de navegación, más aún si los combinamos con otros elementos complejos para el usuario como los menús desplegables. En los ejemplos que hemos encontrado entendemos que es un mashup que aporta más notoriedad que valor.

Ruta de acceso con pestañas

Otro mashup de elementos de diseño que en cambio hemos visto implementado con éxito en muchos sitios web y aplicaciones es la ruta de acceso con pestañas o tabbed breadcrumb. Se trata de una ruta de acceso con aspecto de pestaña (o con aspecto pulsable) que permite desplegar un menú con el contenido de dicha sección.

Ruta de acceso con pestañas

Este elemento permite tener una visión global de la ubicación de un contenido a la vez que permite facilita la navegación a secciones previas.

Podemos ver algunos ejemplos de su implentación en páginas interiores de Yahoo Food y Yahoo TV, Apple utiliza algo similar en iTunes.

Ruta de acceso en iTunes

La ruta de acceso en Windows Vista tiene un comportamiento parecido:

Ruta de acceso en Windows Vista

La creación y la incorporación de un elemento novedoso de diseño puede ser a veces tentadora. No obstante antes de incorporarlo a una interfaz debemos valorar si se trata de un elemento que aporta valor al usuario o de un accesorio decorativo para denotar modernidad.

Etiquetas: ,

Hay 2 comentarios a esta entrada, participa y escribe uno

El precio de jugar

Escrito por Dani Armengol Garreta el 17 Sep 2008

En los 90 estaban de moda los libros multimedia interactivos para niños. Eran una especie de videojuegos en los que se iba pasando por distintos escenarios y habitaciones donde había multitud de objetos. El niño podía pulsar con el ratón en los distintos objetos para ver si pasaba algo. Por ejemplo, en una escena de campo se podía pulsar en una piedra para que aparecieran de debajo de ella unas hormigas bailoteando.

Libro multimedia interactivo de un centro de estudios de idiomas

Este tipo de juegos crean reacciones muy estimulantes que, incluso en la edad adulta, seguimos teniendo. El factor más estimulante es la sensación de “descubrir” que hay algo donde aparentemente no hay nada. Esto no sólo nos estimula perceptivamente, al generar una animación o movimiento en el juego, sino que también nos satisface en cierta forma, al sentirnos responsables del descubrimiento.

Los diseñadores de interfaces es habitual que al encontrarnos con una nueva interfaz nos pongamos a “jugar” con ella, la exploremos e intentemos ver qué nos puede ofrecer, llevándonos en ocasiones a descubrir elementos de interacción que están ocultos inicialmente.

Debemos tener mucho sentido crítico con esto, porque la sensación que nos pueden transmitir inicialmente estos “descubrimientos” es la misma que le transmiten las hormigas bailadoras de debajo de la piedra al niño. Podríamos juzgar tendenciosamente una interfaz de este tipo a partir de nuestra propia experiencia, pensando que por ser estimulante será también recordada y, por lo tanto, contribuirá al aprendizaje de la misma.

Estaríamos dejando de lado, sin embargo, un factor clave; pues la diferencia principal entre nuestro uso particular y un uso real de esa misma interfaz es que nosotros estábamos “jugando” con ella, sin ninguna tarea específica en mente. En medio de una tarea real esta sensación de descubrimiento y satisfacción se podría convertir en mera frustración al ver cómo algo que debería ser claramente visible está oculto.

Vamos, que no es lo mismo ir pulsando piedras para ver si hay hormigas debajo, que ir por ejemplo pulsando palabras en un sitio web en espera de descubrir cuál es un enlace y cuál no.

Etiquetas: , ,

Hay 1 comentario a esta entrada, participa y escribe uno

Visita el archivo para ver entradas anteriores.

Volver arriba

Trabaja con nosotros

Actualmente estamos buscando:

Diseñador de interacción en prácticas
En Usolab necesitamos incorporar a una persona en contrato de prácticas a media jornada, que colabore con nosotros para realizar tareas de diseño de interacción y usabilidad en nuestras oficinas de Sant Cugat (Barcelona).

Busca en el archivo: