Es fácil ponerse un poco esnob con las tendencias en las disciplinas creativas. Después de todo, no hay nada creativo o innovador en estar pendiente de «lo que se lleva», a menos que lo hagas precisamente para llevar la contraria.
Echa un vistazo a nuestra última publicación: 11 tendencias de diseño web atractivas para 2023
Pero la realidad es que la creatividad es una conversación.
Una conversación que viene de lejos, desde que aprendimos a recrear elementos de nuestro mundo con ocre y carbón en las paredes de las cuevas. Desde que aprendimos a convertir marcas abstractas grabadas en arcilla con palos en paquetes llenos de significado: es decir, el lenguaje.
Las tendencias son solo los hilos conductores de esa conversación extensa, caótica y polifónica. Tanto si decidimos adoptarlas como si las resistimos, nuestras decisiones creativas existen junto a ellas.
Aportan contexto. Porque, ¿qué es la innovación si no una ruptura con lo normativo? Y, ¿qué es lo normativo sino las tendencias del año pasado?
Así que, igual que el año pasado, me senté con el brillante equipo de diseño de Webflow y les pedí que miraran en sus bolas de cristal de realidad virtual para ver qué definirá el diseño en 2018.
Esto es lo que opinan Sergie Magdalin, Ryan Morrison, Linsey Peterson, Nathan Romero y Darin Dimitroff. (Junto con algunas de mis propias reflexiones, por supuesto).
1. Diseños de cuadrícula rota
En la búsqueda incesante de los diseñadores por lograr diseños más creativos y atractivos, la cuadrícula en la que siempre hemos confiado para aportar armonía y lógica se ha convertido en una especie de limitación.
Esto no significa que los diseños de cuadrícula rota abandonen el concepto por completo; al contrario, permiten que las imágenes y los elementos de texto se deslicen hacia y a través de los espacios que normalmente sirven como límites estrictos en diseños más sobrios. Aquí, las habituales cajas discretas de imágenes y texto empiezan a solaparse y converger, creando a menudo yuxtaposiciones inesperadas y hermosas entre mapas de bits y tipografía.
2. Las ilustraciones cobran protagonismo
Uno de los retos más interesantes que he presenciado en el mundo del marketing de productos digitales es la selección de imágenes. He visto a equipos de diseño enteros darle vueltas al debate, que suele terminar en uno de estos dos puntos:
- Capturas de pantalla de la interfaz del producto y GIFs
- Fotografía editorial o de estilo de vida
Lo primero enfatiza la experiencia dentro del producto, sus características y funcionalidad, mientras que lo segundo intenta resaltar la dimensión humana del producto: el efecto que tiene en la vida de las personas.
Pero de cara a 2018, estamos viendo —y seguiremos viendo— cómo el trabajo de los ilustradores alcanza un nuevo nivel de relevancia tanto en el marketing como en el diseño de productos.
Me fascina el porqué de todo esto, aunque no sabría decirte exactamente qué es. Quizás sea simplemente el mismo ciclo que llevamos tiempo observando en el mundo de la moda; al fin y al cabo, la ilustración dominó la publicidad hasta finales de los años 60.
O tal vez el equipo de diseño de Dropbox dio en el clavo con esta explicación sobre su nuevo estilo de ilustración:
Creamos bocetos a lápiz y los combinamos con formas abstractas y coloridas para dar vida al proceso creativo. Nuestro estilo se inspira en ese momento en el que surge una idea y sirve para recordar que «el lienzo solo está en blanco hasta que haces el primer trazo».
Es decir… tenían que haber dado en el clavo con este rediseño, ¿no?
Las ilustraciones también pueden ser muy potentes para dar vida a conceptos abstractos, como se puede ver en el sitio Polaris de Shopify. Con un solo dibujo, Shopify aclara que su sistema de diseño Polaris pretende servir como luz guía —una estrella polar— para cada miembro del equipo.
Por último, cabe destacar que las ilustraciones también pueden resolver con elegancia algunos de los problemas de representación que plantea la fotografía.
Creamos productos digitales para una variedad asombrosa de seres humanos, pero en el momento en que haces una foto a una persona real y la pones en la cabecera de tu web, esa persona personifica a tu usuario. Y deja a todos los demás sin representación.
En cambio, la persona ilustrada en la cabecera de Shopify Polaris es simplemente un ser humano. Rasgos como la raza, el género, la nacionalidad y muchos otros quedan indefinidos, lo que nos facilita a cualquiera proyectarnos en el papel de ese pensador solitario que contempla las posibilidades creativas iluminadas por una luz guía.
3. El brutalismo llega al gran público
A principios de 2017, publicamos un artículo sobre el auge del brutalismo e intentamos responder al porqué de este estilo emergente:
El brutalismo... abre un espacio donde los diseñadores pueden hacer lo que quieren, en lugar de lo que deberían. Las obras creadas aquí evitan todos los consejos de optimización y las listas de mejores prácticas en favor de aspectos y efectos que viven en lo discordante y que, a veces, rozan lo ofensivo (al menos para las expectativas).
Así que podéis imaginar nuestra sorpresa cuando, de entre todos los tipos de sitios, dos tiendas online se subieron al carro del brutalismo:
Balenciaga
Gucci
4. Formas más orgánicas y oblicuas
La naturaleza aborrece la línea recta.
–William Kent
Tanto el diseño web como el móvil han estado dominados por interfaces basadas en tarjetas durante varios años. Hasta hace poco, la mayoría de esas tarjetas tenían bordes (más o menos) afilados y ángulos rectos, dejando al descubierto la geometría de sus divs subyacentes con una preocupación casi modernista por los materiales del diseño web.
Eso ha cambiado radicalmente en 2017. Ahora, todas las aplicaciones, desde Google Now hasta Twitter o Facebook, presumen de esquinas agresivamente redondeadas en sus tarjetas, cuadros de texto, avatares de perfil y mucho más.
Y no son solo esos elementos principales los que adoptan formas más orgánicas. Los fondos ahora rebosan de manchas de color casi ameboides, diagonales dramáticas e incluso pinceladas del mundo real representadas de forma casi caricaturesca.
Pero los diseñadores no solo recurren a las curvas orgánicas en su búsqueda incesante de formas de salirse de lo convencional. Muchos simplemente le dan un giro a esas cajas, sacándolas de sus ángulos habituales de 90°, refrescando sus diseños con un simple cambio de perspectiva, como en la página de inicio de Stripe.
Esto no quiere decir que los ángulos rectos vayan a desaparecer. También hemos visto varios sitios que apuestan por las líneas rectas y las combinan eficazmente con formas más orgánicas y esféricas.
También notarás la aparición de colores "parpadeantes" o "vibrantes" en muchas interfaces de usuario web. Aunque estas combinaciones de colores crean efectos increíblemente llamativos —incluidas imágenes fantasmales que parecen quedarse grabadas en tu vista mientras haces scroll—, vale la pena señalar que representan un terreno pantanoso desde la perspectiva de la accesibilidad.
Aunque solemos pensar en la accesibilidad como la forma de hacer que un diseño sea fácil de usar para personas con discapacidad, conviene recordar que incluso quienes tienen una visión cromática normal pueden tener dificultades con combinaciones de colores estridentes.
Según Jennison Asuncion, gerente de ingeniería de accesibilidad de LinkedIn, la accesibilidad puede definirse como:
Diseñar y desarrollar interfaces de usuario que todos, incluidas las personas con discapacidad, puedan consumir e interactuar de forma independiente.
Ese todos es la clave.
5. Interacciones y animaciones aún más omnipresentes
El medio es el mensaje.
–Marshall McLuhan
La web no es un medio estático. A pesar de la belleza y la verdad perdurables de piezas como "This is a web page" de Justin Jackson, la web permite mucho más que simplemente imprimir palabras en una página. Y si el famoso adagio de McLuhan tiene algo de cierto, significa que al menos parte del mensaje de la web —su significado— reside en su capacidad de movimiento e interactividad: la habilidad de una página web no solo para presentarnos información, sino para hacer que esa información se mueva y, lo que es más importante, para permitirnos interactuar con ella e influir en ella.
Cada vez más, a medida que navegas por la web, la información no solo se presenta para tu aprobación, sino que se desliza hacia tu campo de visión, llamando la atención pieza por pieza.
Obviamente, no deberíamos pasarnos de la raya: siempre existe la posibilidad de que las animaciones conviertan experiencias que de otro modo serían agradables en algo abrumador, especialmente para personas con discapacidades cognitivas o sensibilidad al movimiento.
Pero si se hace bien, incluso una animación sutil puede dirigir la atención del visitante al contenido adecuado en el momento justo, ayudando a garantizar que no se pierdan líneas de texto vitales o un formulario que impulse las conversiones.
Mira este magnífico sitio que Heco Partners creó para la agencia Black Sheep. A medida que bajas, el resaltado de la línea "actual" te ayuda a mantenerte concentrado en el texto, que está muy bien escrito. Luego, una serie de tooltips diseñados con audacia empiezan a competir por tu atención con el texto, pidiéndote a gritos que dejes de leer y hagas clic para ir a otra página. Es una solución creativa al desafío de crear un sistema de navegación integrado, pero también puede añadir una tensión innecesaria a la experiencia para algunos usuarios.
También estamos viendo surgir un montón de herramientas para simplificar la creación de animaciones e interacciones más complejas —algo que durante mucho tiempo fue una carencia en el kit de herramientas del diseñador digital—, desde nuestras propias Interactions 2.0 hasta Lottie de Airbnb.
Más concretamente, esperamos ver más de dos patrones de animación en particular: velocidades de scroll inusuales y transiciones de página.
Velocidades de desplazamiento inesperadas
Puede que el efecto parallax esté pasado de moda, pero eso no significa que a los diseñadores no les interese vincular el desplazamiento con el movimiento de los elementos de formas fascinantes.
Tomemos como ejemplo el sitio de Anna Eshwood. Cada foto funciona con normalidad hasta que pasas por encima, momento en el que ascienden rápidamente, a una velocidad mayor que la de tu desplazamiento. Esto le da al sitio un aire etéreo muy interesante que combina a la perfección con sus fotos austeras y monocromáticas y sus modelos de aspecto serio.
A medida que las interacciones y las animaciones se vuelven una parte aún más importante de nuestras experiencias digitales, podemos esperar ver más toques de lo inesperado para darle un poco de chispa al asunto.
Transiciones de página
En una web llena de animaciones hermosas con el potencial de decirnos claramente que "algo ha cambiado en esta página", siempre ha resultado un poco extraño que pasar de una página a otra se sienta prácticamente igual, sin importar en qué sitio web estés.
Una animación de cambio de estado puede alejarte de una página y otra recibirte en la nueva, pero son elementos discretos, sin nada que los conecte necesariamente. La transición en sí se ve como cualquier otro cambio de página: todo se queda en blanco un segundo y luego carga la nueva página. Nada del otro mundo.
Pero estamos empezando a ver cada vez más sitios que hacen de ese cambio de estado algo hermoso de contemplar. Tomemos como ejemplo estas transiciones en el sitio de la agencia 3drops:
Aquí, la transición de página mantiene la experiencia cohesionada y fiel a la marca. No es tanto que estés "navegando a una página nueva", sino que estás accediendo a otra "vista" dentro de una biblioteca de vistas. Es un toque de elegancia que redondea la presentación de una marca centrada en el diseño.
6. El surgimiento del maximalismo
Un buen diseño es el mínimo diseño posible
–Dieter Rams
Durante años, parecía que el comentario de diseño más potente y codiciado que podías recibir era: "es limpio".
Ese era el mundo del diseño en la era del minimalismo. Profundamente influenciados por los principios del buen diseño de Dieter Rams, así como por el influyente ensayo sobre tipografía "La copa de cristal", los diseñadores visuales han buscado durante mucho tiempo no estorbar al usuario, ofreciendo la menor cantidad posible de opciones y distracciones visuales.
Y para un mundo donde vivir en lo digital era una experiencia nueva y poco común, esa elección tenía mucho sentido. Necesitábamos que nos introdujeran poco a poco en este extraño mundo nuevo.
Pero hoy tenemos sitios como los siguientes —que, aviso para navegantes, podrían causar convulsiones—:
Pin-Up Magazine
H. Lorenzo
Razzle Dazzle Torino
Todos ellos parecen esforzarse por lanzarte absolutamente todo lo que tienen desde el momento en que llegas.
Podrías llamar a esto una variante del brutalismo —de hecho, encontré todos los sitios anteriores en Brutalist Websites—, pero creemos que podemos esperar ver más sitios maximalistas surgiendo incluso fuera de lo que considerarías brutalista. A medida que todos nos volvemos más expertos en el mundo digital, es natural que algunos sitios esperen más de sus visitantes.
7. Las fuentes con remates pisan fuerte
En los viejos tiempos de las pantallas que no eran retina y la escasa compatibilidad con fuentes, limitarse a las fuentes sans serif en las interfaces web tenía mucho sentido. Pero a medida que tanto las pantallas como las tecnologías de renderizado de fuentes —por no hablar de la compatibilidad con fuentes personalizadas— se vuelven más robustas, empezamos a ver cómo tipografías cada vez más elaboradas ocupan el centro del escenario. O, al menos, desempeñan papeles secundarios mucho más destacados.
Un ejemplo es el reciente rediseño de Kickstarter, que incluye citas destacadas de creadores con una fuente serif de curvas suaves:
O los grandes y llamativos titulares de Reform Collective:
Mientras que un vistazo a Typewolf casi cualquier día revelará varias fuentes serif robándose el protagonismo:
Como fanático desde hace mucho tiempo de las fuentes serif y su capacidad para evocar sentimientos de elegancia, refinamiento y pulcritud literaria, doy la bienvenida a nuestros nuevos señores con remates.
8. Menús de navegación flotantes
La navegación fija se ha convertido en un pilar de los sitios que están enfocados en la conversión (porque la llamada a la acción principal puede acompañarte mientras haces scroll) o que tienen menús extensos. Es una buena forma de simplificar la experiencia de un sitio manteniendo los controles de navegación constantemente al alcance de la mano del usuario.
Últimamente, vemos que los diseñadores llevan la idea un paso más allá al separar visualmente la navegación del resto del diseño del sitio y moverla un poco por debajo del marco del navegador. Esto refuerza la sensación de que la navegación es un objeto global, no necesariamente parte de una página específica, sino algo que está ahí para acompañarte de forma tranquilizadora por todo el sitio.
La forma más obvia de lograr esto visualmente es añadir una sombra paralela a la barra de navegación y moverla un poco por debajo de la parte superior del sitio, como se ve en el sitio de Reseau mencionado arriba. Pero también es posible en un diseño más plano, como puedes ver en el sitio de Anchor & Orbit.
Al igual que los diseños fuera de cuadrícula, esto permite que surjan yuxtaposiciones interesantes de forma natural (o intencionada) dentro del diseño, lo que supone un divertido desafío creativo.
9. El elemento <video>
Cuando intentas transmitir información compleja en un formato visual, una imagen estática a menudo no es suficiente. Después de todo, la complejidad tiende a desarrollarse con el tiempo: una imagen fija de una interfaz solo te dice qué hay en ella, no cómo usarla.
Aquí entra en juego el elemento <video>.
Esto es potente por varias razones:
- Puede integrarse perfectamente en el diseño, sin la intrusiva interfaz de un vídeo incrustado de YouTube o Vimeo
- Mantiene una calidad extremadamente alta, incluso con muchos colores, degradados y detalles en la imagen, algo que a los GIF les cuesta lograr sin aumentar exponencialmente su tamaño
- Se puede configurar en bucle para garantizar que los detalles del texto y los de la imagen permanezcan sincronizados, y repetirse para quienes lo necesiten
Así que no es de extrañar que estemos viendo el elemento de vídeo aparecer por toda la web, desde nuestra propia página de inicio hasta páginas destacadas como Stripe Sigma.
Qué buscar en un servicio de alojamiento web
Hay muchísimas opciones de alojamiento web, pero ¿cómo saber qué funciones priorizar? Descubre por qué el alojamiento de Webflow puede ser tu pareja ideal.
10. Contenido de formato largo más inmersivo y «multimedia»
Cuando buscamos publicar contenido de formato largo, puede ser tentador simplemente soltar un campo de texto extenso en la página y darlo por terminado, especialmente cuando nuestro contenido se gestiona mediante un CMS, donde un diseño único hace todo el trabajo pesado para textos que van desde breves reseñas de 200 palabras hasta tutoriales detallados de la extensión de un relato corto.
Pero algunos diseñadores y escritores están resistiendo heroicamente a esa tentación y volviendo al concepto de los reportajes especiales: combinan diseños personalizados con textos cuidadosamente adaptados a la presentación para contar historias largas y fascinantes que enriquecen la narrativa con vídeo, sonido, gráficos, mapas y mucho más.
Para ser justos, esta no es una tendencia «nueva» —de hecho, yo la llamaría una piedra angular de la conversación sobre la publicación web—, pero con todas las herramientas que están surgiendo ahora, nosotros incluidos, parece el momento perfecto para que esta faceta cobre aún más protagonismo en 2018.
Tomemos como ejemplo este reportaje de la CNN sobre el impacto del calentamiento global en Groenlandia y el resto del mundo.
La historia logra transportarte al lugar casi literalmente. Esto es vital para un problema que a demasiada gente le sigue pareciendo abstracto, o incluso irreal. Además, convierte con inteligencia un tema complejo en una serie de párrafos fáciles de digerir. Nunca te sientes abrumado por la cantidad total de contenido, porque no llama la atención sobre sí mismo. Al contrario, te descubres leyendo cada palabra porque es tan condenadamente fácil y absorbente.
Ten en cuenta que no estoy criticando a los CMS: de hecho, es posible ofrecer este tipo de experiencias a través de ellos. Solo hace falta un poco de ingenio —todos los elementos visuales de este reportaje pueden incluirse mediante imágenes y vídeos de fondo— y prestar mucha atención a la coherencia entre historias mientras las escribes, diseñas y desarrollas. Y sí, también hace falta un modelo de contenido que se diferencie de las típicas «entradas de blog».
Vale la pena señalar que estos enfoques más diversos del formato largo pueden jugar tanto con una retícula rota como con una columna estándar, como se ve en el artículo del New York Times mencionado arriba.
11. ¡Fuentes variables!
Al observar la web actual, cuesta creer que hace solo unos años estuviéramos obligados a depender de un puñado escaso de tipos de letra para presentar todo nuestro contenido textual.
Hoy en día, la web rebosa de una enorme diversidad de tipos de letra magníficos, lo que ha llevado a niveles revolucionarios de interés por la tipografía, el diseño de fuentes y el buen consumo ostentoso de siempre: el de las fuentes.
Y la cosa solo va a mejorar con la llegada de las fuentes variables. Este proyecto conjunto entre los nombres más importantes de la tecnología (y la tipografía) —Apple, Google, Microsoft y Adobe— permite una forma totalmente nueva de diseñar tipos de letra. Al ser oficialmente una adición al formato OpenType, permite:
que los diseñadores de tipos interpolen todo el conjunto de glifos de una fuente o glifos individuales a lo largo de hasta 64 000 ejes de variación (grosor, anchura, etc.) y definan posiciones específicas en el espacio de diseño como instancias con nombre («Negrita», «Condensada», etc.).
Si (como a mí) esa frase te deja un poco rascándote la cabeza, céntrate en la versión mucho más directa de John Hudson, quien dice que una fuente variable es:
Un único archivo de fuente que se comporta como si fueran varias fuentes.
Pero quizás, al hablar de un arte visual como el diseño de letras, lo mejor sea quedarse con lo visual:
Eso son las fuentes variables en pocas palabras: un único archivo de fuente capaz de pasar de «fina» a «negrita» en un abrir y cerrar de ojos. Sin tener que llamar a 16 fuentes diferentes en tu CSS.
Va a ser algo grande.
12. Los centros de contenido, ¿o deberíamos decir «webooks»?, se ponen de moda
(Para que quede claro: el contenido siempre ha sido genial. 😎)
Como fanático del contenido, me ha emocionado ver un montón de sitios web preciosos y centrados en el contenido que han servido raciones generosas de información útil y bien redactada en 2017. Y me da que veremos muchos más en 2018, visto el éxito que ha tenido la cosecha de 2017.
También ha sido fascinante ver cómo muchas marcas líderes abandonan el típico formato de PDF cerrado para distribuir libros electrónicos y aprovechan al máximo el potencial de la web para publicar contenido extenso en lo que me gusta llamar «webooks».
¿A qué me refiero? Pues a esto:
Stripe Atlas Guides
Airtable Universe.
DesignBetter.co
Intercom Books
Nuestro propio sitio de libros electrónicos.
¿Hace falta que siga?
13. ¡CSS Grid!
Como Robin Rendle explicó con tanta elocuencia en CSS-Tricks:
Bueno, CSS Grid es el primer sistema de diseño real para la web. Está pensado para organizar el contenido tanto en columnas como en filas y, por fin, otorga a los desarrolladores un control casi divino sobre las pantallas que tenemos delante.
Risa malvada.
Nota: Webflow será compatible con CSS Grid, pero aún no hay una fecha oficial.
14. La búsqueda de la herramienta de diseño digital perfecta
2017 fue un año importante para debatir a fondo sobre la naturaleza de las herramientas de diseño y lo bien que se adaptan a nuestro trabajo.
Bryn Jackson, de Spectrum, defendió su postura sobre:
Un formato intermedio entre las herramientas de diseño y las de ingeniería para permitir herramientas más eficientes y capaces para los equipos de producto en general, y para los diseñadores en particular.
En un artículo titulado, simplemente, “Interface”. Continúa planteando que “todas las herramientas de diseño populares disponibles hoy en día están optimizadas para la ilustración”.
(Aunque cabe señalar que él clasifica como “ilustración” cualquier trabajo de diseño que resulte en “una imagen, icono, ilustración, tipografía, anuncio, medio impreso o cualquier otro medio de comunicación visual sin interactividad nativa”, lo cual es una afirmación discutible. ¿Acaso leer y ver no son formas de interacción?)
Dejando de lado las preocupaciones sobre las definiciones de ilustración e interactividad, no es difícil entender el punto de Jackson: básicamente, la mayoría de las herramientas de diseño modernas se obsesionan con la producción de imágenes, no de interfaces.
El diseñador e ingeniero Adam Michela tocó muchos de estos mismos puntos en “Soy diseñador en Facebook y esto es lo que falta en las herramientas de diseño actuales”. Allí, argumenta que la mayoría de los diseñadores pasan la gran mayoría de su tiempo creando artefactos de poco o nulo valor tangible porque simplemente representan el producto final: las interfaces digitales que rápidamente se desvían de dichas representaciones.
Termina el artículo con una nota esperanzadora, diciendo que “existe la oportunidad de crear herramientas que combinen (en lugar de tender puentes entre) el diseño y la implementación”.
Que es exactamente lo que estamos tratando de construir aquí en Webflow. Al igual que Michela, imaginamos un entregable de diseño que no sea un esquema de un sitio web, sino que sea el sitio web en sí mismo. No una documentación de la interfaz, sino la interfaz misma. Evolucionando constantemente en perfecta sincronía con el sitio, pero generando continuamente una línea de tiempo de versiones que pueden revisarse e incluso restaurarse con el clic de un botón.
Todavía no hemos llegado a ese punto, pero con tu ayuda, esa es la dirección en la que nos movemos.
15. La diversidad y la inclusión como desafíos de diseño
Webflow es un empleador que ofrece igualdad de oportunidades. Nos dedicamos a construir un equipo donde la diversidad, tanto en ideas como en identidades, no solo sea bienvenida, sino fomentada.
– Nuestras ofertas de empleo
Aquí en los Estados Unidos, donde tiene su sede Webflow, un clima político cada vez más tenso está impulsando un enfoque intenso en el papel de la diversidad y la inclusión en el diseño.
Reconocemos que decisiones de diseño tan aparentemente pequeñas como decidir qué opciones incluir en los menús desplegables de género —o incluso incluir menús desplegables de género en absoluto— importan profundamente a muchos de nuestros semejantes. Estamos viendo —una vez más— lo poderosos que pueden ser la redacción de los mensajes de error y la mecánica de la validación de datos en la dinámica de las interacciones humano-computadora. Nos estamos dando cuenta de que hacer de la raza un filtro en las herramientas publicitarias puede tener efectos francamente racistas y, por lo tanto, mantener las relaciones de poder existentes que a muchos de nosotros nos encantaría ver derribadas.
Y nos estamos dando cuenta de que si nuestros equipos no son diversos e inclusivos, nuestras soluciones de diseño tampoco pueden serlo.
A algunos de nosotros, al menos.
Por otro lado, también estamos viendo cómo el sesgo de género muestra su cara más fea de formas obviamente contradictorias y marginadoras, convirtiendo conversaciones que solemos considerar mayormente virtuosas, como dar retroalimentación, en ejemplos flagrantes de doble rasero.
En última instancia, como profesionales de la experiencia de usuario (UX), nuestro trabajo es proporcionar a todos, independientemente de sus particularidades, una experiencia utilizable e idealmente agradable.
En otras palabras: nuestro trabajo consiste en la inclusión. Hagamos de 2018 el año en que todos nos enfoquemos en hacer nuestro trabajo al máximo.
16. El “giro hacia el video” continúa
A pesar de que prácticamente ninguno de nosotros está clamando para que el video se convierta en el medio de publicación web de moda, los editores siguen siendo increíblemente optimistas sobre el cambio.
Lo ves en todas partes: desde sitios de noticias que prácticamente insisten en que veas el vídeo en lugar de leer, hasta las «historias» de formato corto impulsadas primero por Snapchat, luego por Instagram y, finalmente, por Facebook. ¡Seguro que Excel se subirá al carro pronto!
Pero, como ocurre con la mayoría de las cosas en el mundo tecnológico, este no es un cambio neutral. Miles de periodistas han perdido su empleo en este giro del texto hacia la imagen en movimiento.
Y puede que las perspectivas tampoco sean muy halagüeñas para los sitios que están haciendo el cambio. Según la Columbia Journalism Review:
Los editores que se pasaron al vídeo han perdido a la mayoría de sus audiencias nativas, ganadas con tanto esfuerzo, en solo un año de producir fragmentos de vídeo insípidos, indiferenciados y, en gran medida, agregados para un consumo rápido.
El periodismo independiente sufre de todos modos —gracias, Trump—, pero el paso al vídeo no ha ayudado precisamente.
Una nota positiva: según Digiday, «los CPM de vídeo son mucho mayores que los CPM de display» (siendo el CPM el «coste por mil impresiones»). En un mundo ideal, eso significaría que los periódicos podrían permitirse incluir menos anuncios en sus artículos.
Pero, por supuesto, eso no va a ocurrir.
Ante todo esto, merece la pena recordar las fortalezas del texto como medio creativo e informativo:
- Es relativamente rápido de producir
- Es barato
- Sigue siendo el formato principal de la mayor parte de la comunicación en la web
Puede que ese último punto te haga rascarte la cabeza. Pero te animo a que entres en cualquier red social importante y eches un vistazo. A menos que estés en Instagram, Pinterest o Snapchat, lo más probable es que veas un montón de texto. E incluso en esas plataformas centradas en lo visual, el texto sigue desempeñando un papel de apoyo fundamental.
Porque, aunque una imagen pueda «valer más que mil palabras» a la hora de captar una escena, rara vez capta el contexto: el quién, qué, cuándo, dónde, por qué y cómo que dan sentido a las imágenes.
Lo cual nos lleva de forma natural al siguiente punto:
17. El auge del redactor de UX continúa
Cualquiera que influya en el resultado final del diseño es un diseñador. Esto incluye a desarrolladores, gestores de proyectos e incluso al departamento legal de la empresa. Todos son diseñadores.
–Jared Spool
Ya hablé un poco de esto en el artículo sobre tendencias de diseño del año pasado, pero hoy me gustaría centrarme aún más en el auge de la disciplina conocida como «redacción de UX».
En pocas palabras, un redactor de UX se centra en el contenido que se encuentra dentro de las interfaces de usuario, principalmente para grandes productos digitales y aplicaciones web. Ahora bien, cuando he explicado que escribo contenido dentro del producto para empresas como Webflow y, en el pasado, LinkedIn, la gente tiene una tendencia sorprendente a decir: «¿qué?»
Pero ten por seguro que las interfaces de usuario están repletas de contenido escrito. Y ese contenido suele desempeñar un papel clave para que entiendas:
- Qué puedes hacer dentro de una interfaz
- Cómo hacer esas cosas
- Qué limitaciones y complejidades podrías encontrar en el camino
Pero la redacción de UX puede hacer mucho más que eso. Las palabras dentro de una interfaz también pueden ser una herramienta poderosa para moldear la percepción de las marcas detrás de nuestras interfaces favoritas. Solo piensa en todos los tuits que has visto destacando un texto divertidísimo en una aplicación web, o en todas esas páginas de error 404 con mensajes ingeniosos diseñados para incitar a la acción en un momento poco ideal.
Esto se vuelve más evidente en el formato de interfaz conocido como chatbot. Por lo general, estas interfaces no consisten más que en palabras. Las palabras se convierten en la interfaz. La personalidad —o marca— del chatbot solo puede expresarse a través del lenguaje. Quizás con un par de emojis bien elegidos para darle un toque especial.
Como redactor de UX con experiencia, me emociona mucho ver que este rol fundamental recibe el reconocimiento que hace tiempo merecía.
Nosotros también somos diseñadores. Solo que trabajamos con sílabas y formas de letras. Estamos deseando trabajar contigo.
18. Diseño. Sistematizado.
Ahora que el diseño se ha ganado su "lugar en la mesa", la conversación ha dejado de centrarse en justificar su valor para pasar a un análisis más maduro sobre cómo hacer que los éxitos del diseño sean más sistemáticos, escalables y coherentes en todos los entornos y productos de una marca.
Los sistemas de diseño se enfocan en traducir la estética y el enfoque funcional de una marca en componentes modulares que pueden combinarse para satisfacer (idealmente) las necesidades únicas de cualquier interfaz. Cuando un lenguaje de diseño se sistematiza, se simplifica la toma de decisiones, se reducen los tiempos de desarrollo y se libera a los diseñadores para trabajar en proyectos de mayor perfil donde aún no se han establecido patrones de diseño.
Y las marcas, como de costumbre, están al tanto de la tendencia. UXPin lanzó Systems, una herramienta para crear y mantener sistemas de diseño. Shopify lanzó Polaris, que recibió grandes elogios por su fusión única de pautas de contenido, diseño y desarrollo (algo que me apasiona bastante). UX Power Tools lanzó una biblioteca que intenta hacer de Sketch una herramienta viable para sistemas de diseño (¡ya veremos!).
Espera ver mucho más de esto en 2018.
19. Diseño basado en principios
El mundo del diseño ha estado obsesionado durante mucho tiempo con uno de esos debates sobre qué fue antes, si el huevo o la gallina: ¿el contenido primero o el diseño primero?
Siempre he estado del lado del contenido primero. Y no solo porque sea un "tipo de contenidos". Para mí, parece pura lógica definir el mensaje antes de decidir cómo empaquetarlo.
Pero últimamente, a medida que me he alejado del diseño de estrategias de contenido para entregables específicos hacia un trabajo más orientado a sistemas (estrategias de contenido a nivel de marca), me estoy convenciendo de que nuestro trabajo no debería empezar ni por el diseño ni por el contenido.
Debería empezar por los principios.
Todo lo demás —cómo se ve, cómo funciona, cómo suena— debería fluir y depender de un conjunto de principios bien definidos y articulados con precisión.
O como dijo Amy Thibodeau, líder senior de UX en Shopify, en su excelente artículo “Locating Polaris”:
Si el sistema se crea para facilitar el trabajo real, debería reflejar cómo una organización hace las cosas y qué valora. Un sistema de diseño que no incluya nada sobre principios, o sobre un enfoque de contenido, por ejemplo, puede no priorizar la reflexión sobre esos aspectos en el día a día práctico.
Los principios ofrecen un marco de referencia para cualquier toma de decisiones, desde la extensión del texto en la cabecera hasta qué imagen sirve de fondo para el contenido. Al fin y al cabo, las marcas se basan en principios: una misión, una visión y una promesa. Cada uno de estos elementos requiere creencias subyacentes que les den vida y los hagan relevantes para los demás.
En otras palabras: los principios proporcionan el porqué.
Por ejemplo: en Webflow, nuestra misión es capacitar a diseñadores, emprendedores y profesionales creativos para que hagan realidad sus ideas en la web. Esa misión impregna todo lo que hacemos, desde el enfoque estético que Ryan creó para nosotros hasta las normas de voz y tono que he diseñado.
Y son esas normas las que guían nuestros borradores, fundamentan nuestras opiniones mutuas y, con suerte, impregnan cada entrada de blog, correo electrónico, página de marketing, etc. Hasta ahora, es un punto de partida fantástico.
¿Qué crees que nos deparará el diseño digital en 2018?
Cada vez que preparo una de estas listas, me abruma la cantidad de cosas de las que podría hablar, y cómo mi restricción de año + 1 me obliga a establecer prioridades.
Por eso he dejado fuera algunas fuerzas evidentes, como la RA y la RV, que mencionamos el año pasado y que hasta la fecha han tenido un impacto limitado en la web. Teniendo esto en cuenta, ¿qué añadirías a esta lista?
(Ten en cuenta que si incluyes enlaces en tus comentarios, se marcarán como posible spam. Así que no hace falta que los pongas; con que nos des suficiente información para buscarlo en Google, será suficiente).
Y, oye: gracias por leernos.
