Tendencias de diseño web a tener en cuenta en 2015

¡Es septiembre! Lo que significa que el otoño está aquí, los lattes con especias de calabaza están fluyendo y el final de 2014 está a la vista. Ahora podemos comenzar a ver las tendencias de diseño web de 2014 (hasta ahora) y hacer algunas predicciones sobre lo que tendrá poder de permanencia en 2015. Al menos eso es lo que planeo intentar en la publicación de hoy. Y, por supuesto, dado que Elegant Themes existe en la intersección del diseño web y WordPress, hablaré sobre cómo estas tendencias han impactado y afectarán a la comunidad de WordPress, desde los temas y complementos de WordPress existentes hasta las nuevas oportunidades que brindarán estas tendencias. ¡Entremos en ello!

1. Sensible o Ir a casa

Ok, quizás no tengas que ir a casa. ¿Quizás tienes una muy buena razón para no usar el diseño receptivo ? solo lo dudo En los últimos años, el diseño receptivo se ha consolidado como el nuevo estándar para el diseño web en general y los temas de WordPress en particular. Claro, todavía hay argumentos sobre la implementación , pero nadie dice, «deshagámonos del diseño receptivo» y, de hecho, cada vez más sitios optan por ir en esa dirección. Ese fue ciertamente el caso en 2014 y no buscaría que vaya a ninguna parte en 2015. Este ha dejado de ser una tendencia y ahora puede considerarse la nueva norma.

2. Botones fantasma

Los botones fantasma son una característica de diseño destacada en Divi , el tema principal aquí en Elegant Themes, y es fácil ver por qué. Son minimalistas, elegantes y con la sutil animación de desplazamiento, son una delicia para usar. Espere que esta tendencia continúe en 2015; especialmente teniendo en cuenta lo bien que se combinan con las imágenes de fondo grandes y los videos de los que hablaremos en el n.° 4.

3. Mayor énfasis en la tipografía

Imagen vía Paul Rand

Tradicionalmente, los kits de tipografía web que permitían el uso de hermosas fuentes y tipos de letra en los sitios web han sido costosos. Lo que significa que los sitios que se basan en gran medida en el diseño tipográfico tienden a requerir presupuestos más grandes, dejando a los pequeños (y a la mayoría de los usuarios de WordPress) fuera de la diversión. Eso sin embargo, está cambiando. Los kits tipográficos son cada vez más asequibles (o gratuitos en el caso de Google Fonts) y eso significa que los diseñadores que trabajan con un presupuesto más reducido tienen más libertad para llevar sus habilidades tipográficas a la mesa de diseño web. Además, esto permite a los diseñadores de temas de WordPress incluir más flexibilidad tipográfica en sus temas, lo que hace que cualquier persona con un tema de WordPress bien diseñado pueda lograr un diseño elegante centrado en tipos.

4. Imágenes y videos de fondo grandes y hermosos

Otro elemento básico de Divi que ha sido y seguirá siendo un gran éxito son las imágenes y videos de fondo grandes y hermosos. Una de las formas más sencillas de hacer que su sitio se destaque es tener un excelente contenido que se muestre de manera destacada. Esta tendencia es una manera maravillosa de lograr eso y cuando se combina con un estilo/filosofía de diseño más amplio, no se siente rebuscado sino poderoso y elegante.

5. Desplazarse sobre hacer clic

A medida que la web móvil continúa creciendo y el diseño web continúa sesgando hacia una experiencia móvil más efectiva y agradable, el desplazamiento seguirá dominando el clic. Es más intuitivo, más fácil de hacer, reduce los tiempos de carga y permite una interacción más dinámica entre el usuario y el sitio web.

6. El diseño de la tarjeta continuará (mejorará)

Imagen a través de Pinterest

El diseño de «tarjetas», aunque no es nuevo, ha demostrado ser una gran herramienta para los diseñadores que trabajan en sitios web receptivos. Las tarjetas son una excelente manera de mantener las cosas modulares, reorganizar las columnas sin que las cosas se vuelvan descuidadas o desorganizadas, para explorar una gran cantidad de datos generales, pero también para incitar a los usuarios a profundizar y ver más. En resumen, las tarjetas son limpias y simples con mucha versatilidad. Exactamente lo que la web necesita. Así que espere ver más en el resto de 2014 y a lo largo de 2015.

