Figma para UX/UI: 16. Creando Estilos - jonmircha
Sigue así. Cada lección te acerca más a tu certificado.
Sobre esta lección
En este video del Curso de Figma para UX/UI, revisamos como crear Estilos en Figma. 🎓🤓 Certifícate en UX/UI 👉🏻 https://jonmircha.com/certificacion-ux-ui 📝 ÍNDICE: 1. 0:00:00 - Introducción: Preparación del entorno para la creación de estilos de texto y color. 2. 0:00:53 - Referencias: Análisis de sistemas de diseño reales (Gobierno de EE. UU.) y nomenclatura de "tallas" (3xs a 3xl). 3. 0:02:10 - Estructura propuesta: Cómo organizar estilos para que sean escalables y comprensibles. 4. 0:03:30 - *CREACIÓN DE ESTILOS DE TEXTO.* - 0:03:52 - Diferencia entre Estilos y Variables (Spoiler de prototipos con lógica). - 0:05:53 - El truco de la *Diagonal* ( */* ): Cómo crear jerarquías y carpetas automáticas en el panel de estilos. - 0:06:50 - Nomenclatura recomendada: *Familia / Tamaño / Peso* (Ej. Poppins / 48 / Black). - 0:09:40 - Práctica: Creación masiva de estilos para tipografías Poppins y Open Sans (desde 12px hasta 48px). - 0:13:45 - Visualización final de la librería tipográfica organizada por familias. 5. 0:14:45 - *CREACIÓN DE ESTILOS DE COLOR.* - 0:15:00 - Referencias de Frameworks: Nomenclatura semántica en Bootstrap (Primary, Success, Danger) y numérica en Tailwind (100-900). - 0:16:36 - Herramienta recomendada: *Radix Color Palette* para generar gamas cromáticas y exportar a Figma (SVG). - 0:19:00 - Categorización de colores: Sólidos (Solid / ...) vs. Degradados (Gradient / ...). - 0:20:30 - Registro de colores del proyecto: Primary Green, Black, White, Grises (Dark/Light) y Textos. - 0:24:00 - *BONUS:* Cómo crear estilos para Degradados (Linear, Radial) con nombres descriptivos (Ej. Barbie). 6. 0:26:25 - Otros tipos de estilos: Stroke (Bordes) y Effects (Sombras y Blurs). 7. 0:27:40 - Conclusión y preparación para la siguiente clase: Definición de Componentes. 🖤 Recursos de la clase: ⚫️ Duplica este Figma para seguir el curso 👉🏻 https://www.figma.com/design/8Q99q0RqzFXB2YIbbWNXBX/Dise%C3%B1o-UI-en-Figma 🦊 Visita mi sitio web https://jonmircha.com 🔔 Suscríbete al canal https://youtube.com/jonmircha 🌮 ¿Me invítas un taco? https://www.paypal.me/jonmircha 👉🏻 Mi Taller de IA Minimalista - https://jonmircha.com/ia-minimalista 👨🏻💻 Toma una Mentoría conmigo https://jonmircha.com/mentoria 📫 Suscríbete a mi lista de correo https://jonmircha.com/newsletter #jonmircha #uxui #figma
Sobre este curso
Aprende Figma la aplicación web que te permite crear diseños y prototipos de UI y UX.
Lo que aprenderás en este curso:
- Comprender los principios del diseño gráfico profesional
- Dominar las herramientas de diseño y edición de imágenes
- Crear composiciones visuales atractivas y efectivas
- Diseñar logotipos, cartelería y material publicitario