Course Hive
Search

Welcome

Sign in or create your account

Continue with Google
or
Figma para UX/UI: 16. Creando Estilos - jonmircha
Play lesson

Curso Figma - Figma para UX/UI: 16. Creando Estilos - jonmircha

5.0 (1)
20 learners

What you'll learn

This course includes

  • 25 hours of video
  • Certificate of completion
  • Access on mobile and TV

Summary

Keywords

Full Transcript

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

Course Hive

Continue this lesson in the app

Install CourseHive on Android or iOS to keep learning while you move.

FAQs

Course Hive
Download CourseHive
Keep learning anywhere