Continuamos con los principios universales de diseño, esenciales para un resultado exitoso de tus diseños. Hoy revisaremos el énfasis, una poderosa forma de controlar la experiencia de usuario (UX) con tu diseño, haciendo que los elementos destaquen cuando sea necesario. Además de como utilizar el énfasis para crear el enfoque y establecer la jerarquía dentro de su diseño.

Énfasis en el diseño de la interfaz de usuario

En el diseño de la interfaz de usuario (UI), cuantos menos elementos tenga en una página, más fácil será entender por el usuario el propósito que pretendes comunicar.

Sin embargo, a medida que vas agregando más elementos a tu diseño, se puede volver difícil de distinguir en que debes centrarte primero, y en consecuencia perder la jerarquía, que es la hoja de ruta para navegar a través de tu diseño.

En este ejemplo que ves arriba, los elementos tienen aproximadamente la misma proporción de énfasis. Y en consecuencia, como podrás observar, no es fácil distinguir inmediatamente la acción que se supone que invitas a realizar al usuario. El cerebro tarda más en procesar el diseño y entenderlo, con lo que resulta una mala experiencia de usuario (UX).

La interfaz de usuario (UI) requiere que agregues y quites elementos hasta que el diseño esté armonizado. Por lo tanto, es necesario reevaluar si cada elemento tiene la proporción correcta de énfasis para crear una jerarquía adecuada.

Evaluación de la Jerarquía

Continuando con el mismo ejemplo, evaluemos dónde podrías aplicar o reducir el énfasis para mejorar este ejemplo.

En este ejemplo, hemos identificado los elementos de más importantes a menos importantes, ordenados en consecuencia.

  1. La llamada a la acción será "Elige adecuadamente", dejando claro desde el inicio lo que intentaremos que el usuario debe hacer.
  2. El botón de acción (CTA) será el botón "No, aquí". Deberás diseñar este segundo elemento más enfatizado, para que el usuario pueda tener confianza en que es la "elección correcta".
  3. El botón secundario será el botón "Click aquí". Este botón tendrá menos énfasis para dejar claro que no es tan importante como el botón principal.
  4. A continuación, debes asegurar de que el usuario entienda que "solo hay una opción correcta" dándole más énfasis que al texto restante.
  5. El texto restante puedes proporcionarlo simplemente para agregar más contexto, aunque no es tan importante como los elementos anteriores.
  6. Finalmente, el icono de la mano es el elemento menos importante. En todo caso, solo sirve para ayudar a comunicar el mensaje de bienvenida “Hola!”. Por lo tanto, no aporta valor, puedes simplemente eliminarlo o atenuar el icono en el fondo.

Idealmente, este es el orden en el que ayudaremos al usuario a entrar en contexto y facilitar la navegación al usuario:

A diferencia del ejemplo anterior, en este caso, ¿a qué elemento se te va la vista?

Conclusión

El énfasis es un poderoso principio universal de diseño que te ayuda a establecer el enfoque y crear un sentido de jerarquía, controlando la experiencia de usuario (UX) de tu diseño y haciendo que los elementos destaquen cuando sea necesario.

Photo by Elizabeth McDaniel on Unsplash

Referencias:
· UX Engineering: Emphasis