What's New in Figma, Laravel, OpenAI, Claude, and Gemini-and How to Use Them Together

Overview

Selected releases from April to September 2026. Availability is described as of October 1, 2026. Over the past six months, Figma, Laravel, and the major AI platforms have introduced tools that bring design and development closer together. Figma is expanding into animation, programmable workflows, and working code. Laravel is making AI integration a more natural part of application development. OpenAI, Anthropic, and Google are extending what AI can do with code, documents, images, and voice. For product teams, these releases create opportunities across two areas: building software and adding AI capabilities to the software itself. Understanding that distinction helps determine where each tool belongs-and what it can realistically improve.

Figma: More Behavior, Automation, and Connections to Code

Figma Motion - Animation Integration

Figma Motion was introduced on June 24, bringing timelines, keyframes, and easing directly into the same environment where teams maintain components and variables. Developers can inspect animation through Dev Mode, while compatible AI agents can receive motion context through MCP (the Model Context Protocol) that connects agents with tools and data. The September 30 Motion update adds reusable animation styles and Lottie and dotLottie export for supported animations. Audio and text animation were also announced, with Figma's rollout message scheduling those capabilities for the following week.

For a UX/UI Designer working in Figma, the practical application is to treat motion as part of the design system. A team can define how dialogs appear, notifications enter the screen, and loading indicators behave, then reuse those decisions across the product. This gives developers clearer specifications and makes interactions more consistent. Implementation still requires checking performance, keyboard behavior, and reduced-motion preferences.

Variables and Auto Layout Improvements

Two smaller releases address common design-system problems:

• Opacity Update (September 3): Allows opacity to change while the underlying color remains connected to its library. This is useful for disabled controls, overlays, and secondary visual states, enabling designers to adjust transparency without losing the relationship to the original color.

• Vertical Wrapping Update (September 25): Lets content arranged vertically in Auto Layout flow into another column, bringing the behavior closer to CSS Flexbox. Together, these changes make it easier to model interfaces with variable content and reusable states, reducing manual overrides that become difficult to maintain as a design system grows.

These improvements also enhance the ability to automate repetitive design work through Figma's agent capabilities.

Agent Skills and Generative Plugins

Figma's agent capabilities introduce reusable Skills and custom tools. Skills preserve recurring instructions, while generative plugins turn repeated canvas operations into tools that can be used again. The September plugin and shader updates extend publishing, provide access to plugin and shader code, and add further support for animated and interactive shaders. Integrations that call external services or APIs still require classic plugins.

A practical application is a layout generator built around a team's conventions. Instead of repeatedly describing spacing, typography, component choices, and responsive behavior, designers can encode those rules in a reusable workflow. The benefit depends on the quality of those rules-clear component definitions and naming conventions give automation useful instructions; inconsistent foundations produce inconsistent results faster.

Code Layers: Testing Working Interactions on the Canvas

Code Layers (announced for Figma Design at Config in June) bring working code and interactions onto the canvas. Teams can explore behavior and move between code and editable design layers. According to Figma's Config availability guidance, the feature remains in closed beta. This is particularly useful for interfaces that are difficult to evaluate through static screens: filters, interactive charts, onboarding steps, and complex forms. Designers can review a functioning interaction earlier, while developers can discuss the behavior alongside the visual design. Production use still requires checking how the code fits the application's framework, component architecture, and data flow.

Figma Weave: Reusable Workflows for Creative Production

Figma Weave addresses the production of visual assets. Community publishing for Weave tools launched on September 16, followed by the Figma node on September 17. As documented in the Figma release notes, a Figma frame can become an input to a workflow, with selected text and image layers exposed for changes and updates brought in from the original design. For a product or marketing team, this can support localized campaign graphics, product visuals, and variations of an established layout. The value lies in repeatability: the team defines the structure once and generates variations within it. Brand accuracy, text fit, and image quality still need a review step.

Laravel: A Stronger Foundation for AI Features

Laravel AI SDK 1.0

Laravel AI SDK 1.0 was released on September 23 and provides a common Laravel API for supported AI providers. It includes conversation storage, streaming, agent tools, and human approval of tool calls. The release also introduces support for Vercel Chat and AG-UI protocols for compatible interfaces. For a Laravel developer, this creates a foundation for integrating assistants into existing application workflows. A SaaS product can use an assistant to search documents, explain account information, or prepare reports while Laravel manages access and business rules. Approval support is particularly relevant to product design, requiring clear descriptions, visible status, and understandable recovery when an action fails. The SDK supports OpenAI, Anthropic, and Gemini for text, though capabilities vary by provider. Specialized services, such as live voice sessions or managed agent environments, may require dedicated integrations. The SDK documentation provides the provider capability matrix.

Laravel MCP: Giving Agents Access to Application Functions

Laravel MCP makes application functions available as tools for compatible agents. An engineering article published on September 11 describes searchable tool catalogs, allowing agents to discover relevant tools without loading every definition immediately. A business application might expose tools to retrieve an order, prepare an export, or create a draft. The agent requests an operation; Laravel controls its execution. Existing authorization, validation, and business rules must continue to apply. This provides a practical way to connect AI to useful actions while keeping application behavior governed by the backend.

