En los últimos años la web se ha trasformado para dar una mejor experiencia al usuario, cada vez mas limpia y fácil de usar. Si hay una estética de diseño en particular que está apareciendo mucho en la web, es considerado como una tendencia. Para este 2014 se conservan algunas tendencias que vimos el 2013, y que a partir de estas se van creando otras tendencias en diseño, todo para hacer una web armónica y acorde a nuestro tiempo.
A continuación podrás ver un listado con las principales tendencias en diseño que veremos en la web durante el 2014 con algunos muy buenos ejemplos de este trend.
Flat Design
Sí se mantiene, luego que en el 2013 el diseño plano fuera una de las mayores tendencias que se crearon gracias tanto a la nueva interfaz de Windows 8 (finales del 2012) y la interfaz de sistema operativo de Apple IOS7.
El diseño plano deja de lado el Skeuomorphism o realismo en las imágenes web, es decir que se minimiza el uso sombras, degradados y texturas, entre otros elementos.
Sympathiediagnose
Lisa Gringl [Portafolio]
GO! EXPERIENCE DESIGN
Grandes areas en el home
Una de las tendencias en diseño web mas marcadas que se tienen para este 2014, son las grandes áreas de llegada en el home o Hero area. En esta área podemos ver la utilización de grandes imágenes, textos y también vídeos. Esta posición hace que genere mayor impacto al usuario a su llegada al sitio.
Con esta tendencia es comúnmente encontrar imágenes de fondo con baja opacidad, colores superpuestos, imágenes con efecto de desenfoque y vídeos.
Create Pilates
Prollective
The Hive — Storage to-go
Tipografías que no te aburren
En la web de ahora la tipografía esta tomando mucha mas atención, es un elemento que no pasa desapercibido y que siendo bien utilizada puede ser uno de los mayores puntos a favor en el diseño de una web.
Gracias a la popularidad de las web fonts y a la gran cantidad que podemos obtener (gratis), así los diseñadores van agregando mas fuentes a su arsenal. Con el uso de estas tipografías le añade un poco de personalidad y originalidad al diseño.
Aunque la tipografía es uno tema que se utiliza con precaución, para este año se vale que dejes volar tu imaginación y arriesgarse a utilizar las diferentes tipografías y dejes en otro lugar las fuentes comunes que ya aburren.
Swansea: Where bright futures begin
MC Solaar, Prose Combat
Richard Hill
Video (Background)
Un vídeo vale mas que mil palabras. Para que tanto texto cuando el usuario solo quiere ver.
El vídeo que se utiliza en el fondo con los elementos superpuestos o textos dan un efecto único, combina la atracción de un diseño elegante, con el movimiento y el dinamismo de un vídeo.
Siguiendo por el tema del vídeo, también se suele colocar vídeos explicativos en el área principal (hero). Los vídeos facilitan la explicación de muchas cosas, algunas que son difíciles de expresar con palabras propias. Ademas de eso los vídeos son fáciles de producir y compartir.
Leidgens piscines
Gran Turismo 6 | First Love
Olympic Story
Responsive Design
Cada día son mas los sitios que le apuestan al responsive design. Los diseñadores le apuestan cada vez mas a desarrollar sitios que funcionen de igual manera en los dispositivos móviles, un trabajo arduo tanto para diseñadores y desarrolladores, que trabajan de la mano en la creación de estos sitios webs adaptables que hacen de la web un lugar mas amigable.
El responsive design no solo se debe ver como una tendencia, sino como algo fundamental en el diseño web de ahora, se tiene que pensar en llevar el diseño web al siguiente nivel, al que se le pueda dar una solución móvil al usuario.
Crop the Block
Pivot Studio
Buru Buru
Largo Scrolling y/o Scrolling Infinito
Como usuarios somos tan perezosos que nos gusta encontrar todo en un solo lugar, solo debemos desplazarnos por el contenido de una sola pagina.
Los diseñadores han sabido aprovecharse de esto dándole mucho estilo a la pagina de llegada, ahora es muy visto encontrar sitios en donde puedes casi toda la navegación se hace en la misma pagina. Esta característica de scrolling la podemos ver de dos formas: en sitios que extienden su landing page y otros que presentan todo el contenido en la misma pagina y va cargando a medida que se hace scrolling.
Bueno o malo, cada quien tiene sus gustos, pero es algo de lo que veremos este 2014. Mira a continuación algunos ejemplos de sitios que utilizan de manera efectiva esta característica en su diseño.
Pi's Epic Journey: Creating the Unforgettable
Adidas originals Tumblr
TrueTube
Paletas de colores sencillas
Al hablar sobre las tendencias en diseño web, por supuesto también debemos hablar sobre el color. Para este año veremos en los sitios webs paletas de colores sencillas, y por sencillas se refiera a la utilización de 1 o 2 colores.
En 2014, vamos a ver mucho más de su sitio web con esquemas de color muy simples. Y por simple, quuiero decir en realidad sólo uno o dos colores.
La utilización de pocos colores viene de la tendencia del diseño plano, pero no en todas las veces esta relacionado con el Flat Design la simplicidad del web design hace que utilicemos menos colores hasta en algunos casos ningún color, usando el blanco y negro (colores neutros) obteniendo como resultado una web limpia, sencilla y elegante.
Angle - Flat Responsive Bootstrap MultiPurpose Theme
Theme kingdom
Starworks Artists
Sidebar que cae o desaparece
Para este 2014 veremos en algunos sitios webs que su barra lateral (sidebar) desaparece o en otras veces la vemos ubicada hacia la parte inferior del sitio, muchos ejemplos de la utilización los veremos en blogs y sitios webs personales, des esta manera el contenido produce un mayor impacto visual y el lector tiene menos distracciones y así ampliar el contenido del artículo.
Typostrate
The Lip
Happy 2014 | Tumblr Theme
Animaciones
Como pudimos ver en los anteriores puntos, las tendencias en diseño web se tornan muy sencillas, pero no debemos dejar que se vuelva algo aburridor. Por esto veremos muchas animaciones y/o efectos con los que podremos generar experiencias con el usuario. Ademas que con el uso del HTML5 las animaciones es mas sencillo animar ciertas partes de un sitio.
A continuación te muestro algunos ejemplos de sitios que utilizan de una buena forma las animaciones webs:
WinShape Camps
Henry Saiz
Bright Media
