Modyo
Comienza Aquí
diseño ux

La importancia de enfocar la atención del usuario

Un buen diseño da como resultado productos útiles, estéticos y comprensibles. Es responsabilidad de los diseñadores de UX/UI aprovechar al máximo las herramientas visuales, teniendo en cuenta la accesibilidad para todos los usuarios.

Compartir en:

Relacionado con:

Marketers

Publicado el 23 Jul, 2020 5 minutos de lectura

Detrás de cada gran experiencia de usuario, hay un gran diseño.

Un buen diseño genera productos útiles, estéticos y comprensibles. El legendario diseñador Dieter Rams, padre de los famosos 10 principios del buen diseño, explica  que un buen diseño "... aclara la estructura del producto. Mejor aún, puede hacer que el producto hable. En el mejor de los casos, se explica por sí mismo".

Como diseñadores, este es nuestro deber. Cuando nos comprometemos a un gran diseño de producto, nos comprometemos a enfocar la atención del usuario para que entienda y obtenga más valor de lo que ofrecemos. Esta es la clave.

Diseño de UX en tres fases

En este artículo, quiero tratar algunos de los fundamentos para construir un buen producto. En particular, cuando se trata de canales digitales, hay una serie de temas prácticos a considerar, tales como, la accesibilidad con el cumplimiento del ADA, el SEO, la capacidad de búsqueda, los escenarios transaccionales y la capacidad de respuesta.

Nuestro proceso de UX en Modyo para abordar estos temas es iterativo, y nos ayuda a mejorar continuamente nuestro diseño con la retroalimentación. Este proceso de UX es más un acercamiento—o una forma de pensar—que una definición estricta, ya que difiere entre las organizaciones.

Dicho esto, hay tres fases en la forma en que nos acercamos a UX: investigación, concepción y pruebas de usuario.

  • Investigación, "Construir un buen producto"
    También llamado "Descubrimiento", definimos el alcance del producto y los objetivos comerciales según las limitaciones de los interesados y las necesidades de los usuarios finales.

  • Concepción, "Construir el producto correcto"En este segundo paso es donde diseñamos las interacciones de los wireframes de baja fidelidad para enfatizar la arquitectura y estructura de la información que definimos en el paso anterior.

  • Prueba de usuario, "Construyendo un producto útil y utilizable" 
    Prueba tu producto con los usuarios, y descubre lo que necesitas cambiar. Las pruebas de usuario son la mayor influencia que se tienen en las decisiones sobre el diseño. Ayudan a garantizar que no se fuerce el comportamiento del usuario por caminos no naturales, y también contribuye a consolidar la visión de las partes interesadas con la experiencia del usuario.

Carga Cognitiva y Jerarquía Visual

Ahora detallaremos un poco más la concepción del producto, y explicaremos cómo considerar todas las limitaciones. Cuando diseñamos un producto, siempre tenemos en mente las siguientes cinco tareas para asegurarnos de que nos mantenemos en línea con las expectativas del usuario:

  • Enfocar la atención del usuario

  • Llevar a los usuarios a la meta final

  • Reducir el esfuerzo mental y mantener el flujo

  • Maximizar y estandarizar la compatibilidad con las tendencias naturales del usuario

  • Minimizar los errores y evitar la frustración

Tanto dirigir como enfocar a los usuarios es un reto complejo, porque tenemos que mantener un equilibrio entre la carga cognitiva y la jerarquía visual. Los productos digitales se escanean, no se leen, por lo que no podemos pedir a un usuario que haga varias tareas, porque su atención es necesariamente selectiva. Casi todos los usuarios hacen esto: primero escaneamos los titulares, luego los subtítulos, y sólo después, copiamos los bloques.


Es importante entender hacia dónde se dirige la atención de los usuarios.


Concentrar la atención con todos los usuarios en mente...

Si queremos diseñar una buena experiencia, debemos proporcionar una forma sencilla para que nuestros usuarios centren su atención. El contenido es importante, pero una arquitectura de información adecuada es vital para presentar la información gradualmente.

Los modelos de interacción agradables ayudan a los usuarios a sentirse cómodos mientras usan un producto. Depende de los diseñadores de UX/UI manejar herramientas visuales como el tamaño, el color, el contraste o el espacio negativo -el área entre los elementos de una composición de diseño- teniendo en cuenta la accesibilidad para todos los usuarios.

