Spanish (Español) translation by Marwa Shuwain (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!
By
