19 julio 2016

Hoy os traemos un artículo sobre diseño de interacción, uno de los pilares de la experiencia de usuario en productos y servicios digitales.

Guía de gestos
Guía visual de gestos. Gráfico de Luke Wroblewski

Bruce Tognazzini, más conocido como Tog, publicó hace tiempo sus principios básicos de diseño de interacción. Este texto es un clásico de la usabilidad y la experiencia de usuario, que también tiene traducción a castellano. Principios como anticipación, consistencia o legibilidad son habituales en cualquier análisis de interacción serio.

Hace pocos meses, Tog publicó una versión revisada y mejorada, que incluye adaptación a los dispositivos móviles. En este artículo nos centramos en las cuatro secciones nuevas: Estética, Color, Hallabilidad (discoverability) y Simplicidad.

Los comentarios son nuestros, aunque hemos utilizado ideas cortas para no hacer demasiado extenso el post. Por supuesto, os recomendamos leer el artículo completo escrito por Tog, a pesar de su extensión de casi 30 páginas.

Principios de estética

Principio: El diseño estético se debe dejar para aquellos que han aprendido y tienen habilidades en su aplicación: diseñadores gráficos/visuales.

Los profesionales de lo visual deben ser quienes se encarguen del diseño.

Principio: La moda nunca debe sobrepasar a la usabilidad.

Cambios visuales/gráficos de un producto o servicio deben mantener o mejorar la usabilidad que tuviera, nunca un gran cambio estético debe empeorar el uso.

Principio: Prueba con el usuario el diseño visual de manera exhaustiva como un diseño de conducta.

Prueba con los usuarios el desempeño del diseño nuevo frente al viejo, intenta que siempre el diseño nuevo mejore o iguale en usabilidad y eficiencia al diseño antiguo, si no haz las modificaciones pertinentes para que sea así.

Principios de color

Principio: Siempre que uses color para transmitir información en la interfaz, debes también usar pistas secundarias para transmitir la información para aquellos que no pueden ver los colores presentados.

Las pistas secundarias suelen ser tramas sobre los colores que los diferencien unos de otros, o algún icono que ayude al entendimiento de esa pista. Por ejemplo, el modo para deficiencias visuales en Trello es un buen ejemplo de este principio.

Principio: Prueba tu sitio para ver qué es lo que ven las personas ciegas al color.

Hacer un test con personas que tienen deficiencias en la percepción del color es la mejor manera de saber con certeza los problemas que se encuentran con una interfaz estas personas y que te den pistas de cómo mejorarla.

Principio: No evites el color en un interfaz sólo porque no todos los usuarios puedan ver todos los colores.

No es necesario volver a los años 80 y ver las interfaces en escala de grises, pero intenta conseguir que todos los usuarios tengan una experiencia y un uso correcto.

Principio: No quites o agobies con pistas de color en la interfaz por una moda pasajera de diseño gráfico.

La moderación es siempre una buena práctica. Usa pistas de color si lo crees necesario pero no agobies con ello, tampoco dejes que una tendencia de diseño te impida hacer un interfaz deje de ser usable para las personas con problemas de percepción del color.

Principios de hallabilidad

Principio: Cualquier intento de esconder la complejidad, servirá para incrementarla.

La navegación oculta en un menú hamburguesa es un ejemplo de mala aplicación de este principio. Otro ejemplo aplicable serían las opciones de de ajustes de algunos móviles.

Principio: Si eliges esconder la complejidad, hazlo sólo en la sala de demostraciones.

Si escondes la complejidad intencionalmente, intenta ofrecer opciones al usuario que le permitan ir avanzando poco a poco. Desarrollar funcionalidades para luego ocultarlas no tiene sentido.

Principio: Si el usuario no puede encontrarlo, no existe.

Esconder las opciones más avanzadas o que pueden dañar el aparato bajo varias pantallas, puede ser buena idea, pero intenta que sean lo suficientemente “encontrables” como para que las pocas veces que se usen, se encuentren lógicamente.

Principio: Usa el descubrimiento activo para guiar a la gente hacía funciones más avanzadas.