ejemplo de espacio negativo utilizado en un sitio web 
Todos los elementos de tamaño, color, contraste y espacio negativo están representados acá.

Según un informe del 2005 de la Oficina del Censo de los Estados Unidos, ese año había aproximadamente 54 millones de personas con discapacidad en los Estados Unidos, que constituían el 18,7 por ciento de la población total. Otro estudio de Google basado en datos del Banco Mundial (WDI, 2008) y CDC.gov (NHI Survey, 2008), encontró que hay más usuarios con discapacidad auditiva en los Estados Unidos que toda la población de España, y más usuarios ciegos o con baja visión que la población de Canadá.

Gráfico de uso de Internet en el mundo vs. necesidades de accesibilidad en EE.UU. 
Estos son sólo los que tienen problemas de visión o audición sólo en los EE.UU.

... Y cumplir con los estándares

Para atender las necesidades de los usuarios discapacitados, la Ley de Estadounidenses con Discapacidades (ADA) establece las normas y reglamentos que deben seguir los sitios. En conformidad con la ADA, estas regulaciones prohíben la discriminación a través de la exclusión, e incentiva a utilizar las pautas de las WCAG 2.0, como una guía que incluye tres niveles de cumplimiento:

  • nivel A: Un sitio al que algunos usuarios pueden acceder.

  • nivel AA : Un sitio al que pueden acceder casi todos los usuarios.

  • nivel AAA: Un sitio al que pueden acceder todos los usuarios.

El nivel AA de WCAG 2.0 es el nivel mínimo requerido para ser considerado conforme a la ADA. Esto incluye la adhesión a ciertas directrices como el uso de imágenes y diagramas para apoyar el texto, alinear el texto a la izquierda, o mantener las notificaciones y los botones dentro del contexto.

Ejemplo de botones de llamada a la acción primarios, secundarios y terciarios

Otras pautas incluyen escribir en un lenguaje sencillo, aclarar información importante y explicar lo que sucederá después de completar un servicio, a fin de reducir el esfuerzo mental y la ansiedad.

lo que hay que hacer y lo que no hay que hacer en un formulario de inscripción 
Una marca o una "X" junto a cada campo de texto ayuda a aclarar el significado.

Aplique estas pautas a su diseño

Los usuarios quieren claridad y simplicidad y para ello es necesario proporcionar un diseño consistente que facilite el uso de los productos, independientemente del tamaño de la pantalla. Especialmente en los dispositivos móviles, un principio de diseño fundamental es incluir sólo la información necesaria. Nuestra forma de pensar debe incluir grandes acciones que se puedan tocar con un clic, comúnmente llamadas "tap-targets fáciles de tocar". Otra recomendación práctica es elegir un tipo de letra que funcione bien en múltiples tamaños y pesos para mantener la legibilidad y la facilidad de uso en cada tamaño. 

ejemplo de diferentes fuentes en un tamaño de 16px 
16px es un buen punto de partida.

Generalmente se está de acuerdo que 16px para el texto del cuerpo es un buen punto de partida. Por supuesto, algunos textos serán más pequeños y los encabezados más grandes, pero para el cuerpo principal 16px es una apuesta segura. Dicho esto, las WCAG 2.0 establecen oficialmente que los visitantes deben ser capaces de cambiar el tamaño de todo el texto de una página hasta el 200% de su tamaño original.

Por supuesto, todos los puntos mencionados podrían ser discutidos más a fondo, explorando las innumerables maneras de mejorar la experiencia del usuario. El punto aquí es que al enfocar la atención del usuario, estamos diseñando con empatía. Estamos considerando cómo reducir el ruido, eliminar la fricción, y proporcionar a los usuarios una mejor experiencia. Esa empatía incluye necesariamente a todos los usuarios: aquellos con dificultades de visión, de audición, con diferentes niveles de habilidades motoras, y más. 

Durante tu próximo producto o proyecto, esperamos que encuentres este breve resumen como una guía útil para enfocar la atención del usuario en tu diseño UX. Parte de la belleza inherente de las interfaces bien diseñadas proviene no sólo de su estética, sino también de su disponibilidad para todo el mundo.

Foto de portada por Nicholas Doherty en Unsplash

Otras publicaciones

Obten más información al respecto