Moodboard: la herramienta para mejorar tu diseño UI
Lo difícil de trabajar en una profesión que se percibe tan orientada a la estética es que todo el mundo se imagina algo diferente cuando se trata de explicar un look&feel.
Cuando dices que el botón será «azul», tú tendrás un tono concreto en mente. Y todas las personas del equipo pensarán en azul… pero cada una de ellas lo pensará en otro tono diferente al que tú tenías en mente. Lo mismo sucede, evidentemente, con adjetivos tan complejos como «alegre», «moderno» y «digital», por poner tres ejemplos.
Un moodboard es una herramienta que te permitirá comunicar fácilmente cómo se sentirá y percibirá un diseño de manera que todo el mundo esté de acuerdo.
¿Qué es un moodboard?
Un moodboard es una representación visual formada por un conjunto de piezas gráficas que tratan de representar un conjunto de emociones y conceptos.
Si el diagrama de flujo sirve para representar visualmente cómo se mueve el usuario en una web o aplicación, con el moodboard podrás representar y trabajar de forma colaborativa con el resto del equipo en cómo se percibirá y verá la aplicación o página web.
¿Es necesario hacer un moodboard?
En mi opinión, sí. Por una simple razón: transmitir conceptos estéticos utilizando palabras hace que cada persona se imagine algo distinto. Con un moodboard consensuado con todo el mundo sera más fácil tener discusiones sobre los mismos conceptos y viendo tod@s lo mismo.
De esta forma te asegurarás de estar en el camino correcto y que no trabajarás en una propuesta que cuando la entregues no cuadrará con lo que la otra persona tenía en mente.
Esta herramienta suele utilizarse en la etapa del proceso de diseño en la que se empieza a conceptualizar el diseño. Yo suelo hacerlo a la vez que trabajo en los wireframes, ya que hace más fácil explicar ambas piezas: una es la estructura, con las típicas cajas grises y la otra, cómo respirará ese diseño una vez finalizado.
¿Cómo hacer un moodboard?
Define la dirección
Un moodboard puede ser útil en diferentes ocasiones, ya que puede utilizarse para trabajar literalmente con lo que se incluye (paleta de color, tipografías…) o puede ser más evocativo y que incluya imágenes aspiraciones con lo que se quiere transmitir con el proyecto.
O puede ser una combinación de ambas. En cualquier caso, antes de empezar tienes que tener claro para qué y por qué se necesita el moodboard. ¿Qué se pretende conseguir y transmitir?
Selecciona las referencias
Tanto si ya existen en un manual de marca como si tienes que buscarlas en Unsplash, Pinterest, Dribbble y otras plataformas, lo que hay que hacer es empezar a seleccionar las referencias y categorizarlas.
No pienses en incluir solo imágenes estáticas: un moodboard puede contener fragmentos de vídeos, audios, recortes de revistas, gifs, colores, tipografías, fotografías que hayas hecho tú mism@…
Una vez tengas suficientes, fíltralas para incluir solo aquellas que transmiten exactamente aquello que se ha marcado en la dirección del proyecto.
Ordénalo todo
No te olvides que el moodboard sirve para representar cómo se percibirá y verá el proyecto que tienes entre manos. En mi opinión no hace falta ordenarlo poniéndolo todo súper alineado ni dejarlo muy desordenado como si fuera un collage, pero esto va a gustos.
Para que tengas una referencia, puede ser tan caótico como este o tan ordenado como el que ilustra este artículo.
Moodboard realizado por Alex Sailor.
Colabora con otras personas
Te recomendaría que no trabajases el moodboard tú sol@. Está claro que tú eres la persona con más conocimiento de diseño de producto digital, pero es importante que incluyas también la perspectiva de perfiles de marketing, negocio e incluso tu propio cliente, si se trata de un proyecto que haces como freelance.
Herramientas para hacer un moodboard
A continuación te listo algunas herramientas que puedes utilizar. He intentado que sean lo más agnósticas posibles a cualquier sistema operativo y que tengan versión gratuita para que puedas probarlas 🙂
Las que conozco son estas: FigJam, Milanote, Miro, Mural, Canva y Sampleboard.
Apuntes finales
Como te decía al inicio, un moodboard te será útil para alinear a todo el mundo y asegurarte de que estás diseñando la interfaz en la dirección correcta. Además también puede ser útil cuando estés diseñando y te falte la inspiración: volver a consultarlo te ayudará a percibir de nuevo aquello que se quería representar.
¿Has creado algún moodboard alguna vez? ¿Cuál es tu experiencia con ellos?
El moodboard de la portada es de Mr.Mockup.