- 1

Diseño de Interfaces con Figma: Creación de un Perfil Completo
10:36 - 2

Interfaz y colaboración en Figma para proyectos de diseño de apps
06:26 - 3

Creación de Prototipos en Figma: Elementos Básicos y Diseño de Interfaces
11:49 - 4

Tipografías en Diseño de Interfaces: Uso y Jerarquía en Figma
07:56 - 5

Creación de Interfaces en Figma: Duplicado y Agrupación de Elementos
10:01 - 6

Rellenos y Organización de Elementos en Figma para Interfaces
13:33
Simetrías Rotacionales en Figma: Crea Diseños Geométricos Interactivos
Clase 20 de 22 • Curso de Figma
Contenido del curso
- 7

Creación de Íconos Vectoriales con Pen Tool en Figma
12:13 - 8

Creación de Mapas e Íconos en Figma para Aplicaciones de Senderismo
08:53 - 9

Organización de Espacios de Trabajo en Figma
12:52 - 10

Efectos de Sombra y Difuminado en Figma
10:46 - 11

Diseño Responsivo con Auto Layout en Figma
11:13 - 12

Auto Layout Avanzado en Figma: Mínimos, Máximos y Posiciones Absolutas
14:48
- 17

Animaciones y Transiciones en Prototipos con Figma
10:19 - 18

Acciones Múltiples y Variables en Prototipado de Figma
11:29 - 19

Expresiones Condicionales en Prototipado con Figma
07:16 - 20

Simetrías Rotacionales en Figma: Crea Diseños Geométricos Interactivos
08:12 - 21

Guías y Buenas Prácticas en Figma para Diseñadores de Interfaces
13:41 - 22

Funcionalidades de Inteligencia Artificial en Figma
13:39
¿Cómo crear una base para simetrías rotacionales en Figma?
En el fascinante mundo del diseño gráfico, la simetría rotacional puede ser una herramienta poderosa para crear patrones hipnóticos y visualmente atractivos. En Figma, puedes llevar tu creatividad al siguiente nivel mediante el uso de simetrías rotacionales. Comenzaremos esta aventura creativa desde cero, aprovechando la simplicidad y flexibilidad que ofrece esta herramienta.
Para iniciar, creamos un "frame" que será la base de todo nuestro trabajo. Sigue estos pasos:
- Crea un frame:
- Usa la tecla
F, haz clic y arrastra conShifthasta obtener un tamaño de 500x500. - Ajusta manualmente su tamaño a 500x500 en la pestaña de diseño.
- Añade un "stroke" blanco y renómbralo como base.
- Crea el componente base:
- Crea un componente del frame usando
CommandOptionK. - Añade un polígono dentro para marcar la parte superior y céntralo usando las guías inteligentes.
¿Cómo aprovechar la simetría de componentes en Figma?
Ahora que tenemos la base, exploraremos cómo podemos utilizar copias de este componente con simetrías reflejadas para crear patrones complejos.
- Duplica y refleja la instancia:
- Duplica la instancia y ubícala debajo de la original.
- Voltéala horizontal y verticalmente con
ShiftHyShiftV.
- Rota y duplica más instancias:
- Duplica y rota las instancias sobre el eje central.
- Gira usando
Shiftpara asegurar simetría. - Repite el proceso hasta que obtengas un patrón de ocho instancias formando una estrella.
¿Cómo jugar y experimentar con formas en Figma?
Ahora que nuestra estructura está lista, es momento de divertirnos agregando formas y experimentando con los diferentes elementos que podemos incluir para darle vida al diseño.
- Experimenta con diferentes formas:
- Cambia el polígono a un hexágono, sin relleno pero con un "stroke" blanco grueso.
- Duplica y mueve esos hexágonos fuera del frame para ver cómo interactúan.
- Juega con la herramienta de dibujo a mano alzada:
- Usa
ShiftPpara dibujar con un esfero. - Escoge un color como verde biche y empieza a dibujar desde el centro, aplicando la simetría a todo el diseño.
Recuerda, lo más importante es dejar volar tu imaginación. No importa si las primeras veces no sale a la perfección; el objetivo es experimentar y aprender en el proceso.