Laravel Cloud

On July 28, Laravel announced support for deploying Nuxt and Next.js applications alongside Laravel on Cloud, allowing applications to share a repository while maintaining separate environments and scaling settings. A September 28 article explains how automated pull request previews work with scale-to-zero, allowing idle preview resources to suspend. For a Nuxt developer, this makes full-feature review easier. Designers, developers, and stakeholders can test the interface against the actual backend in a preview environment before release. Laravel's framework updates also support the background work these products need, including Bus::bulk() introduced in June for efficient dispatch of large groups of jobs-useful for document processing and search indexing.

OpenAI: Development Agents and AI Experiences Inside Products

New Models and Codex Workflows

The OpenAI API changelog records the introduction of GPT-6 Astra on September 3 and GPT-6.1 Sol on September 29. The GPT-6.1 Sol documentation describes support for image input, structured outputs, and tools through the Responses API. For a Figma and Laravel project, a useful task might combine design context with repository context: implement a component, connect it to an endpoint, and prepare the change for review. The September 29 DevDay announcements extend Codex with reusable cloud environments, an updated CLI, and code review workflows. OpenAI also introduced Dots for ongoing responsibilities, with availability rolling out according to plan and market. These tools can support recurring development work, but tasks still need clear acceptance criteria. "Implement this screen" becomes more actionable when it includes component mappings, responsive rules, data states, and a defined validation process.

Agents API

OpenAI released the Agents API in public beta on September 10 and added computer use on September 29. The service manages durable sessions, orchestration, and recovery for agent workflows. September also brought GPT Image 2.5 models for image generation and editing, alongside GPT-Live, which supports spoken interaction while a backend agent completes work. For AI development in an existing application, these capabilities open several directions: document assistants, image editing tools, and voice interfaces that can initiate useful actions. They also introduce new interface requirements. Users need to understand whether an agent is listening, processing, waiting for approval, or finished. They need controls to interrupt work and inspect its results. Those states should be designed in Figma before implementation begins.

Claude: Codebase Work and Visual Exploration

Claude Opus 5.5 and Sonnet 5.5

Claude introduced Opus 5.5 on September 22 and Sonnet 5.5 on September 28. Its positioning distinguishes sustained, complex work from more clearly scoped everyday tasks. For a development team, this suggests evaluating Sonnet for component work, bug fixes, and documentation, while testing Opus on difficult migrations or analysis across a large codebase. The choice should follow actual project results. A useful evaluation measures whether the model follows conventions, produces correct changes, and completes the task at an acceptable cost and response time.

Claude Design

Claude Design launched on April 17 as a research preview. It supports visual exploration and interactive prototypes, can incorporate a team's design system, and can prepare a handoff bundle for Claude Code. A team with an established Figma library can use it to explore a new flow or test alternative interactions. The selected direction then needs to be reconciled with the product's existing components, accessibility requirements, and responsive rules. This gives exploratory work a path into the maintained design system and the application code.

Gemini: Another Model Option and Multimodal Search

Gemini 3.8 Flash

Gemini 3.8 Flash was released by Google on September 2, adding another option for coding and agent tasks. In a Laravel application, it can be evaluated for supported text workflows through the AI SDK. Suitable test cases might include extracting structured information, categorizing documents, and generating summaries. Provider selection should follow representative tasks from the product. Accuracy, latency, cost, and integration requirements matter more than a general model ranking.

Gemini Embedding 2

Gemini Embedding 2 became generally available on April 22. Google's Embedding 2 developer guidance explains how it maps text, images, audio, video, and documents into a shared embedding space. For research and knowledge products, this creates possibilities beyond text search. A query could help locate relevant material across transcripts, screenshots, and PDFs. Laravel can manage ingestion and background processing, while the frontend presents the retrieved sources and explains how they relate to the user's question. The Gemini API release notes also document August and September additions to transcription, live conversation, and speech generation.

Connecting Figma, Laravel, and AI in One Project

Defining the Design System and Its Relationship to Code

Start with components, variables, responsive rules, and interaction states in Figma. Then document how those decisions map to the frontend. Code Connect templates link Figma components to examples from the real codebase. The current template format is framework agnostic, allowing a Vue team to describe its own component usage. Figma's remote MCP also supports code-to-canvas: capturing a running interface as editable frames for review. Combined design and frontend expertise is especially useful here. A designer who also writes frontend code can define component properties and variants around their actual implementation. A Vue Developer can connect those definitions to component props, API data, application states, and responsive behavior. When one specialist handles both disciplines, those relationships can be established while the design system is being created.

Separate Development and Runtime AI

During development, AI tools help create and review the product. They work with design context, repository conventions, and implementation requirements. At runtime, AI operates inside the product. Nuxt or Vue presents the experience; Laravel manages access, data, queues, and calls to selected services. The combination of these technologies enables a seamless pipeline from design specification through CI/CD to intelligent runtime assistance.