Tendecias de Diseño: Sombra Larga

Una nueva tendencia se está abriendo camino en el ciber espacio – el diseño con sombra larga.

El concepto, que toman prestado temas como el diseño plano, está tomando mucha importancia. La tendencia está impactando en los elementos de interfaz de usuario e iconos mayormente, pero está empezando a extenderse a otras partes del diseño web.

¿Qué es el Diseño de Sobra Larga?

Long-Shadows
ipad-mini
fox-icon
 Las sombras largas se extienden pasado el objeto al que reflejan.

“Sombra larga” no es un término nuevo. Realmente viene de la iluminación y la fotografía. Los fotógrafos a menudo muestran largas sombras en las imágenes para crear un efecto drama. Con luz natural, las sombras largas son proyectadas cuando el sol está cerca del horizonte, ocurriendo ambos al amanecer y al atardecer.

En diseño, las sombras largas se han convertido rápidamente en tendencia. En diseño, las sombras están siendo añadidas en esquemas de diseño plano. Las sombras, que a menudo se proyectan en un ángulo de 45 grados, reflejan un objeto y añaden mucho énfasis y drama.

Lo que diferencia a estas sombras es que, también son planas. Los diseñadores crean sombras largas usando un matiz sin decoloramiento o degradado del color.

Parece que muchos diseñadores pensaron en las sombras largas al mismo tiempo usando la misma idea. Incluso en la dirección y el ángulo de cada sombra. (Casi todas las sombras caen en la esquina inferior derecha del objeto en un ángulo de 45 grados, aunque algunos diseñadores utilizan 120 grados.) Los bordes de las sombras son nítidos y añaden un elemento extra de profundidad al diseño.

El diseño con sombras largas está más limitado que otros conceptos, porque está pensado solo para elementos pequeños. No es algo que los diseñadores utilizan para un proyecto entero y casí casí está limitado para iconos y botones.

Hasta la fecha, el diseño con sombra larga se utiliza mayormente para objetos pequeños y elementos como los iconos. Las sombras residen dentro del elemento y a veces se extienden más allá del objeto que les rodea. Muchos de los conceptos que estamos viendo vienen de proyectos donde los diseñadores buscan maneras creativas para crear iconos que servirían para Apple iOS 7.

Conceptos Prestados del Diseño Plano

clock
flat-shadow

El diseño con sombras largas toma prestados muchos de los principios del diseño plano. Se podría considerar una forma de diseño plano (or deberíamos llamarlo “casi plano”).

El diseño de sombra larga está basado en formas simples y lineas concisas, este tipo de diseño está pensado para ser usado con un esquema de diseño plano. Los elementos diseñados con sombra larga, pueden ser un reflejo más oscuro que la tonalidad pretenden reflejar, mejor dicho blanco o gris.

Los elementos que emplean diseños con sombra larga pueden utilizarse con elementos que son completamente planos para crear un esquema de diseño general interesante.

Where long shadow design removes itself from flat design is with the idea that elements take on more of a three-dimensional effect. While it works for long shadow design, some purists may argue that any effect designed to create that extra layer of dimension is not entirely flat.

Donde el diseño con sombra larga se aparta del diseño plano es con la idea de conseguir un efecto tridimensional.

Galería de las Sombras Largas

El diseño con sombra larga está muy de moda en los bocetos, aunque no muchos proyectos lo han hecho publico aún. (Pero espera a verlo cada vez más dentro de poco.)

El ejemplo más notable de un diseño con sombra larga proviene de un minorista americano JC Penney, que está emitiendo una campaña publicitaria en internet y TV que utiliza sombras largas.

Dribbble es un buen sitio para buscar inspiración sobre diseño plano con largas sombras. Aquí tienes una galería con algunos buenos ejemplos de sombras largas.

flat_social_networklongflat-skypeman_of_steel_iconsafari_icondesignmodo_long_shadowsocialiconsmLong-Shadow-Iconsrubeeiosicons_flat

Recursos para el Diseño con Sombra Larga

Long Shadow Generator

Long-Shadow-Generator

Long Shadows in CSS3

Long-Shadows-in-CSS3

Google Fonts CSS longshade Icon

Google-Fonts-CSS-longshade-Icon

Crear Sombras Largas en Photoshop

Conclusión

El diseño con sombra larga parece ser una evolución de la tendencia del diseño plano. Los diseñadores buscan crear más profundidad dentro del concepto del diseño plano y han creado un tipo de término medio con sombras largas.

La idea es divertida y agradable al usuario. La única cosa a tener en cuenta es crear sombras distintas y claras. Las sombras largas deben ser distinguibles y necesitas seguir el mismo patrón de luz, significando cada sombra dentro de un marco tiene que guardar el mismo grado y ángulo. Recuerda, las sombras están diseñadas para reflejar la luz y caerán en la misma dirección al mismo tiempo.

¿Estás trabajando en un proyecto que utiliza sombras largas? ¡Compártelo en los comentarios!

Desarrollador php especializado en convertir un buen café en código. Amante de JavaScript, Laravel y WordPress. Adicto a cualquier herramienta que acelere el desarrollo web. Sígueme en Twitter @zreedee.

Boletín de noticias

0 Comentarios

No hay comentarios aún

Deja tu respuesta

*
* Longitud mínima: 20 caracteres