Cómo iniciar los proyectos en Figma

1

Landing Page responsive

2

Atomic Design en Figma

3

Uso de librerías en Figma

Quiz: Cómo iniciar los proyectos en Figma

Diseño Responsive y Técnicas Avanzadas

4

Uso de Grids

5

Uso de Constraints

6

Constraints y Layout

7

Propiedades Wrap, Min y Max en Autolayout

8

Sistemas de Diseño

9

Prototipado mobile

10

Prototipado Desktop

Quiz: Diseño Responsive y Técnicas Avanzadas

Crea componentes avanzados

11

Uso de Variants

12

Component properties

13

Implementa Component properties

Quiz: Crea componentes avanzados

Variables en Figma

14

Cómo usar las variables de Figma para colores y tamaños

15

Cómo usar las variables de texto en Figma: traducciones automáticas

Quiz: Variables en Figma

Inteligencia Artificial para Figma

16

Funcionalidades de Inteligencia Artificial (IA) en Figma

17

Inteligencia Artificial para proyectos de diseño Figma

Crear Landing Pages con Figma

18

Diseño de una Landing Page para el sector de Banca: briefing de diseño con IA

19

Diseño de una Landing Page para el sector de banca: paleta de colores

20

Diseño de una Landing Page para el sector de Banca

21

Diseño de una Landing Page para el sector de Banca: prototipado

Interacción Avanzada con Prototipos

22

Cómo crear interacciones con los componentes

23

Interacciones en la card

24

Prototipado de navegación

Quiz: Interacción Avanzada con Prototipos

Prototipado avanzado con Figma

25

¡Comparte tu landing page, entrega y recibe feedback de la comunidad!

26

Las mejores landings creadas con Figma

27

Documentación para el desarrollo en Figma

Quiz: Prototipado avanzado con Figma

Cómo trabajar con los equipos de desarrollo

28

Colaboración con desarrollo: Dev Mode de Figma

29

Colaboración con Desarrollo: Figma y Visual Studio Code

Quiz: Cómo trabajar con los equipos de desarrollo

No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Funcionalidades de Inteligencia Artificial (IA) en Figma

16/30
Recursos

¿Cómo ha revolucionado Figma el diseño con inteligencia artificial?

Los avances en inteligencia artificial están transformando el ámbito del diseño, brindando herramientas innovadoras que promueven la eficiencia y calidad del trabajo creativo. En el ámbito de Figma, la integración de la tecnología de inteligencia artificial es evidente con la incorporación de plugins que amplifican las capacidades de diseño. En el evento Config 2023, Figma anunció la adquisición de Diagram, una empresa pionera en crear herramientas impulsadas por inteligencia artificial, con el objetivo de facilitar la creación de productos de alta calidad y a un ritmo más rápido.

¿Qué herramientas ofrece Diagram para mejorar nuestro diseño?

Diagram ha desarrollado significativas herramientas como Magician, Genius y Automator, que estarán disponibles de forma nativa en Figma, facilitando un proceso de diseño más fluido y efectivo. Entre estas herramientas, el plugin Magician se destaca por sus capacidades para generar iconografía, copies y hasta imágenes utilizando inteligencia artificial, consolidándose como un recurso esencial para los diseñadores.

¿Cómo utilizar Magician para potenciar tu flujo de trabajo?

Magician permite realizar "hazañas mágicas" en el diseño al integrar inteligencia artificial para generar diversos elementos creativos:

  • Generación de iconografía: Con un prompt sencillo como "Home", Magician puede devolver múltiples opciones de iconos de calidad vectorial que puedes personalizar en color y estilo.

  • Creación de copies: Utilizando instrucciones específicas, por ejemplo, "a title of a bank app", el plugin sugiere varias opciones de texto, enriqueciendo la interface de aplicaciones.

  • Generación de imágenes: Directamente dentro de Figma, sin necesidad de servicios externos, puedes pedir imágenes específicas (como un perrito) y obtener múltiples opciones de alta resolución.

¿Por qué elegir las herramientas de Diagram sobre otras?

El uso de herramientas integradas como las de Diagram dentro de Figma no solo agiliza los procesos creativos, sino que también mantiene a los diseñadores dentro de una única plataforma. Esta integración significa:

  • Eficiencia: Al evitar transiciones entre diferentes programas, optimizas el tiempo de producción.

  • Calidad: Recibes elementos de diseño de alta calidad que pueden ser ajustados a las necesidades específicas del proyecto.

  • Simplicidad: La posibilidad de generar y modificar elementos desde una única interfaz facilita la corrección y edición rápida, un proceso vital en etapas de diseño iterativo.

Figma, junto con Diagram, está redefiniendo el enfoque hacia una inteligencia artificial orientada a la innovación en diseño. Esta colaboración promete seguir expandiendo las capacidades creativas de diseñadores en todo el mundo y te motiva a seguir aprendiendo y aprovechando estas tecnologías en constante evolución.

Aportes 8

Preguntas 1

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

brutal, figma es algo impresionante

Magician: plugin para generar iconografía, imágenes, textos con la IA

No tengo la "page" de IA , tampoco esta la de la clase pasada de variables de cambiar el idioma asi debe ser? ![](https://static.platzi.com/media/user_upload/1-0927a62f-be50-433d-9611-4029ad1a0bae.jpg)![](https://static.platzi.com/media/user_upload/2-a729baa9-db79-430a-af03-460616c82fc3.jpg)
Lo que veo bueno en magician es solo la generación de copys. Lo demás ya hay librerías
Intento entrar a el pluggin pero me aparece esta captura de pantalla, que es lo que debo poner ahi? ![](https://static.platzi.com/media/user_upload/image-3e0b785f-f846-443d-953c-1e2d72197c8c.jpg)![]()
La "page" de aplicacion IA no la tengo tampoco la de apple y google de la pasada esta bien? ![](https://static.platzi.com/media/user_upload/1-5abc36ec-9638-46c9-8263-397dad30a46a.jpg)![](https://static.platzi.com/media/user_upload/2-3efd020d-19cb-4594-a75f-da152b85fc92.jpg)
Yo pensaba que sabía Figma, pero en tan poco tiempo salieron tantas cosas que wao.
Quedé impresionada, llevaba tiempo buscando un plug in así!!