7. El diseño plano está creciendo (¿o el auge del diseño de materiales?)

Imagen a través de Google Design

El diseño plano ha alcanzado un gran impulso en los últimos uno o dos años y parece tener poder de permanencia en 2015. Sin embargo, es posible que, como concepto, el diseño plano esté creciendo. Tal vez en el diseño de materiales. Entonces, ¿qué es el diseño de materiales?

El diseño de materiales es algo que Google presentó este año como su nueva dirección para dispositivos móviles (y diseño en general). “Material”, para citar su resumen, “es la metáfora. Una metáfora material es la teoría unificadora del espacio racionalizado y un sistema de movimiento. Nuestro material se basa en la realidad táctil, inspirado en nuestro estudio del papel y la tinta, pero abierto a la imaginación y la magia”.

Fuera del lenguaje de marketing (e incluyendo la observación de que se han decidido por algo que de otro modo podría llamarse «diseño casi plano»), podemos ver que lo que los diseñadores de Google quieren decir cuando dicen que Material Design es un diseño mayormente plano que usa muy Gradientes sutiles, estratificación y animación para retener un sentido del mundo tangible (espacio físico y objetos) mientras se logran todas las ventajas del diseño plano. Algunos pueden estar en desacuerdo, pero personalmente, creo que es hacia donde se dirige el diseño plano en su conjunto y espero ver que más empresas e individuos lo adopten en lo que resta de 2014 y más allá.

8. Microinteracciones

Las microinteracciones son una buena tendencia para hablar después del diseño de materiales. ¿Qué son las microinteracciones? Son experiencias o momentos contenidos dentro de un producto (o quizás un módulo en un sitio web) que giran en torno a un caso de uso único. Un ejemplo de esto es el cuadro de registro de correo electrónico que aparece en este sitio web. Se mueve de un lado a otro en la pantalla, dando una personalidad lúdica a un gráfico estático. Esta microinteracción promueve un aumento en la participación del usuario; lo que en este caso particular significa más registros de correo electrónico. Buscaría esta teoría para impregnar aún más el diseño web en los próximos años. Me encantaría ver que más desarrolladores de plugins y temas de WordPress empiecen a pensar en este sentido. En particular, me gustaría ver complementos que no solo agreguen nuevas funciones a un sitio web de WordPress, sino que agreguen nuevas experiencias.

9. Narración interactiva

Imagen a través de The Guardian

¿Qué obtienes cuando juntas todo eso? Algo sobre lo que he escrito extensamente aquí en Elegant Themes: una mejor plataforma para contar historias y narraciones convincentes. Ahora, por supuesto, no me refiero a que cada página web tiene que contar un cuento de hadas, hilo u otra ficción. Eso no es lo que quiero decir cuando digo historia o narrativa. Lo que quiero decir es que su marca se compone de una serie de conceptos o valores (elegancia, creatividad, simplicidad, etc.) y todo, desde el diseño de su página hasta su elección de fuente, su copia web y los elementos de página microinteractiva son herramientas narrativas con las que puede contar historias que encarnan esos conceptos y valores mostrándolos en acción. Un ejemplo perfecto de esto es el sitio web de Tesla, del que hablo a continuación.

10. Experiencia de usuario personalizada

Imagen a través de Netflix

La idea de usar cookiespara ayudarlo a mostrar contenido más relevante para los visitantes habituales no es nada nuevo. Sin embargo, así como ciertas prácticas de spam (como la ventana emergente) han tenido un regreso más elegante con un mejor diseño y mejores prácticas, también se puede usar la técnica de usar cookies para mostrar cierto contenido para visitantes repetidos para algo más que spam y desvergonzado. venta adicional Netflix lo usa para recordar lo que has visto recientemente. YouTube también. ¿Sería tan extraño que un gran sitio editorial creara un widget de barra lateral «recientemente leído» para acceder rápidamente a los artículos que puede haber disfrutado y/o comentado? ¿O tal vez ocultar contenido visto recientemente para resaltar nuevas publicaciones/páginas? No lo creo y creo que veremos más usos de buen gusto de esta técnica en los próximos meses. También me encantaría ver que eso suceda más en la comunidad de WordPress a través de complementos.

