3 tendencias de diseño esencial, diciembre de 2017
Las tres tendencias de diseño esenciales de este mes tienen que ver con la tipografía. Y las tendencias muestran algunas formas bastante estelares de usar tipos bonitos para crear un compromiso por parte de los usuarios y dar una buena primera impresión.
Un tema común entre estos diseños es que todos los estilos de tipografía son altamente legibles. Si planea trabajar con un elemento de texto más moderno o más moderno, elija un tipo de letra que los usuarios no tengan problemas para leer. La técnica de moda es el truco con estos diseños, no el tipo de letra en sí.
Esto es lo que está en tendencia en el diseño este mes:
1. Simplemente escriba encima del desplazamiento
Si bien una gran imagen puede ayudar a atraer a los usuarios a un diseño, a veces las palabras correctas y el espacio son el boleto.
La clave para aprovechar al máximo esta tendencia de diseño es refinar su mensaje. Las palabras deben ser simples, decir algo significativo y crear valor para el usuario.
Entonces, ¿cómo lo haces?
- Comience con una frase clave. Puede ser su misión o una propuesta de valor para los usuarios. Dígales a los usuarios qué aporta a la mesa y por qué su sitio web será importante para ellos.
- Elija un tipo de letra simple que tenga el mismo estado de ánimo que los mensajes para bloques de copia más largos.
- Si el bloque de texto es corto, como con Tipos de tipo , considere una opción de tipo más funky para atraer a los usuarios.
- Aproveche al máximo el espacio. Tenga en cuenta que en cada uno de los ejemplos a continuación, el texto tiene mucho espacio para respirar, lo que facilita la lectura de un vistazo. El espacio también puede ayudar a llamar la atención sobre el texto, y puede equilibrar los elementos de texto si no desea centrarlos en la pantalla, como Diseño Ups .
- Use el color para ayudar a agregar interés visual. Los tonos brillantes y modernos pueden ayudar a atraer a los usuarios al diseño. El color también puede ayudar a establecer un estado de ánimo que se relacione con la mensajería.
Cuando trabaje con un diseño tipo pesado, no lo fuerce. A veces, no tendrá suficiente texto para completar una "pantalla" completa. Menos + Más y Tipo de tipo: uso de bloqueo de color para crear paneles múltiples que se dimensionan perfectamente para el contenido de texto en el mismo.
2. Texto en cuadros blancos
Con tantos elementos visuales audaces en los proyectos de diseño de sitios web, y tantos puntos de ruptura receptivos para tratar, los recuadros blancos están volviendo a surgir como un elemento contenedor para el texto. Los cuadros blancos con texto oscuro en el interior pueden garantizar la legibilidad cuando se trata de mensajes sobre fotos, videos o ilustraciones donde hay variación de color.
Y aunque esta tendencia puede sonar un poco, bueno ... descuidada o floja, en realidad se ve genial cuando se hace bien.
No puedes simplemente colocar una caja en cualquier lugar de una imagen y esperar lo mejor. Los cuadros blancos deben colocarse estratégicamente para que no cubran partes importantes de la imagen y para que los usuarios se muevan hacia ellos mientras observan el diseño.
Los cuadros blancos deben ser lo suficientemente grandes como para contener una cantidad razonable de texto y debe tener un plan para este elemento en pantallas más pequeñas, como permitir que todo en el cuadro de texto caiga debajo de la imagen principal. No intente poner un cuadro de texto sobre una imagen en pantallas más pequeñas porque terminará con un cuadro de texto demasiado pequeño para leer o el cuadro cubrirá la mayor parte de la imagen.
Si busca el tratamiento de caja blanca, diviértase. Cada uno de los ejemplos a continuación usa recuadros blancos de maneras completamente diferentes.
Hacer espacio corta una caja blanca en la esquina inferior de la imagen para que la mayor parte de la imagen esté visible. La caja blanca sangra en el espacio en blanco debajo de modo que casi parece que sale del panel de abajo. Esta técnica ayuda a conectar el control deslizante principal al contenido a continuación (e incluso puede alentar el desplazamiento).
Cómo utiliza blobs circulares para que los cuadros de texto blancos coincidan mejor con el tono de la ilustración de fondo. Este cambio sutil en la forma, para que las cajas parezcan más fluidas, ayuda a conectar los elementos para que las cajas y el fondo tengan una sensación constante. No desea que los cuadros blancos del texto se sientan como si estuvieran colocados al azar en el fondo. (Eso no funciona y no ayudará a crear una sensación de cohesión para los usuarios).
Macaulay Sinclair tiene más texto que los otros ejemplos que usan una parte de una cuadrícula de panel de imagen para contener el elemento de texto. Aquí, la imagen detrás de la caja blanca no tiene valor de información. Tiene un esquema de color y movimiento que se parece a otras imágenes y en su mayoría sirve para crear cohesión entre el elemento de texto y el resto del diseño.
3. Recortes de tipografía
Nadie dijo que el texto debe ser una serie de letras llenas. Cada vez más diseñadores optan por recortes de tipografía que presentan un bloque de color sobre una imagen para que la imagen se obtenga mediante letras claras.
Esta técnica puede funcionar con imágenes fijas o en movimiento y con superposiciones de pantalla completa de modo que solo una pequeña cantidad de información provenga de letras (casi para crear una textura) o con más estilo de bloqueo sobre imagen con más imágenes de fondo visible.
El truco para hacer que esto funcione es el tipo de letra correcto. Las letras deben tener trazos lo suficientemente gruesos para que la imagen o textura en el fondo sea visible. No puede hacer esto con una fuente delgada o condensada con un éxito constante.
Esta técnica también funciona mejor si el número de palabras y letras es bastante limitado. Acepte de una a tres palabras con 10 letras o menos o use palabras muy comunes que los usuarios sabrán de un vistazo.
Danbury utiliza un recorte de texto brillante como un sorteo para alentar a los usuarios a participar en la video llamada a la acción. La caja anaranjada entera es solo un botón gigante.
Bodega Fusion utiliza un video de fondo de un viñedo en las letras. Lo mejor de este diseño es el efecto de triple capa: fondo de video debajo del recorte de texto blanco debajo de la imagen del producto.
El Kaneko utiliza una imagen no identificable como relleno de letras. Si opta por este estilo, mantenga este fondo simple como está hecho con este diseño. Solo hay un toque de color y textura que llama la atención sobre el texto en el lienzo.
Conclusión
La colección proporciona inspiración para aquellos proyectos que pueden no tener una gran imagen o video, por lo que aún puede encontrar una manera de crear algo a lo que los usuarios responderán. No tenga miedo de usar texto como elemento visual e informativo en este diseño.
¿Qué tendencias estás amando (u odiando) en este momento? Me encantaría ver algunos de los sitios web con los que está fascinado. Déjame un enlace en Twitter ; Me encantaría saber de ti.