Figma presenta herramientas de gráficos en movimiento con IA y shaders de WebGPU
Figma está transformando fundamentalmente el puente entre el diseño y el desarrollo al integrar capacidades avanzadas de IA directamente en su lienzo principal. En su conferencia anual Config, el gigante del diseño anunció un conjunto de herramientas de alta fidelidad, que incluyen gráficos en movimiento impulsados por IA y efectos de shader, diseñados para automatizar flujos de trabajo creativos complejos.
Cerrando la brecha con Code Layers y optimización full-stack
Uno de los cambios más significativos en el ecosistema de Figma es el lienzo reimaginado, que ahora está optimizado para el desarrollo full-stack. La introducción de "Code Layers" permite que diseñadores e ingenieros trabajen en un entorno unificado, desdibujando eficazmente las líneas entre una maqueta visual y un código fuente en vivo.
Los desarrolladores ahora pueden clonar repositorios, generar nuevas direcciones de diseño utilizando el agente de IA de Figma y extraer flujos complejos en capas de diseño editables. Crucialmente, estas actualizaciones permiten un flujo de trabajo bidireccional donde los cambios pueden sincronizarse de vuelta al código. Al integrar agentes de IA y herramientas de codificación en un solo espacio, Figma se aleja de ser una mera herramienta de prototipado para convertirse en un centro neurálgico para todo el ciclo de vida del desarrollo de productos.
Movimiento generativo y animación impulsada por IA
Figma está abordando uno de los aspectos que más tiempo consume en el diseño de UI/UX: el movimiento. Las nuevas herramientas de Motion permiten a los equipos diseñar animaciones, transiciones y transformaciones 3D de forma colaborativa directamente dentro de la plataforma.
En lugar de crear fotogramas clave (keyframes) manualmente para cada movimiento, los usuarios pueden aprovechar una interfaz de chatbot para "solicitar" (prompt) la creación de animaciones. Este enfoque impulsado por IA permite a los creadores describir una transición —como un rebote o un deslizamiento específico— y que el software genere la animación automáticamente. Debido a que estos activos de movimiento están conectados a sistemas de diseño y cuentan con respaldo de código, están "listos para implementar" (ready to ship), lo que reduce significativamente la fricción en el traspaso (handoff) entre el diseño y la ingeniería front-end.
Visuales de alta fidelidad mediante shaders de WebGPU
Ampliando los límites de la fidelidad visual, Figma ha introducido nuevas herramientas de shader impulsadas por WebGPU. Esto permite la creación de tratamientos visuales y rellenos personalizados que antes eran imposibles dentro de las limitaciones de la herramienta.
Los usuarios ahora pueden usar prompts para construir efectos de shader complejos, como dithering, pixelación y tipos de desenfoque sofisticados, directamente en el lienzo. Esta capacidad permite a los diseñadores implementar efectos visuales de alto nivel y alto rendimiento que se basan en los estándares web modernos. Complementando esto se encuentra "Figma Weave", una suite de más de 20 herramientas de IA integradas diseñadas para convertir flujos de trabajo de IA complejos y de múltiples pasos en acciones de lienzo simples e intuitivas.
Por qué esto es importante para el panorama de la IA
La evolución de Figma señala una tendencia más amplia en la industria: el paso de "la IA como un asistente" a "la IA como un motor integrado". Al incrustar capacidades generativas en dominios especializados como el movimiento y la matemática de shaders, Figma está demostrando cómo los LLM y la IA generativa pueden aplicarse a flujos de trabajo profesionales altamente técnicos. Este desarrollo establece un nuevo estándar sobre cómo el software creativo puede aumentar la experiencia humana en lugar de simplemente automatizar tareas simples y repetitivas.
Conclusiones clave
- Flujo de trabajo unificado: Las nuevas Code Layers permiten a los desarrolladores sincronizar los cambios de diseño directamente con el código, agilizando el proceso de traspaso (handoff).
- Movimiento generativo: Los diseñadores ahora pueden usar prompts de lenguaje natural para crear animaciones y transformaciones 3D complejas con respaldo de código.
- Visuales avanzados: La integración de shaders impulsados por WebGPU permite efectos de alta fidelidad como dithering y pixelación mediante prompts sencillos de IA.