Figma permite testar protótipos com código no canvas. A ferramenta 'code layers' em beta integra regras de estilo e repositórios. A funcionalidade está disponível para equipes como Uber e Atlassian.

A ferramenta integra regras de estilo e repositórios, facilitando a criação e refinamento de protótipos. Designers podem explorar variações de interfaces, como botões de entrega em um app fictício, e comparar opções lado a lado. O Figma Agent reconhece componentes aprovados e aplica regras definidas em guias. Acesso à biblioteca é feito via chat, selecionando "Libraries" e escolhendo a biblioteca desejada. Exemplos e guias são importantes para orientar o agente, e designs podem ser adicionados como contexto para tarefas específicas. A ferramenta permite extrair elementos em camadas editáveis de Figma, facilitando ajustes de layout e estilo.

A funcionalidade é baseada em agentes de IA e camadas de código, com suporte para repositórios GitHub e sistemas de design existentes. A AWS publicou um post sobre quatro camadas de engenharia de contexto para agentes de IA em produção. A funcionalidade pode ajudar equipes a ajustar layouts e estilos com base em regras de código e sistemas de design. A disponibilidade no Brasil não foi confirmada, mas a ferramenta já está disponível para algumas equipes, como Uber e Atlassian.

A funcionalidade está disponível para equipes como Uber, Granola e Atlassian, o que mostra o foco em empresas que precisam de integração entre design e código. A dependência de repositórios GitHub e sistemas de design existentes pode limitar o uso para equipes que não têm essas estruturas. A disponibilidade no Brasil ainda não foi confirmada, mas a funcionalidade já está em produção.

Figma junta design e código em nova ferramenta

A funcionalidade, chamada de "code layers", permite que equipes testem protótipos com código diretamente no canvas, integrando regras de estilo e repositórios. A novidade alinha-se a uma tendência de integração entre design e código, com ferramentas como o Figma Agent permitindo que equipes trabalhem com maior precisão.

Com informações de figma.com.

Fontes

  1. Workflow lab build with code on the canvas using the figma agent and code layersfigma.com
  2. How to put your design system to work with the figma agentfigma.com
  3. Kimi k3 1 pro why a faster coding model can still finish the job slowlymilind-divre.medium.com
  4. Four layers of context engineering for production ai agents how deep insight applies them in working codeaws.amazon.com

Texto escrito com IA a partir das fontes listadas e revisado por regras automáticas da redação. Como trabalhamos

Quer ver o resumer primeiro nas buscas do Google?

Adicionar às Fontes Preferidas do Google