Los tutoriales de inicio están bien (onboarding), pero intenta no mostrar funciones demasiado avanzadas cuando el usuario es todavía novato. Para ello, es mejor usar el descubrimiento activo, es decir que el usuario haga cosas y cuando sepamos que las ha hecho correctamente, explicarle alguna funcionalidad más avanzada.

Principio: Los controles y otros objetos necesarios para el uso exitoso del software deben ser accesibles visualmente todo el tiempo.

Muchas aplicaciones esconden los controles principales en cuanto no se pasa el ratón por encima, intenta que esto no sea así.

Principio: No hay ninguna excepción de “elegancia” a la hallabilidad.

No empeores la hallabilidad de una interfaz por mejorar su diseño estético y hacerlo más elegante. La mejora estética es negociable, la usabilidad no. Como decíamos antes, la moda nunca debe superar a la usabilidad.

Principio: Con la excepción de los pequeños dispositivos móviles, los controles no deben encajarse en el medio del área de contenido.

Es recomendable diferenciar entre controles de la aplicación y el área de contenidos siempre que sea posible.

Principio: Comunica tu vocabulario gestual con diagramas visuales.

En las aplicaciones con controles mediante gestos, explica al usuario mediante un diagrama visual cuales son y sus funcionalidades.

Principio: Esfuérzate por equilibrar.

No estamos en los 80 o principios de los 90 donde casi nadie había usado un ordenador, no pongas iconos de información al lado de cada objeto. Usa tutoriales de overlay para explicar las cosas por ejemplo.

Principio: Prueba la hallabilidad con usuarios.

Si tienes dudas sobre tu aplicación o una interfaz, lo mejor es probarla siempre y conocer con certeza donde se encuentran los problemas los usuarios.

Principios de simplicidad

Principio: Equilibra entre sencillez de instalación y sencillez de uso.

A veces nos obsesionamos con que una aplicación sea fácil de instalar cuando es un proceso que solo ocurre una vez, mientras que poner el foco en el uso continuado es lo que debe prevalecer.

Principio: Evita la “ilusión de simplicidad”.

No hagas la interfaz tan simple que el usuario pierda funcionalidades con el único propósito de ser visualmente correcta. Muestra las funciones que sean necesarias, no las mínimas.

Principio: Utiliza la revelación progresiva para disminuir la curva de aprendizaje.

A veces mostramos a los usuarios funcionalidades demasiado avanzadas, incluso antes de que el usuario pueda asimilar todas las funcionalidades básicas. Es recomendable que estas funcionalidades se muestren progresivamente.

Principio: No simplifiques eliminando funciones necesarias.

Investiga qué funcionalidades usan tus usuarios, y cuáles son imprescindibles para su trabajo diario. Luego prioriza entre ellas para mostrarlas.

En Torresburriel Estudio estamos especializados a diseñar y realizar tests con usuarios para diferentes productos o servicios digitales, dependiendo de los objetivos del proyecto. Contacta ahora con nosotros y hablamos :-).

Comentarios

  1. […] puede parecer una buena idea por la limitación de espacio, pero definitivamente no lo es. Como explicaba Tog en sus principios de interacción, cualquier intento de esconder la complejidad, servirá para […]

  2. […] de este entorno de escritorio. Se basan en unos principios básicos muy similares a los principios de diseño de Tognazzini, actualizados con algunos aspecos de experiencia de usuario, como el último punto sobre añadir […]

  3. […] en cuando, nos gusta recordar en un post conceptos básicos sobre diseño e interacción como el de los principios de interacción de Tog o el de la curva de aprendizaje ya que nos ayudan a entender una parte de nuestra disciplina que […]

  4. […] de aprender y menos propensos a errores. Tognazzini, en su versión revisada y mejorada de sus principios básicos de diseño de interacción, ya lo menciona en los apartados de Hallabilidad (Discoverability) y Sencillez […]

En Torresburriel Estudio desarrollamos las capacidades técnicas de tu equipo en temas de usabilidad, experiencia de usuario y diseño de producto a través de nuestros cursos online y presenciales.