Creación de un sistema de diseño en Figma: colores y formas
() translation by (you can also view the original English article)
En este, el segundo de nuestra serie de tutoriales sobre un sistema de diseño en Figma, trabajaremos en este tema de WordPress para blog de noticias de revista:



Este tema de WordPress eventualmente será codificado y podrás descargarlo de manera gratuita.
Puesto que este diseño terminará eventualmente en las manos de un desarrollador, quise crear un sistema de diseño; algo que nos ayudará a los dos. Me ayudará a diseñar nuevas páginas en el futuro, asegurándome de que todo sea consistente, y también ayudará al desarrollador al crear un proceso de codificación eficiente. El sistema contiene todos los colores, la información tipográfica, el tamaño y el espaciado, y más.



En este tutorial, voy a enseñarte cómo desarrollar dos secciones del sistema de diseño, dándote una idea de cómo implementar el tuyo: tipografía, tamaño y espaciado. ¡Vamos a empezar!
Creando un sistema de diseño en Figma
Este tutorial sobre un sistema de diseño en Figma es parte de una serie de videos, aquí están, ¡todos en un solo lugar!
- FigmaCreación de un sistema de diseño en Figma: tipografía, espaciado y tamañoAdi Purdila
- Sistemas de diseñoCreación de un sistema de diseño en Figma: colores y formasAdi Purdila
- Sistemas de diseñoCreación de un sistema de diseño en Figma: botones, enlaces, íconos e imágenesAdi Purdila
El poder de los sistemas de diseño
Échale un vistazo a esta colección de recursos de aprendizaje de Tuts+ Libera el poder de los sistemas de diseño, incluyendo el curso para principiantes:
Y si estás interesado en empezar con los sistemas de diseño en Figma, ¡revisa esto y decide!
- Figma¿Qué es Figma?Kezz Bracey
- FigmaAtajos esenciales de Figma para trabajar de manera eficienteAdi Purdila
- Figma20 kits de UI (interfaz de usuario) de Figma para diseñadoresEric Karkovack
- Adobe XDFigma frente a Adobe XD en 2020Kezz Bracey



¡Nos vemos en el próximo tutorial!