¿Cómo gestionar un Design System si eres UX Team of One? 🎨
Agunos tips para no morir en el intento
👋 Holaaaa ¿cómo estás?
Yo he estado un poco malita esta semana, pensaba que iba a librarme del virus del resfriado que todo el mundo estaba pillando, pero no, aquí estoy 🤧
¿La parte positiva? Me he permitido frenar y descansar en ropa comfy, bebiendo tés y chocolate caliente y viendo Gilmore Girls ☕️ ¿Así ponerse mala no suena tan mal, verdad?
Por suerte empecé el artículo antes de ponerme mala y lo he podido terminar este finde para compartirlo antes de que termine el mes. Así que si estás pensando en empezar un Design System como UX Team of One, la newsletter de hoy es para ti.
¡Vamos a ello! 🤍
Ah, y si todavía no estás suscritx, dale al link de abajo para formar parte de esto↴
Primero de todo, ¿tu proyecto necesita un Design System?
Antes de empezar, es fundamental entender que es un Design System y si tu empresa o proyecto realmente lo necesita:
Un Design System es un conjunto completo de normas destinadas a gestionar el diseño a escala utilizando componentes y patrones reutilizables. Fuente: Design Systems 101
Entonces, ¿cómo saber si tu producto o empresa donde trabajas necesita un Design System? Te recomiendo hacerte las siguientes preguntas.
Si estás trabajando para una startup, ¿habéis validado ya el producto o servicio y habéis establecido una imagen de marca sólida?
¿El equipo de diseño está distribuido o hay varios diseñadores trabajando en diferentes áreas del producto?
¿Es difícil mantener la coherencia de la marca en diferentes productos o canales?
¿Experimentáis retrasos frecuentes en el desarrollo debido a la creación constante de componentes de interfaz desde cero?
Si has respondido "sí" a más de tres, entonces es muy probable que necesites un Design System.
Consejos para crear y gestionar un Design System siendo UX Team of One
🌱 Empieza pequeño
Cuando empezamos a pensar en crear un Design System pecamos de empezar a planear a lo grande y de querer que sea perfecto. Pero, debes recordar (sobre todo si eres UX Team of One) que ese objetivo demasiado ambicioso probablemente te provoque burnout y te haga acabar abandonandolo en menos de 3 meses.
Mi consejo es que no pierdas el tiempo dedicando mil horas en planear y/o en crear unas foundations supercompletas, en vez de eso, empieza por analizar lo que realmente necesitas. ¿Cómo? Te recomiendo que sigas estos 4 pasos:
Haz screenshots de todas las pantallas del producto
Detecta los componentes y elementos visuales más utilizados e identifica patrones.
Señala los elementos que no son consistentes y que tienen diferentes diseños.
Empieza por componetizar lo que hayas detectado que se repite más veces.
Además, no olvides que existen plugins (sobre todo si usas Figma, cosa que recomiendo) para hacerte la vida más fácil a la hora de empezar un Design System. Aquí van algunos de mis favoritos:
Para crear las bases tipográficas → Typescales
Para crear las paletas de colores → Supa Palette para crear paletas y Contrast Checker para asegurarnos que utilizamos los colores de manera accesible.
🙅♀️ No intentes copiar los grandes Design Systems
Un Design System no tiene que ser tan extenso como los de Material Design, Gestalt, Atlassian… Estos han sido creados por equipos que únicamente y exclusivamente se dedican a ello.
Si estás trabajando tu solx en el Design System, debes empezar aceptando que debe ser mucho más simple y conciso, con el objetivo principal de adaptarse a las necesidades específicas de tu empresa.
Hablaré de los diferentes tipos de Design Systems y compartiré mis favoritos en mi próximo post para Suscriptores Premium, así que si no te lo quieres perder ya sabes que puedes suscribirte por solo 5€ al mes. Además, si te suscribes antes del 1 de diciembre, como oferta de Black Friday, puedes conseguir un 20% de descuento en tu suscripción para siempre 👇
☑️ Utiliza una to-do list
No hay nada mejor que tener una guía cuando no sabemos por donde empezar. Aunque nunca recomendaré que sigas una guía al pie de la letra, es muy útil para entender la magnitud de un Design System y cuáles son aquellas secciones indispensables.
También es una buena herramienta para dar a conocer la importancia y el roadmap de un Design System a los stakeholders y conseguir más inversión.
Design System Checklist → Esta to-do list incluye desde el lenguaje de diseño, las foundations y componentes como el mantenimiento. Muy útil para darle estructura a tu Design System en un inicio.
⏳ Prioriza y decide cuanto tiempo vas a dedicarle
Si eres UX Team of One seguramente tendrás que crear el Design System a la vez que muchas otras tareas, de hecho, seguramente el Design System sea una tarea secundaria; así que es importante saber priorizar tanto el contenido del Design System como el tiempo que vas a dedicarle.
Una opción es bloquear de 2 o 3 horas a la semana o, si sientes que eso es imposible, simplemente prueba a bloquear 15 minutos cada día. Parece poco, pero te ayudará a crear el hábito de no dejar el Design System olvidado o para “otro momento”.
Por último, recuerda agendar reuniones periódicas para compartir tu trabajo y aprendizajes, así como obtener feedback.
🗣️ No olvides hablar con developers
El Design System debe ser útil tanto para el equipo de diseño como de desarrollo, así que habla con los developers pronto y seguido. Eso sí, no te frustres, hay veces que ni ellos saben que es mejor, ya que cada uno hace cosas diferentes.
La clave es mantener una actitud proactiva e intenta que participen lo máximo posible en una etapa temprana.
Algunos consejos:
Explica y comparte los beneficios del Design System.
Hazles sentir parte del proceso.
Pregunta, pregunta y pregunta. Muchas veces dan cosas por sentadas que nosotrxs no sabemos, así que no tengas miedo de preguntar todo aquello que necesites para avanzar.
Identifica aquellxs developers que pueden ser tus aliadxs. Siempre hay personas dentro del equipo que les apasiona más una cosa u otra, identifica aquellxs que quieran involucrarse más en el Design System y trabaja conjuntamente.
Utiliza herramientas para hacerte (y hacerles) más fácil el trabajo:
Figma DevMode → Es una nueva funcionalidad de Figma que permite a los developers inspeccionar los diseños de una manera mucho más intuitiva para ellos. Ánima a tu equipo a que lo prueben. Hasta puedes preparar un pequeño workshop para enseñarles como utilizarlo.
EightShapes Specs → Plugin de Figma que documenta componentes de manera automática para hacer todavía más obvias las especificaciones.
🫶 Comparte tu trabajo lo antes posible
Comparte tu trabajo tan pronto como hayas terminado una parte de las foundations, un componente… es importante no esperar, el feedback cuanto más temprano, mejor.
Algunos consejos para compartir tu trabajo de manera efectiva:
Prepara algunos slides incluyendo los objetivos y el roadmap del Design System, para que todo el mundo entienda el punto de partida, donde estamos y hacia donde vamos.
No te centres solo en la parte más visual, explica también el razonamiento detrás de cada decisión.
🔁 Repeat
La creación de un Design System es un proceso iterativo. No intentes crear una versión final perfecta. Enfócate en ir escalando el trabajo poco a poco.
Y esto es todo por hoy 🫶
Recuerda que puedes seguirme en Instagram 🫶 o enviarme un email para darme feedback sobre la newsletter o pedir que hable sobre algún tema en concreto!
〰️ Judit