¿Tienes una tablet? ¿Un smartphone? ¿Ordenador? Si eres parte de la gran masa digital, conocerás el flat design, aunque a priori este nombre no te diga nada. ¿Por qué lo conocemos todos? Pues porque ahora mismo es la tendencia en diseño por excelencia en casi todas las páginas web, apps y plataformas actuales, como Facebook, Twitter, Instagram y muchas más de las que crees. Todas ellas están diseñadas con “flat design” o diseño plano.

Pero, ¿de qué va esto del Flat Design?

Existen numerosas tendencias en el mundo del diseño, la mayoría de ellas cíclicas. El diseño web experimenta ciclos aún más cortos, pero desde el año 2010 el flat design ha venido para quedarse una buena temporada.

Entonces, ¿qué es el flat design? Es tan sencillo como traducirlo: diseño plano. Podría resumirse en esto:

MENOS

• Detalles.
• Fotografías.
• Degradados o texturas realísticas.
• Diseños recargados.

MÁS

• Simplicidad y funcionalidad.
• Colores planos, vibrantes pero armónicos entre sí.
• Figuras geométricas.
• Iconos reducidos a lo mínimo.
• Sombras planas y alargadas, como las de un atardecer, pero sin perspectiva.
• Tipografías de palo seco o sin serifas.

En definitiva, trata de eliminar todo elemento no necesario, pero sin arriesgarse a perder su estética, con la intención de que el mensaje sea directo y la página web o app más funcional.

---

¿De dónde viene esta tendencia?

Microsoft fue el pionero al empezar a incluir trazos de este tipo de diseño en su sistema operativo Windows en el año 2010, seguido por la interfaz de Xbox en el 2011 y posteriormente el famoso Windows 8, todo un ejemplo de flat design. Google también se subió al carro en muchos de sus servicios, como Google+, Gmail, Google Calendar, etc.

Sorprende sin embargo que empresas que abogan por la simplicidad como Apple, quien siempre ha ido un paso por delante en cuanto a diseño de producto, no haya experimentado ese cambio tendencial a la par que sus competidores. Por su parte, Apple continúa con su estilo conocido como “Skeuomorphism”,  que consiste en imitar la realidad utilizando trucos como texturas, sombras, etc. Aun así, parece que el iPhone 6 empieza a dar señales de que finalmente la manzana se ha arrodillado ante la imparable moda del flat design.

Por lo que podemos ver, el flat design gusta al usuario, ya sea por estética, funcionalidad o ambas, con lo que ésta ha sido el camino a seguir hasta día de hoy.

---

Pros y contras del Flat Design

PRO:

Es un diseño que, como bien hemos dicho antes, parte de ser agradable a la vista, funcional en cuanto a soporte digital se refiere, y que inunda el mercado en todo tipo de plataformas con acceso a internet, cubriendo necesidades como la inmediatez y la rapidez. Precisamente el flat design es una herramienta que nace para cubrir este tipo de necesidades, aligerando los tiempos de carga.

Además, en una era en la que muchos de nosotros hemos cambiado nuestra enorme pantalla de ordenador por la de un teléfono móvil con un número muy limitado de píxeles, no podemos permitirnos mostrar aparatosas texturas y realísticos degradados esperando que respondan a nuestras expectativas visuales en apenas unas pulgadas.

CONTRA:

El flat design se presenta como una herramienta intuitiva, en la que a pesar de su simplicidad, se le sigue otorgando más poder comunicativo a las imágenes (iconos en su mayoría) que a las palabras. De manera que a nadie le resultará necesario que se le muestre un enorme botón con la palabra “buscar” al lado del campo de búsqueda, ya que bastará con que nos dejen caer la silueta de una lupa.

Esto no es un problema a priori, teniendo en cuenta que la gran mayoría de usuarios digitales se han criado con este tipo de lenguajes. Aun así, puede suponer un problema si esa reducción a la mínima expresión acaba perdiendo el significado. Muchas veces se hace realmente difícil saber qué tecla tenemos que tocar para que pase lo que queremos que pase.

---

6 recursos para diseñar en Flat Design

Si a pesar de todo te declaras un fan incondicional del Flat Design, o simplemente crees conveniente usarlo en ciertas situaciones, te facilitamos un poco las cosas. Ahí van unas cuantas webs donde encontrar todo lo necesario:

Flat UI

Si necesitas desarrollar una web o aplicación a rebosar de botoncitos, desplegables y sliders, esta página te ofrece un buen montón de ellos listos para usar, en diversos colores y buena calidad de gráficos.

Flat UI Colors

¿No tienes claro qué colores usar? He aquí una simple pero nada desperdiciable recopilación de colores muy «flat» en distintos formatos como Hex y RGB.

Flat Icon

Una de las páginas más completas de iconos, iconos y más iconos de cualquier cosa que se te ocurra. Puedes usar su buscador o navegar entre sus categorías. Todos ellos son descargables en distintos formatos, entre ellos vectoriales, con lo que su usabilidad se multiplica x1.000.

FreePik

Este aglutinador de recursos vectoriales (entre otros) es una buena fuente de diseños flat de todo tipo. Todos ellos son de descarga libre, así que no te cortes.

Fuentes interesantes para Flat Design

Los de The Neo Design se han currado un artículo en el que hacen una buena selección de fuentes de descarga libre que pueden ser utilizadas en un diseño plano y quedan de maravilla.

Fuentes para cada red social

Otra buena recopilación es la que nos ofrecen en Design Pieces. Fuentes utilizadas por las redes sociales más comunes, también de descarga libre.

---

Por último: ¿Se puede adaptar el Flat Design a formato para impresión?

Es difícil, pero no imposible. No debemos olvidar que esta moda nace para cubrir necesidades en el sector digital, aunque dada su aceptación social, a más de uno nos pica la curiosidad de usarlo para nuestros trabajitos sobre papel, ¿verdad? Pues bien, habrá que tener en cuenta un par de detalles.

En primer lugar, todos sabemos que las variaciones de color entre RGB y la limitada paleta de colores de CMYK pueden ser espantosas. Si a eso le añadimos que no todas las impresoras son capaces de reproducir los vibrantes colores que presentan nuestras pantallas, la esencia flat parece que se difumina. Si a esto le añadimos la complejidad de sacar colores perfectamente planos y limpios mediante impresión digital, nos encontramos con otra piedra más en el camino.

Si con suerte conseguimos sortear estos problemas y pasamos la prueba del algodón, nos encontraremos con que aquellas tipografías tan monísimamente finas y delgadas son completamente absorbidas por un fondo más oscuro que éstas. Esto es algo habitual contra lo que los impresores luchan cada día (y sí, también en Plagi), pero para lo que hay pocas soluciones, más allá de engrosar el perfil de la letra o usar una versión semi-bold o bold de la misma.

Por tanto, a no ser que seas un genio de la impresión, tal vez debas planteártelo antes de llevar el Flat Design a tus proyectos sobre papel. Aun así, si te atreves, puedes aplicarlo sobre infografías y otros tipos de póster, así como sobre el desarrollo de material corporativo (tarjetas comerciales, manuales, señalética…). Siempre podemos echarte un cable desde Plagi, así que ¡pregúntanos si tienes dudas!