Integraciones
Figma
Conecta Figma a tu cuenta de Vibewax
Figma es una herramienta de diseño colaborativo para interfaces, prototipos y sistemas de diseño. Conecta tu cuenta una sola vez y el agente convertirá directamente tus diseños, componentes y estilos en partes funcionales de tu proyecto.
Por qué conectar Figma
- Convierte tus diseños en páginas reales. Indícale al agente un archivo de Figma y él transforma el diseño, los componentes y los espaciados en una página responsive, así no tienes que recrear el diseño a mano.
- Mantén tu proyecto alineado con la marca automáticamente. El agente extrae tus componentes, estilos y variables, incluida una configuración de Tailwind lista para usar, así tu proyecto respeta tu sistema de diseño sin recrearlo manualmente.
- Entrega diseños sin salir del chat. Exporta cualquier frame como imagen, extrae recursos para desarrollo y detalles del archivo, y evita el ir y venir constante entre Figma y tu proyecto.
Qué necesitas
- Una cuenta de Figma. Crea una gratis en figma.com
- Un plan Figma Organization o Enterprise si quieres variables publicadas o analítica completa de la biblioteca
Conecta Figma a Vibewax
1. Abre Ajustes
Ve a Ajustes → Integraciones en tu espacio de trabajo de Vibewax.
2. Conecta Figma
Busca la tarjeta de Figma en la lista de aplicaciones y haz clic en el botón Conectar.
3. Autoriza tu cuenta
Se abre una ventana nueva donde te pedirá iniciar sesión en Figma. Una vez que apruebes el acceso, volverás a Vibewax.
Usa Figma desde el chat
Una vez conectada la cuenta, describe lo que quieres y el agente se encarga del resto.
Convierte un diseño en una página:
Aquí tienes mi diseño de Figma para la página de precios [enlace].
Conviértelo en una página real, respeta el layout, los componentes
y los espaciados, y hazla responsive.Lleva tu sistema de diseño al proyecto:
Extrae los estilos y las variables de color de este archivo de
Figma y conviértelos en una configuración de Tailwind para mi
proyecto.Exporta recursos mientras trabajas:
Exporta el frame "Hero" de mi archivo de Figma como SVG y
añádelo a la página de inicio.O crea algo basado en tu biblioteca de diseño:
Estoy creando un sitio de documentación para el sistema de diseño.
Extrae los componentes y estilos de nuestra biblioteca de Figma y
enuméralos con vistas previas.Qué puede hacer el agente en Figma
Convertir la estructura, los componentes y los estilos de un archivo en páginas responsive, extraer design tokens y una configuración de Tailwind, exportar frames como imágenes, y extraer detalles del archivo, comentarios e historial de versiones para una entrega limpia. Las variables publicadas y la analítica de la biblioteca requieren Figma Organization o Enterprise.
Bueno saberlo
- Conectas la cuenta una sola vez. Cada proyecto de tu espacio de trabajo reutiliza la misma conexión con Figma.
- Algunas funcionalidades de la biblioteca requieren un plan de Figma de pago. Las variables publicadas y parte de la analítica de la biblioteca requieren un plan Figma Organization o Enterprise.
- Tu cuenta, tu control. El agente solo actúa cuando se lo pides. Puedes desconectar Figma en cualquier momento desde Ajustes → Integraciones.