Algunos ejemplos fantásticos

A veces, leer sobre todos estos conceptos de diseño puede hacer que sea difícil imaginarlos trabajando juntos sin problemas «en la naturaleza». Para ayudar a remediar eso, he reunido una breve lista de tres ejemplos que encarnan colectivamente todas las tendencias de diseño web que he mencionado en esta publicación.

1. manzana

No es necesario ser fanático de Apple para apreciar un buen diseño web. Algo que Apple siempre ha logrado con su sencillez característica y, sin embargo, continúa logrando exprimir un número notable de tendencias de diseño actuales y futuras. Si está buscando aprender pero no imitarlos, creo que lo que debe tener en cuenta no es que debe crear un sitio exactamente como el de ellos, sino copiar su insistencia en la sutileza para evitar que una tendencia parezca un truco.

Visitar sitio

2.Tesla

Uno de mis sitios web favoritos en este momento, no solo porque también amo sus productos, es el sitio web de Tesla. Combinan todas mis tendencias favoritas en una experiencia fluida. Me encanta especialmente su página Go Electric , que utiliza imágenes grandes, desplazamiento largo, infografías integradas y narraciones interactivas para explicar sus cinco preguntas frecuentes principales. Es un diseño brillante repleto de deliciosas microinteracciones que convierte una parte tradicionalmente aburrida de la mayoría de los sitios web en un escaparate asombroso.

Visitar sitio

3 . divide

Finalmente, tenemos un ejemplo que no debe ser babeado y soñado como irremediablemente fuera de nuestro alcance, sino algo con lo que podemos poner nuestras manos y trabajar. Divi es sin duda el mejor tema de WordPress para el usuario promedio con capacidad de codificación limitada (o nula) para lograr todas las tendencias cubiertas en este artículo en su propio sitio web de WordPress. Es posiblemente uno de los temas de WordPress más poderosos que he encontrado. El generador de páginas de arrastrar y soltar aprovecha los módulos interactivos para ayudarlo a crear páginas hermosas y efectivas de cualquier longitud. Y, por supuesto, gracias a su diseño receptivo, se ven y funcionan maravillosamente en cualquier dispositivo.

Ver tema

En conclusión

Las tendencias dominantes de 2014 parecen continuar en 2015, con algunas de ellas madurando (tal vez en la forma en que responsive pasó de ser una posible solución a un problema de diseño, a una tendencia, a un nuevo estándar). En este caso me refiero en particular al diseño de materiales y las microinteracciones. Esta última es la razón por la que no incluí el paralaje en esta publicación, ya que lo consideraría un tipo de microinteracción que puede desaparecer o no en el próximo año, pero cuyo concepto subyacente, sin duda, permanecerá y madurará.

En cuanto a lo que todo esto significa para la comunidad de WordPress, creo que veremos más temas siguiendo el ejemplo de Divi en la creación de formas más fluidas para que los usuarios que no codifican aprovechen estas tendencias de diseño. También creo que a medida que ciertas microinteracciones se vuelvan más populares en situaciones que tradicionalmente han requerido un desarrollo personalizado, la comunidad proporcionará soluciones llave en mano a través de complementos; como lo han hecho con varios complementos de formularios emergentes.

Sobre todo, creo que el futuro de estas tendencias se decidirá en función de hasta qué punto las impulsemos en los próximos meses. ¿Dónde encontraremos limitaciones que requieran refinamiento o tal vez ir en una dirección completamente nueva? Sé que estoy deseando ver cómo se desarrolla todo.

Sin embargo, si ya tiene algunas ideas o pensamientos sobre hacia dónde se dirigen las cosas en 2015 o mi opinión sobre las tendencias de diseño en esta publicación, ¡no dude en dejarlas en los comentarios a continuación!

Imagen en miniatura del artículo de Sergey Korkin / shutterstock.com