Krypton Solid

La última tecnología en raciones de 5 minutos

3 tendencias de diseño esenciales, diciembre de 2017

3 tendencias de diseño esenciales, 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 estelares de utilizar una tipografía hermosa para crear participación del usuario y causar una excelente 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 original, elija un tipo de letra que los usuarios no tengan dificultades 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á de moda en 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 y el espacio correctos 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?

  • Empiece con una frase clave. Puede ser su misión o una propuesta de valor para los usuarios. Dígales a los usuarios lo que aporta y por qué su sitio web será importante para ellos.
  • Elija un tipo de letra simple que tenga el mismo estado de ánimo que el mensaje 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 divertida para atraer a los usuarios.
  • Aprovecha 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 crear un estado de ánimo que se correlacione con los mensajes.

Cuando trabaje con un diseño de tipografía pesada, no lo fuerce. A veces, no tendrá suficiente texto para llenar una «pantalla» completa. Menos + Más y el tipo de tipo usan el bloqueo de color para crear varios paneles que tienen el tamaño perfecto para el contenido del texto.

menos
designups
tipos

2. Texto en recuadros blancos

Con tantos elementos visuales audaces en los proyectos de diseño de sitios web, y tantos puntos de interrupción receptivos con los que lidiar, los cuadros blancos están resurgiendo 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 variaciones de color.

Y aunque esta tendencia puede sonar un poco, bueno … descuidada o perezosa, en realidad se ve muy bien cuando se hace bien.

No puede simplemente colocar un cuadro en cualquier lugar de una imagen y esperar lo mejor. Las cajas blancas deben colocarse estratégicamente para que no cubran partes importantes de la imagen y para que los usuarios se muevan hacia ellas mientras miran el diseño.

Los cuadros blancos deben ser lo suficientemente grandes 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 colocar un cuadro de texto sobre una imagen en pantallas más pequeñas porque terminará con un cuadro de texto que es demasiado pequeño para leerlo o el cuadro cubrirá la mayor parte de la imagen.

Si te gusta el tratamiento de la caja blanca, diviértete. Cada uno de los ejemplos siguientes utiliza recuadros blancos de formas completamente diferentes.

Hacer espacio corta un cuadro blanco en la esquina inferior de la imagen para que la mayor parte de la imagen sea visible. El cuadro blanco sangra en el espacio en blanco de abajo de modo que casi parece que sale del panel de abajo. Esta técnica ayuda a conectar el control deslizante principal con el contenido a continuación (e incluso puede fomentar el desplazamiento).

hacer espacio

Cómo utiliza manchas circulares para que los cuadros de texto blancos coincidan mejor con el tono de la ilustración de fondo. Este sutil cambio de 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 uniforme. No desea que los cuadros blancos para el 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).

Howlit

Macaulay Sinclair tiene más texto que los otros ejemplos usando una parte de una cuadrícula de panel de imágenes para contener el elemento de texto. Aquí, la imagen detrás del cuadro blanco no tiene valor informativo. Tiene un esquema de color y movimiento que se parece a otras imágenes y principalmente sirve para crear cohesión entre el elemento de texto y el resto del diseño.

macaulay

3. Recortes de tipografía

Nadie dijo nunca que el texto tiene que ser una serie de letras rellenas sólidas. Más diseñadores están optando por recortes de tipografía que presentan un bloque de color sobre una imagen para que la imagen se vea con letras claras.

Esta técnica puede funcionar con imágenes fijas o en movimiento y con superposiciones de pantalla completa para que solo una pequeña cantidad de información venga a través de letras (casi para crear una textura) o con un estilo más de bloque sobre imagen con más de la imagen 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 del 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. Limítese a 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 a modo de dibujo para animar a los usuarios a participar en la videollamada a la acción. Toda la caja naranja es solo un botón gigante.

Danbury

Bodega Fusion utiliza un video de fondo de un viñedo en las letras. Lo bueno de este diseño es el efecto de triple capa: Fondo de video debajo del recorte de texto blanco debajo de la imagen de un producto.

vino

El Kaneko utiliza una imagen no identificable como relleno de letras. Si opta por este estilo, mantenga este fondo simple como lo hizo con este diseño. Solo hay un toque de color y textura que atrae la atención hacia el texto en el lienzo austero.

kaneko

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 utilizar el 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 que le fascinan. Déjame un enlace en Twitter; Me encantaría saber de ti.

Deja un comentario

También te puede interesar...

Definición de interés deducible de impuestos

¿Qué es el interés deducible de impuestos? El interés deducible de impuestos es un gasto de préstamo que un contribuyente puede reclamar en una declaración de impuestos federal o estatal para reducir los ingresos imponibles.

Ley de Fideicomiso de Alaska

¿Qué es la Ley de Fideicomiso de Alaska? La Ley de Fideicomisos de Alaska brinda protección contra los acreedores de los fideicomisos irrevocables, siempre que el fideicomiso tenga un otorgante que sea un beneficiario discrecional.

Definición del Plan Integrado de Pensiones

¿Qué es un plan de pensiones integrado? Un plan de pensiones integrado es un plan de pensiones basado en el empleador en el que el empleador considera los beneficios del seguro social como parte del

Oracle ofrece Secure Global Desktop 4.6

Oracle ha lanzado una versión actualizada de Secure Global Desktop, que ofrece más flexibilidad de navegador, mayor disponibilidad e integración perfecta con plataformas VDI. Oracle Secure Global Desktop, una de las tres ofertas de virtualización

65 mejores fuentes gratuitas, primavera de 2015

65 mejores fuentes gratuitas, primavera de 2015 Hasta ahora, 2015 ha sido un año extraordinario para las fuentes, con docenas de nuevos diseños en marcha. Hay un par de tendencias dominantes, ambas del año pasado.

Definición de arbitraje descubierto

¿Qué es el arbitraje con intereses descubiertos? El arbitraje de intereses al descubierto es una forma de arbitraje que consiste en cambiar de una moneda nacional con una tasa de interés más baja a una

Video en HTML5, a través de GIMP

En un hiperlocal ARRASTRAR En el taller del martes pasado, había planeado pasar por algunas técnicas básicas de «Photoshop», usando el enorme y maravilloso GNU IMP (¿Cómo es GNU IMP cada vez más capaz reemplazar

CIO de próxima generación | Krypton Solid

Acepta recibir actualizaciones, promociones y alertas de Krypton Solid.com. Puede darse de baja en cualquier momento. Al registrarse, acepta recibir boletines seleccionados de los que puede darse de baja en cualquier momento. Tu tambien estas

Detección de fraude en estados financieros

El 2 de diciembre de 2001, el gigante de la energía Enron conmocionó al mundo con su quiebra generalizada de los medios, luego de que la empresa fuera arrestada por cometer un flagrante fraude contable.ASus

Cómo acceder a SPID Poste

¿Ha activado SPID con Poste Italiane y desea acceder a su identidad digital, pero no sabe cómo hacerlo? quieres usar ID del mensaje para acceder a los servicios en línea de la Administración Pública pero

Cómo ahorrar en Spotify | Krypton Solid

En unos días se estrenará el nuevo sencillo de tu cantante favorito y, siguiendo sus actualizaciones en Instagram y Facebook, te enteraste de la posibilidad de pre-guardar en Spotify la canción en cuestión, que se