Algunos sitios web se ven muy bien, incluso si desafían la sabiduría convencional o los principios de la teoría del diseño. Una nueva tendencia de diseño es mostrar esa idea con elementos que cubren o obstruir Algo del texto en el diseño.
Es una tendencia interesante porque va en contra de todo lo que comúnmente hablamos con el diseño, que debe ser legible para conectarse con los usuarios rápidamente.
No hace falta decir que esta puede ser una técnica difícil de lograr con eficacia, pero los diseños son sorprendentes e impactantes cuando se hacen bien. Aquí hay un desglose de la tendencia y algunas ideas sobre cómo puedes probarlo tú mismo.
Obstrucción simple
Si el texto está cubierto en un diseño, todo lo demás debe ser visualmente super simple para que el usuario no se pierda en demasiados efectos.
En cada punto de corte de respuesta, el texto no está más oculto que cualquier otro.Root Studio hace un gran trabajo con una primera impresión que llama la atención con el color y la jirafa animada simple que cubre parte de las letras de gran tamaño. El truco aquí es que aunque algunas de las letras están obstruidas, no hay duda de cuál es la palabra en la pantalla. Las letras aún son legibles, debido al tamaño, la simplicidad del tipo de letra y la ubicación del elemento obstructivo.
El equipo de diseño tuvo especial cuidado con la obstrucción del texto para mantener la integridad de "ROOT". ¿Cuál es la marca de este sitio web en particular. En cada punto de corte de respuesta, el texto no está más oculto que cualquier otro. (Aquí es donde muchos de estos diseños se quedan cortos. Se ven muy bien en las resoluciones de escritorio, pero el texto está demasiado obstruido para que se pueda leer en pantallas más pequeñas).
Capas Tridimensionales
Agregar un efecto de capas tridimensional puede ayudar a que los elementos salten de la pantalla para que los usuarios sientan que pueden alcanzarlos y tocarlos. El texto puede servir como elemento de fondo en algunos casos.
Simplemente asegúrese de que la capa sobre el texto no cubra demasiado la palabra (o palabras). Y siempre es vital asegurarse de que las obstrucciones del texto no produzcan palabras no deseadas debido a la ubicación de otros elementos.
Simplemente Chocolate usa bien este efecto de capas. Funciona principalmente debido a la combinación de letras de gran tamaño que usan palabras comunes en un tipo de letra en negrita y un elemento superior que no es realmente grande y contiene exactamente las mismas palabras que están ocultas por el elemento caramelo.
Este tratamiento hace que las letras grandes en el fondo sean más un elemento gráfico que legible, creando un poco de contraste y un magnífico efecto de capas. (Es posible que te encuentres desplazándote por los diferentes sabores de caramelo para ver cómo crean el efecto de diferentes maneras).
Olvida las reglas del espacio
A veces, las obstrucciones de texto no cubren las letras, sino que invaden su espacio.
Es una de esas reglas que rompe North Street sin que el diseño se sienta desordenado o inconexo. La descripción de la compañía topa con la regla vertical del centro en la pantalla (el resto del diseño usa este divisor para una estética de pantalla dividida).
Si alguien dijera que va a usar este tratamiento, probablemente intentará convencerlos de lo contrario, pero aquí funciona. La composición visual es muy liviana, gracias a la gran cantidad de espacios en blanco, y las opciones tipográficas son lo suficientemente audaces como para que la línea gris clara casi quede en el fondo, aunque se encuentre en el espacio que debería estar reservado para el texto.
Una segunda línea gris divide el texto en la navegación, pero la mayoría de los usuarios probablemente ni siquiera notarán la obstrucción.
Sólo para letras grandes
Si observa todos los ejemplos aquí, probablemente notará un tema común. Todas las letras obstruidas son bastante grandes y utilizan tipografías simples.
Las letras pequeñas normalmente no le darán suficiente espacio para cubrir parte del texto de manera que parezca útil. Si planea diseñar con una obstrucción de texto, debe ser intencional y tener un significado.
Los scripts complicados de los estilos de novedad son demasiado difíciles de leer con un elemento encima de ellos.Cubrir letras pequeñas es increíblemente difícil, en términos de diseño intencional y legibilidad. Es por eso que la técnica está emparejada con tipografía de gran tamaño.
Estos tipos de letra grandes, a menudo sans serif, son fáciles de leer de un vistazo y suelen tener anchos de trazo medianos y cuencos y mostradores grandes que hacen que los elementos de capas sean más prácticos. Para hacer que este concepto funcione, necesitas letras con formas que se presten a este concepto. Los estilos de tipos finos o condensados no suelen funcionar, y los scripts complicados de los estilos de novedad son demasiado difíciles de leer con un elemento encima de ellos.
Elementos con poco contraste
A veces, la obstrucción del texto no es un elemento que está encima del texto; Es la relación entre el elemento de texto y lo que lo rodea. La falta de contraste entre el texto y los elementos de fondo también puede resultar en una obstrucción del texto.
Una vez más, este puede ser un concepto difícil de lograr con eficacia. El texto existe innatamente para ser leído. La falta de contraste puede hacer eso difícil.
Cuando se combina con texto altamente legible, los elementos de texto de bajo contraste son recordatorios sutiles en la pantalla. Estos elementos se leerán después de otros elementos de mayor contraste.
En el diseño de Anew, arriba, la descripción del negocio es más importante que la marca. Eso es lo que el diseño le dice a los usuarios debido al tipo de tratamiento. ¿Palabras clave? ¿Cocina en la azotea + prueba? Son fáciles de ver y leer. ¿El nombre? ¿Nuevo? Aparece en una ubicación de bajo contraste debajo de la marca. El ojo aún se siente atraído por el gran logotipo, pero no es el punto focal principal cuando se trata de la lectura y la recopilación de información.
Parte de la razón por la que este tratamiento funciona en este espacio es por el contenido del diseño.Piensa en la simbiosis entre la palabra? ¿De nuevo? y los brillantes platos blancos de la cena. Se siente fresco, diferente y atractivo.
Conclusión
Los diseños de texto obstruidos son cada vez más populares. No hace mucho tiempo, habría sido difícil encontrar algo con este estilo en línea. (Los diseños impresos lo han usado de manera más consistente porque los diseñadores no tenían que preocuparse por los puntos de interrupción sensibles)
Solo tenga cuidado al crear algo con texto que no sea completamente visible. Asegúrate de que las palabras sigan diciendo (y significando) lo que pretendes. Si tiene alguna duda acerca de cómo se percibirá o leerá un diseño al usar texto obstruido, considere otra opción. Nunca querrás que tu diseño sea difícil de entender para los usuarios.