Aprender diseño visual lleva tiempo y práctica pero afortunadamente existen tips que pueden hacerlo más fácil y dan buenos resultados. Si no eres diseñador de interfaces pero te toca hacerlo en tu trabajo, abajo te dejo algunas recomendaciones que pueden servirte.

Alinea los elementos de la interfaz.

La desalineación de los elementos de una interfaz (imágenes, bloques de texto, videos, botones, etc) hace que una pantalla sea vea desorganizada y que las personas no sepan qué hacer.

Usa una cuadricula como referencia, la alineación de los objetos va a mejorar mucho el diseño y hacerlo más organizado visualmente.

Screen Shot 2017-09-01 at 11.51.57 AM
Fuente: https://developer.apple.com/design/tips/

Usa suficiente contraste.

Usa colores que brinden suficiente contraste en el fondo y el texto para no dificultar la vista. Fondos blancos y textos negros son la mejor opción. Evita el amarillo, verde y grises muy claros.

Screen Shot 2017-09-01 at 11.58.09 AM
Fuente: https://developer.apple.com/design/tips/

Menos es más.

Como lo dijo el Arquitecto Mies van der Rohe: menos es más, esto significa “reducir algo a lo mínimo, a los elementos esenciales que componen la cosa. Todo lo demás disturba.”

Trata de ser minimalista a la hora de diseñar, los sitios simples con poca saturación de colores, imágenes, animaciones, etc. se ven actuales. Si le sumas una buena alineación a este punto el producto va a ser un diseño más organizado.

simple design.jpg
Fuente: Pinterest.

Primero lo importante.

Muestra el contenido importante primero y hazlo resaltar, la función modular del sistema deberá estar a la mano siempre. A esto se le llama jerarquía visual y es importante en diseño web para priorizar el contenido mediante el diseño.

Screen Shot 2017-09-01 at 12.11.41 PM
Fuente: https://developer.apple.com/design/tips/

Tamaño del texto e interlineado.

Usa tamaños de textos que sean legibles, aumenta el tamaño del texto para que sea fácil de leer y usa interlineados que le den espacio al texto.

Screen Shot 2017-09-01 at 12.16.33 PM
Fuente: https://developer.apple.com/design/tips/
Screen Shot 2017-09-01 at 12.18.11 PM
Fuente: https://developer.apple.com/design/tips/

Usa paletas de colores ya definidas.

El buen manejo del color es un arte que no todos dominamos. En este caso, busca paletas de color ya definidas o puedes ayudarte de Adobe KulerColor Tool de Material Design.

Screen Shot 2017-09-01 at 12.35.08 PM

Screen Shot 2017-09-01 at 12.36.27 PM

Aprovecha las convenciones visuales.

Usar patrones que los usuarios identifican y saben usar es la manera de facilitar el uso de una aplicación. Las convenciones son eso, patrones aprendidos por los usuarios. Por ejemplo cuando al dar click al logo en una web te dirige al Home, el color azul de un link, el ícono de carrito para la cesta de compra en un e-commerce, el hover de un botón, etc.

Aprovecha los conocimientos de los usuarios y no trates de innovar cuando no es necesario. Los usuarios buscan familiaridad en los sitios que usan.

Sigue las guías de diseño de Apple o Google.

Google Material Design y Apple Human Interface Guidelines son guías donde se establecen las mejores prácticas de diseño de interfaces y experiencias, son súper útiles y tienen recursos gráficos como íconos, colores, guías de diseño, etc.

 

Con esta sencilla guía notarás cambios en las interfaces que diseñes pero sé persistente, aprender a diseñar lleva práctica y tiempo.

¿Qué te pareció el artículo? ¿Lo encontraste útil? Si tienes dudas o comentarios no dudes en compartirlo.

Fuentes:

  1. https://developer.apple.com/design/tips/

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión /  Cambiar )

Google photo

Estás comentando usando tu cuenta de Google. Cerrar sesión /  Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión /  Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión /  Cambiar )

Conectando a %s