() translation by (you can also view the original English article)
Este es el último de nuestra serie de tutoriales de diseño de Figma sistema! En él, vamos a estar trabajando en este tema de WordPress cartera minimalista:
Este tema de WordPress con el tiempo será codificado, y serás capaz de descargarlo de forma gratuita también.
Como este diseño terminará finalmente en manos de un desarrollador, quería crear un sistema de diseño para él; algo que nos ayudará a ambos. Me ayudará a diseñar nuevas páginas en el futuro, asegurándome de que todo sea consistente, y también ayudará al desarrollador creando 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 mostrarte cómo desarrollar varios aspectos del sistema de diseño, dándote una idea de cómo implementar tus propios botones, enlaces, iconos e imágenes. Vamos a cavar en!
Crear un sistema de diseño Figma
Este sistema de diseño de Figma es parte de una serie de video tutoriales, ¡aquí están, todos en un solo lugar!
-
FigmaCreación de un sistema de diseño Figma: tipografía, espaciado y dimensionamiento -
sistemas de diseñoCrear un sistema de diseño Figma: colores y formas -
sistemas de diseñoCrear un sistema de diseño Figma: botones, enlaces, iconos e imágenes
El poder de los sistemas de diseño
Echa un vistazo a esta colección de recursos de aprendizaje de esta serie Tuts+ Unlock the Power of Design Systems, incluyendo el curso para principiantes:
-
GRATIS
Introducción a los sistemas de diseño
Y si estás interesado en comenzar con los sistemas de diseño de Figma, ¡pruébelos para ver tu tamaño!
-
Figma¿Qué es lo de Figma? -
FigmaAtajos esenciales de Figma para trabajar eficientemente -
Figma20 kits de interfaz de usuario de Figma para diseñadores -
Adobe XDFigma vs. Adobe XD en 2020
¡Gracias por la atención!
