Long shadows son las (relativamente) nuevas sombras que se extienden desde el objeto formando un ángulo de 45 grados y cuyo tamaño es de 2,5 veces el objeto. Esta tendencia se está usando actualmente entre los diseñadores gráficos y web viéndose como una evolución del estilo de los iconos tipo iOS 7. Fue Jeff Escalante el que acuñó este término.
Esta sombra viene a dar un poco de vida a una serie de iconos planos sin sombras ni texturas. La long shadow consigue una sensación de profundidad, pero aún mantiene la mirada plana del objeto. Es quizás una evolución continuista de la tendencia anterior, el Flat Design.
Podemos encontrar esta técnica en multitud de iconos para aplicaciones móviles y también en muchas webs y landing pages actuales. Una buena recopilación de estos efectos es el tablero de Pinterest de Pinterest de MMX Studio.
Crear el efecto long shadow:
Long Shadow en Photoshop, «automático» con los objetos inteligentes
Existen diversos archivos gratuitos en internet que nos facilitan la tarea de crear estas sombras. Se trata de ficheros PSD que podemos bajarnos y en los cuales sustituimos los objetos inteligentes que están a modo demostración por los nuestros:
- Long Shadow Generator es uno de ellos y ofrece una versión suavizada(Smooth) y otra de acabado afilado (Sharp).
- También es muy útil este otro Generador de Long Shadow que he encontrado en la web Graphic Burguer. Este permite elegir el ángulo de la sombra: 45 grados a la derecha o a la izquierda y es apto para cualquier tipo de capa de photoshop: texto, capa de forma o imagen rasterizada. Funciona también sustituyendo el objeto inteligente que trae de referencia por el nuestro.
- La opción que ofrece Pixeden para crear efectos Long Shadow ofrece cuatro variaciones de redondeo de la sombra resultante.
Crear el efecto Long Shadow a mano con Photoshop
Este efecto también se puede crear mano. Los mejores tutoriales que he encontrado explicando esta técnica son los de TutsPlus en su artículo 4 Ways para crear efectos Long Shadow con Photoshop
Crear el efecto Long Shadow a mano con Illustrator
Si prefieres hacer las sombras long shadow con Illustrator a mano y a tu gusto, también lo puedes hacer. En el blog de Awwwards nos recopilan varias técnicas para hacerlo, una con fusión y otro con el buscatrazos.
Acciones y extensiones para crear el efecto Long Shadow en Photoshop
También nos encontramos por la red descargables de acciones instalables para crear estos efectos en Photoshop. Os proporciono mi breve selección:
Generador de Long Shadow con CSS:
Long Shadows Generator es una herramienta online que nos ayuda a crear el efecto de sombras deseados gracias a unos controles a modo de slider y al final nos proporciona el código CSS generado que podemos copiar y pegar en nuestra hoja de estilos CSS.