Cómo crear un Design system ¿Por dónde puedo empezar?

marzo 18, 2021

Esta es una introducción a los design systems, específicamente por dónde empezar para crear un design system en el proyecto que estás trabajando.

Originalmente este artículo incluía qué es un design system y para que siver pero he decidido crear otro post para explicar esto con profundidad: Design system, diseña un sistema y no una página

¿Por dónde es recomendable empezar mi design system?

1Convencer a los stakeholders de que hacer un design system vale mucho la pena

El primer paso y el más fundamental es entender por qué es importante el design system y convencer a los stakeholders que invertir tiempo en esto es buena idea.

Si no logras esto el resto de tus esfuerzos serán inútiles y te verás forzado a llorar por las noches y tomar pastillas para consolar el sueño durante la duración del proyecto.

2Inventario

Este inventario es hacer un listado de TODOS los componentes de las apps y páginas webs del producto. Ponerle un nombre y agruparlos en grupos lógicos (Por ejemplo apple los agrupa en bars, views, controls ).

Una vez convenzas a tu jefe y colegas que hacer un design system es una buena idea, el siguiente paso es involucrarlos en la creación del design system y una excelente manera de hacer esto es hacer un Interface inventory en conjunto.

Pro-tip: Organiza un workshop con todos los departamentos (DEV, QA, Ventas, Marketing, Producto, etc.) y cada equipo tendrá la tarea de encontrar y nombrar los componentes en conjunto con el objetivo de eliminar duplicados y ponerse de acuerdo para nombrar los componentes y evitar que cada departamento lo llame de manera distinta.

Por último: documenta este inventario y ponerlo en un lugar visible para todos los equipos (En confluence, en el blog de la empresa, etc).

3Crea un piloto rápido

Así como las series de televisión hacen un piloto para ver si va a funcionar un concepto. Tú también empieza por un piloto para poner a prueba tus suposiciones.

  • Empieza por los componentes que más se usan.
  • Empieza por los componentes más valiosos (por ejemplo si hiciera el design system de google, definitivamente haría el componente del buscador).
  • Habla con ingeniería y empieza por las cosas que sean más fáciles de implementar.
  • Que sea algo rápido que no tome más de dos meses.
  • Que tenga potencial que le guste a todos (los componentes de la funcionalidad esta maravillosa que el CEO siempre presume del producto)

Pequeña introducción sobre los design systems, basado fuertemente en el mini-curso de Invision de expert advice design system. También escribí las referencias de design systems que me parecieron útiles.

Si quieres leer un artículo más avanzado, hice esta azotadez centrado en Tokens y cómo nombrarlos.

Lectura recomendada: https://www.uxpin.com/create-design-system-guide

Crédito de la foto de portada: Conor Hennessy

Etiquetas: , ,

2 comentarios

  • […] Este es un artículo más avanzado sobre design systems, pero, también escribí una introducción a los design systems. […]

  • […] un tiempo hice esta pequeña introducción para saber por dónde empezar un design system, pero creo que también es importante ahondar un poco más sobre lo que es un design system y para […]