Recuerda agregar a los comentarios, esas buenas prácticas que conoces
Así como se menciona en el anterior artículo de buenas prácticas, al inicio del proyecto siempre se planifica, hay una estrategia y se debe escoger unos lineamientos (guidelines) a seguir, incluyendo: colores, tipo de letra, tamaño, etc. Hablamos de esas bases que vamos a seguir en todo el proyecto.
En este artículo nos vamos a enfocar en buenas prácticas para el elemento Visual de la interfaz de usuario, con éstas se pretende alcanzar un buen nivel de:
Atracción (Desirability)
Apoyar a la marca, logrando dar una buena impresión, y después de esto seguir brindando una experiencia emocional positiva.
Reflejando en esta experiencia las cualidades asociadas a la marca, producto o servicio de manera consistente.
Usabilidad (Usability)
Mejorar la Usabilidad, comunicando el contenido y comportamiento a través de una visualización acorde.
Para esto hay que tener en cuenta los factores del entorno que afectan la visualización del usuario y sus condiciones de priorización, la información relevante, etc.
Un diseñador Visual utiliza los principios de diseño y el análisis de la ‘persona’ o arquetipo de usuario para:
Reducir complejidad
Eliminando elementos visuales innecesarios
Priorizando
Visualmente los componentes con diferente peso según ciertas condiciones.
Organizando
Ajustando las propiedades visuales y estructuras contenedoras según secuencia, frecuencia, etc.
Los siguientes son principios de Diseño Visual necesarios en todo diseño de Interfaz de Usuario:
Gestión del tamaño de etiquetas
Para aplicaciones multi-lenguajes, gestionar el tamaño de las etiquetas, evitando que queden incompletas cuando son traducidas (por ejemplo las acciones en los botones).
Entender la percepción visual
Nuestros cerebros se quedan con una pequeña fracción de información visual para formar una primera impresión. ¿De qué color es una hoja? Es realmente de muchos colores, pero creemos que es verde.
Cuidado con el significado
Algunas formas o colores tienen diferente significado según:
- Su uso en un elemento visual
- Una señal en la carretera
- El contexto en el que se usa
- Una señal en un auto de emergencia
- La experiencia y cultura del usuario
- Una señal en la clase de matemáticas
Aprovechar la memoria visual
Los seres humanos tenemos una gran memoria visual, en especial, las formas. Una forma delineada es suficiente para reconocer el objeto u acción.
- Flechas que indican dirección
- Figuras que indican personas
- Sobres que indican correo.
Establecer Jerarquías
Esto permite que UI con demasiada información que visualizar, sea más eficiente y menos intimidante. Se puede usar:
- Posición anidada
- Tamaño o énfasis del texto
- Color o no color en objetos
Establecer Asociación
Para indicar relaciones o no, se puede usar diferentes apoyos visuales:
- Contenedores limitados con bordes
- Asociación de items por color (para apoyar a la memoria)
Referencias
Cooper, 2007. About Face 3. Editorial Wiley.
¿Qué otras buenas prácticas visuales conoces?