Na era da IA generativa, nossa expectativa é que a IA simplesmente nos entenda. E, em muitos casos, ela já entende. E é pura magia quando uma ferramenta fornece exatamente o que você precisa, através de uma pequena dica.

Nosso objetivo na Anima é automatizar a engenharia de front-end para que os humanos não desperdicem seu tempo. Ao longo de 2023, a IA da Anima produziu mais de 750 mil trechos de código, o equivalente a 1.000 anos de codificação humana. Com mais de 1 milhão de instalações na plataforma do Figma, a Anima está liderando o espaço de design-para-código.

Na próxima fase, vamos nos aprofundar ainda mais na automação da codificação de front-end do dia-a-dia.

As LLMs de hoje não entendem Front-end e UI

Existem muitos modelos de geração de código, incluindo aqueles que autocompletam código, e até seguem instruções. Existem vários Copilotos populares – assistentes de codificação que ajudam você a codificar mais rápido e são baseados nesses modelos de código.

Porém, quando se trata de automação de Front-end, acreditamos que há uma grande lacuna entre o que existe e o que é possível. Com as capacidades da Anima e nossa compreensão desse domínio, estamos empenhados em resolver essa lacuna.

E assim, hoje, anunciamos o Frontier – um assistente de codificação com IA para desenvolvedores Front-end.

Frontier – Geração de código por IA com seu código em mente, feita sob medida para front-end

O Anima Frontier encontra os desenvolvedores onde eles estão: na IDE, começando com o VSCode, a IDE mais popular.

Primeiro o Frontier analisa toda a base de código e mapeia seu sistema de design de código, frameworks, convenções e componentes. Esta parte leva alguns segundos e é feita localmente, para que seu código seja o mais seguro possível.

Em seguida, usando o avançado mecanismo de design-para-código da Anima, o Frontier analisa seu design e simplesmente entende o que está na versão do design e no código do sistema de design.

E, por fim, você pode escolher qualquer parte do design do Figma diretamente no VSCode e obter código baseado no SEU código. E é mágico.

Solicitar Acesso

Aumentando a adoção de Design-systems através de automação

Projetos maduros frequentemente possuem centenas, senão milhares, de componentes. A governança e adoção do design system são tarefas desafiadoras, porém cruciais para a manutenção desses projetos. É aqui que a automação entra em cena para ajudar.

Segurança e Guardrails de Inteligência Artificial (IA)

O Frontier foi construído desde o início para oferecer uma solução segura em nível corporativo.

A adoção de IA em empresas enfrenta mais atrito devido a preocupações comuns com privacidade:

Privacidade de Saída (Egress): Como garantimos que nosso código não “vaze” para o modelo LLM através do treinamento (o que significa que outras empresas poderiam receber trechos do nosso código)?
Privacidade de Entrada (Ingress): Como garantimos que o código de outras empresas, que possa ter sido ajustado ou treinado no LLM, não entre em nossa base de código – causando problemas de segurança e potencialmente de direitos autorais?

Para gerar código que se integre à interpretação de um design no Figma pela Anima, mas que use os componentes da base de código do usuário, poderíamos ter escolhido o caminho mais fácil e simplesmente treinado o LLM em torno da base de código. Isso tem sérias implicações para privacidade e segurança, pois precisaríamos enviar uma quantidade significativa de código do usuário/empresa e treinar um LLM customizado em torno dele. Reconhecemos a importância da segurança e privacidade, especialmente para desenvolvedores em ambientes corporativos. Portanto, tomamos uma direção completamente diferente.

Em vez de fazer upload do código para a nuvem, nós implementamos coleta, indexação e modelos de ML localmente, dentro do VS Code. Eles identificam e indexam o código relevante no computador do desenvolvedor. As informações coletadas são armazenadas localmente, como parte da base de código, o que significa que podem ser compartilhadas com segurança dentro da equipe por meio do Git – e não pela nuvem. Quando um determinado componente precisa ser “instanciado”, temos a habilidade de realizar uma quantidade significativa de pré-processamento localmente e enviar para o LLM na nuvem apenas uma pequena quantidade de código e informações necessárias – não o suficiente para expor a empresa a qualquer risco de Entrada ou Saída. Essa abordagem inovadora também traz o benefício de performance, já que a maioria das operações são realizadas no computador rápido do desenvolvedor.

Nos bastidores do Frontier – LLMs, ML, e arquitetura focada em IA

Anima Frontier está automatizando o front-end com IA, baseada em sua vasta experiência como líder nessa área e utilizando a tecnologia mais avançada para essa missão.

Muitas vezes vemos “projetos de fim de semana” impressionantes, feitos 99% com LLMs e com resultados incríveis em 30% dos casos. São projetos legais, mas não são adequados para profissionais.

Os LLMs, por mais poderosos que sejam, abrem novas portas, mas não são um passe de mágica; eles requerem um ambiente de suporte. Na Anima, nós testamos e comparamos, escolhendo a ferramenta certa para cada tarefa. Quando se trata de LLMs, nós fornecemos contexto, validamos seus resultados e os configuramos para o sucesso.

No processo de resolver esse problema complexo, nós o dividimos em dezenas de problemas e requisitos menores. Alguns problemas exigem criatividade e são resolvidos melhor com LLMs, e modelos específicos são mais rápidos e têm melhor desempenho do que outros. Alguns desses problemas requerem técnicas clássicas de aprendizado de máquina/visão computacional, como classificação em vez de geração. Outros são resolvidos melhor com heurísticas.

Ao combinar as melhores soluções para cada problema individual, podemos produzir resultados impressionantes com risco mínimo de ״alucinações de LLM״, tão comuns em soluções de código baseadas em LLM.

O que vem por aí para o Frontier?

À medida que buscamos utilizar todo o potencial da IA para ajudar desenvolvedores a codificar front-end com mais rapidez, sentimos que estamos apenas arranhando a superfície. O Anima Frontier deve ser capaz de fundir código com atualizações de design, corrigir código quebrado, entender states e temas, nomear elementos corretamente, ler especificações e pensar cada vez mais como um desenvolvedor humano.

Temos uma extensa lista de funcionalidades, mas precisamos da sua ajuda para nos dizer o que mais te incomoda no desenvolvimento front-end e o que você espera que a IA possa fazer para desenvolvedores hoje. Participe da conversa no canal do Discord da Anima.

Solicitar Acesso

The post Apresentando: Frontier, o futuro do front-end pela Anima appeared first on Anima Blog.

Apresentando a Inteligência Artificial Generativa no Design-to-Code do Anima

Anima com GenAI e Grande Modelo de Linguagem (LLMs) são inovações revolucionárias, mas atendem a nichos diferentes no cenário tecnológico.

Últimos lançamentos de IA do Anima e o que está por vir

Anima é uma plataforma de design para código alimentada por inteligência artificial, transformando Figma/XD em código executável e perfeitamente preciso.

Em segundo plano, elementos de Aprendizagem de Máquina (Machine Learning) já estão automaticamente nomeando camadas e limpando código, permitindo que os engenheiros construam 2 vezes mais rápido.

Anima é líder no cenário de design para código – Com mais de 700.000 instalações, Anima é o add-on número 1 do Figma na comunidade para desenvolvedores. Atendemos com orgulho equipes de gigantes da indústria como Amazon, Cisco, Samsung e Deloitte. Os usuários relatam uma redução de 50% no tempo de codificação de UI, graças ao Anima.

A diversidade de convenções de código

Até agora, nos concentramos em código React e HTML de alta qualidade. A qualidade do código da Anima é incomparável em termos de atenção a detalhes, limpeza e facilidade de manutenção.

Nos últimos 12 meses, realizamos sessões pelo Zoom com mais de 1000 equipes de P&D. Apesar de 44% do mercado escolher React para novos projetos, o conjunto de tecnologias Front-end é fragmentado. Em 1000 equipes, há vários repositórios, cada um com suas próprias convenções.

A entrada do GenAI

A combinação do motor de geração de código com tecnologia de ponta da Anima com as capacidades do GenAI significa mais frameworks, desenvolvimento mais rápido e a manutenção de código de alta performance.

O uso de Modelos de Linguagem Multimodal (LLMs) nos permite suportar mais convenções de código e expandir nossa oferta mais rapidamente.

Como o Anima possui testes visuais integrados e oferece suporte às funcionalidades do Figma, desde layouts até estilos, componentes e interações, você obtém tudo isso imediatamente.

O que isso significa hoje

A partir de hoje, os usuários da Anima no Figma podem começar a exportar designs para Vue/CSS, Vue/Tailwind (tanto Vue 2 quanto Vue 3) e React/Styled-components. Em JavaScript ou TypeScript. Essa matriz de frameworks, estilos e convenções de código continuará crescendo rapidamente.

Com o poder da inteligência artificial, estamos prontos para expandir nosso suporte a frameworks, oferecendo aos desenvolvedores um leque ainda mais amplo de opções para suas necessidades de desenvolvimento front-end. Isso significa que, quer você esteja trabalhando com frameworks estabelecidos como Angular, Ember.js e Backbone.js, ou explorando tecnologias mais recentes como Svelte, Meteor ou Aurelia, nosso produto estará pronto para ajudar. Entendemos que o cenário de desenvolvimento front-end é diversificado, e nossa abordagem impulsionada por IA garante que possamos atender a projetos de todos os tamanhos e complexidades.

Além disso, para aqueles que buscam simplicidade e eficiência, frameworks como Mithril, Alpine.js e Stencil também podem se beneficiar de nossa geração de código front-end aprimorada por IA. O futuro reserva perspectivas emocionantes à medida que aproveitamos a IA para aprimorar continuamente as capacidades de nosso produto e oferecer suporte a vários frameworks, garantindo que permaneçamos na vanguarda da inovação no cenário de desenvolvimento front-end.

Apenas para informar, a IA pode demorar um pouco mais para gerar o código, mas o resultado é de qualidade e eficiência superiores. Além disso, é personalizado de acordo com as convenções de código da sua equipe.

Anima vs multimodais

Anima com GenAI e Modelos de Linguagem Multimodais (LLMs) são ambas inovações revolucionárias, mas atendem a nichos diferentes no cenário tecnológico. Enquanto a Anima se concentra em preencher o vão entre design e desenvolvimento, convertendo diretamente plataformas de design como o Figma em código acionável – como React – os LLMs multimodais combinam a compreensão textual com o processamento visual para entender e gerar conteúdo em várias modalidades. Pense no Anima como uma ferramenta especializada que otimiza o processo de desenvolvimento web e de aplicativos, transformando projetos de design em realidade sem a necessidade de codificação manual. Em contraste, LLMs multimodais, como o ChatGPT da OpenAI com capacidades de entrada de imagem, têm mais a ver com ampliar os horizontes da IA, capacitando-a a interpretar e produzir tanto texto quanto imagens com sinergia. Ambos são transformadores, mas enquanto a Anima otimiza o fluxo de trabalho para designers e desenvolvedores, os LLMs multimodais abrem novas portas para a criação e compreensão abrangentes de conteúdo impulsionadas por IA.

A Anima se destaca na tradução de designs em código perfeito, capturando cada detalhe de plataformas como o Figma com precisão. Em contraste, embora os LLMs multimodais sejam versáteis no manuseio de texto e imagens, eles não são projetados para a tarefa exigente de replicação perfeita de design para código. A Anima garante a fidelidade ao design; os LLMs oferecem uma compreensão ampla de conteúdo.

O que há pela frente?

Na próxima versão da Anima, estamos elevando a experiência de design para código a níveis incomparáveis de customização. Reconhecendo que cada equipe de desenvolvimento possui seu próprio estilo e convenções de código, o Anima agora permitirá que os usuários forneçam uma amostra de seu próprio código-fonte. A plataforma analisará e se adaptará de maneira inteligente, garantindo que o código gerado não apenas mantenha a fidelidade de design pixel-perfect, mas também se integre perfeitamente aos padrões de código existentes e às convenções do projeto do usuário. Essa abordagem personalizada promete uma redução drástica no tempo de integração e garantir que o resultado se integre perfeitamente a qualquer código-fonte.

The post Apresentando a Inteligência Artificial Generativa no Design-to-Code do Anima appeared first on Anima Blog.

Converta qualquer design no Figma para código

Se você está tentando converter designs do Figma para Vue sem escrever o código do zero, este artigo é para você. Vamos mostrar como exportar seus designs do Figma como Vue em alguns passos fáceis usando o Anima.

Anima transformará cada propriedade de design em código Vue (Vue2 e Vue3) com Typescript ou Javascript.

Com Anima, agora você pode transformar:

• Figma para React, Figma para HTML ou Figma para Vue
• Utilizando Typescript ou Javascript
• Com CSS (Vue com Tailwind CSS está chegando em breve com a versão Beta da IA).

Vamos lá:

Passo 1: Abra o Anima no Figma

Se é a primeira vez usando o Anima, pode usar a caixa de pesquisa e digitar Anima.

Passo 2: Selecione Vue com Typescript ou Javascript

Em seguida, você terá que alterar a seleção de código para atender às suas necessidades:

• Framework: Escolha Vue no menu dropdown ‘framework’
• Linguagem: Marque Javascript ou Typescript conforme sua preferência

Anima salvará isso como sua preferência de código padrão. Você pode modificá-la a qualquer momento.

Passo 3: Selecione um Componente, Camada ou Frame do Figma

Após selecionar a seção do design, o codegen IA do Anima começará a gerar  código de Vue.

Se você já usou o Anima com HTML ou React, pode perceber que o código leva mais tempo do que o normal para ser gerado. A razão é a nossa nova versão Beta da IA! Mas não se preocupe, ela está ficando cada vez mais veloz.

Passo 4: Obtenha seu código

Quando estiver satisfeito(a) com o código selecionado, você tem 3 opções:

• Você pode copiar trechos diretamente clicando neste ícone aqui:

• Clique no botão ‘Download selection’’ para obter um arquivo zip contendo o pacote de código completo para a sua seleção

• Ou clique em “Open in CodeSandbox” para executar seu código instantaneamente no CodeSandbox.

Sim, é tão simples assim! Agora é a sua vez:

• Plugin Anima para o Figma
• Registre-se no Anima

Informe-nos como está indo no canal do Discord do Anima

The post Como exportar Figma para Vue appeared first on Anima Blog.

Obtenha Tailwind CSS do seu design no Figma

Este artigo mostrará como exportar de maneira integrada designs do Figma para Tailwind CSS usando o Anima.

O Anima mapeará as propriedades do seu design para os estilos base do Tailwind. Atributos de design, como cores, espaçamento e tipografia, serão transformados em classes concisas do Tailwind. Se você estiver usando estilos e variáveis, o código gerado pela IA da Anima o transformará em um arquivo de configuração do Tailwind.

Tailwind é a escolha ideal para desenvolvedores que desejam otimizar seu fluxo de trabalho e criar facilmente aplicações web responsivas.

Então, vamos mergulhar de cabeça e descobrir como você pode levar suas criações do Figma para o mundo mágico do Tailwind CSS!

Com a Anima, agora você pode transformar designs do Figma em:

• React, HTML, ou Vue
• Utilizando Typescript ou Javascript
• Com CSS ou Tailwind CSS

Então, vamos começar!

(Se você preferir seguir os passos com o vídeo relacionado, aqui está o tutorial no YouTube: Como converter Figma para Tailwind CSS)

Como converter designs do Figma para Tailwind

Passo 1: Execute o Plugin da Anima no seu arquivo do Figma

Abra o plugin do Anima no seu modo favorito (Modo Clássico ou Dev Mode). Você pode usar a caixa de pesquisa se for sua primeira vez usando o Anima, e digitar “Anima”. Será necessário criar um usuário no Anima. Leva apenas alguns segundos, prometemos.

Passo 2: Selecione React, Typescript / Javascript + Tailwind

Em seguida, você precisará alterar a seleção de código para atender às suas necessidades:

• Framework: selecione React no dropdown ‘framework’
• Language: marque Javascript ou Typescript de acordo com a sua preferência
• Selecione Tailwind CSS na opção ‘Styling’

Passo 3: Selecione um Componente, Camada ou Frame no Figma.

Agora, basta selecionar a seção que você deseja exportar com Tailwind e o Anima gerará o código correspondente.

Passo 4: Obtenha seu código

Quando estiver satisfeito com o código selecionado, você tem três opções:

1. Copie trechos com o botão ou usando o atalho do teclado. 
2. Baixe todos os arquivos juntos como um zip clicando em “Download selection”. 
3. Veja como seu código está sendo executado clicando em “Open in CodeSandbox”. Aqui está um exemplo: Link do CodeSandbox.

Agora é a sua vez!

• Plugin Anima para o Figma
• Registre-se no Anima
• Informe-nos como está indo no canal do Discord do Anima

The post Como exportar Tailwind CSS do Figma appeared first on Anima Blog.

Anima é uma parceira oficial do Figma, e nossa inteligência artificial de geração de código está integrada nativamente ao novo Painel de Modo de Desenvolvimento (Dev Mode) do Figma. Com o Dev Mode da Anima para o Figma, você pode gerar código eficiente, legível e de fácil manutenção para qualquer componente ou tela do Figma em tempo real.

O que você pode esperar do código da Anima:

• React + TypeScript/JavaScript funcional com suporte a subcomponentes que pode ser executado instantaneamente.
• Componentes React com state e interativos baseados em variantes e props do Figma.
• Flex responsivo de CSS baseado no Layout Automático (Auto Layout) do Figma.
• Estilos de sua escolha: CSS clássico, Styled Components, Tailwind CSS e em breve CSS modules.

Por tempo limitado, a geração, cópia e download do código React da Anima dentro do Dev Mode do Figma é gratuito. Leia mais sobre a parceria da Anima com o Figma aqui.

Vamos lá!

Como converter designs do Figma em código React com o Anima

Anima oferece duas maneiras de gerar React a partir de designs no Figma: 

1. 1. 1. 1. Código React para componentes individuais (disponível com permissões somente de leitura no Figma): 
            • A opção mais eficiente e acessível para desenvolvedores que querem componentes reutilizáveis de React.
            • Transforme os componentes do Figma em componentes de React (JSX ou TSX) dentro do Dev Mode do Figma.
            • Gere, inspecione e copie instantaneamente o código para o componente selecionado, assim como para seus subcomponentes individuais.
            • Faça o download de um pacote de código completo ou abra no CodeSandbox com apenas um clique.
         2. Código React para telas inteiras e flows completos (requer permissões de edição no Figma): 
            • A melhor opção para protótipos e MVPs suportados por React.
            • Sincronize telas e flows completos do Figma com o aplicativo web da Anima.
            • Exporte React (JSX ou TSX) para sua seleção sincronizada, com suporte para breakpoints e links do Figma entre páginas.
            • Requer sincronização externa e processamento de código. **

Opção 1: Gerar código React para componentes individuais e telas

Passo 1: Mude para o Modo de Desenvolvimento usando a alternância no topo do painel de Inspeção do Figma, em seguida, selecione a aba ‘Plugins’.

Passo 2: Execute o plugin do Anima para o Dev Mode (se você não o ver na lista, digite “Anima” no campo de pesquisa).

Passo 3: Selecione qualquer componente, camada ou frame no Figma.

Passo 4: No painel à direita, você obterá código React e CSS executável. Você pode usar o toggle para mudar para Tailwind ou Styled Components.

Você pode alternar facilmente entre a instância selecionada do seu componente (‘Usage’) e sua definição completa (‘Source’), que inclui todas as variantes e subcomponentes.

Você também pode alternar entre JSX e TSX usando o menu dropdown acima da janela de código.

Passo 5: Clique em ‘Download selection’ para obter um arquivo zip com todo o seu código ou clique em ‘Open in CodeSandbox’ para executá-lo instantaneamente.

Opção 2: Gerar código React para flows completos

Passo 1: Abra o plugin do Anima no Figma.

Passo 2: Selecione a opção ‘Turn Design to Code’.

Passo 3: Selecione os componentes do Figma, telas ou flows que você quer converter para React.

Passo 4: Clique o botão ‘Sync’ na parte inferior da janela do plugin.

Passo 5: Clique ‘Go to Anima’ quando a sincronização estiver completa.

Passo 6: Você será redirecionado para o seu projeto no applicativo web do Anima, onde você deve selecionar o ícone de ‘<> Code’ para alternar para o modo de código.

Passo 7: Selecione ‘React’ nas opções de framework, escolha entre ‘Javascript’ ou ‘Typescript’ e clique ‘Change to React’.

Passo 8: Clique o botão ‘Export Code’ no topo da tela, onde você pode fazer download do arquivo .zip do seu pacote de código para uma seleção específica, tela, ou o projeto completo.

Construa o seu frontend 2x mais rápido com componentes React instantâneos no Figma Teste gratuitamente Anima!

The post Figma para React: Como gerar componentes limpos de React no Figma appeared first on Anima Blog.

Se você está se perguntando como converter Figma para HTML sem escrever o código você mesmo, veio ao lugar certo. Nesse artigo, mostraremos como exportar os seus designs do Figma como HTML pronto para produção em alguns passos simples usando o Anima.
O Anima permite que você crie protótipos de alta fidelidade baseados em código no Figma, Adobe XD e Sketch, e depois exportar esses protótipos como código HTML amigável para desenvolvedores em apenas alguns cliques.
Ir diretamente do Figma para HTML permitirá que você crie protótipos web interativos, servir seus próprios sites simples ou landing pages e fornecer aos desenvolvedores pacotes de código limpo para toda a interface do usuário, acelerando o processo de desenvolvimento.

Vamos lá!

***Aprende mais facilmente visualizando? Confira o nosso tutorial no YouTube ‘Figma para HTML’***

Como converter designs do Figma para HTML

Você pode exportar um pacote completo de código HTML ou obter o código de componentes individuais do seu design no Figma. Aqui estão duas maneiras fáceis de obter HTML e CSS do Figma, usando o Anima:

1. Opção (1): Exportar páginas web HTML completas e flows do Figma (requer acesso de edição no Figma): 
2. Opção (2): Exportar um pacote de código HTML do Dev Mode do Figma (disponível com acesso somente-leitura no Figma): 

Opção (1): Exportar páginas web HTML completas e fluxos do Figma (é necessário acesso de edição)

Passo 1: Execute o Plugin da Anima no Modo de Edição do Figma

Primeiro, abra seu projeto no Figma no Modo de Edição (o modo principal) e execute o plugin da Anima.

Se você já executou o Anima em Dev Mode, ela aparecerá em “Recents”.

Passo 2: Sincronize o projeto do Figma que você deseja exportar como HTML

Para abrir o projeto do Figma no aplicativo web do Anima, você precisará sincronizá-lo. (Aprenda a sincronizar seu design).
Quando seu design for sincronizado com sucesso no aplicativo web do Anima, você será notificado no plugin do Anima. Clique em “Go to Anima” para abrir uma nova guia do navegador com uma prévia do seu design do Figma.

Passo 3: Selecione suas opções de exportação (HTML e CSS) e exporte o código.

Clique em “Export Code” no canto superior direito e selecione “Full Project”. Em seguida, abrirá uma janela pop-up para confirmar o framework que deseja exportar. Neste caso, selecionaremos “HTML”, “Pixels” (Px) e “Flexbox” (para manter o comportamento responsivo definido no design do Figma).

Clique em “Download ZIP” e pronto! O Pacote de Código do seu projeto está pronto.

O que tem no Pacote de Código?

O Pacote de Código baixado é salvo no seu computador como um arquivo zip no local que você selecionou. Neste arquivo zip, você encontra todos os arquivos para o seu design (isso inclui os arquivos HTML, CSS, imagens e fontes).

Um pacote de código HTML automaticamente gerado pelo Anima

Depois de descompactar os arquivos, você pode pré-visualizá-los localmente no seu navegador clicando duas vezes no arquivo HTML. Você poderá ver todos os seus elementos responsivos e interações, assim como o produto final!

Abrir os arquivos em um editor de texto apresentará um código HTML e CSS bem estruturado.

Para cada tela criada, você recebe um arquivo HTML e CSS correspondente.
As telas com breakpoints compartilham o mesmo arquivo HTML e CSS.

Opção (2): Exportar um pacote de código HTML diretamente do Dev Mode do Figma (disponível com acesso somente-leitura no Figma)

Passo 1: Execute o plugin do Anima do Dev Mode o Edit Mode

Em seguida, você precisa abrir o plugin do Anima para o Dev Mode.

Se você não o vê na lista, pode digitar “Anima” no campo de pesquisa (veja acima). A partir daí, você pode executar o plugin ou fixá-lo no topo do painel para fácil acesso.

Passo 2: Selecione um Componente, Camada ou Frame no Figma.

Selecione qualquer componente, camada ou frame no Figma para obter seu código HTML correspondente em tempo real. Você pode então copiar o código do painel, abri-lo no CodeSandbox ou baixar o pacote de código.

Esta opção é a mais rápida e direta para componentes individuais e telas. É perfeita para a transição para desenvolvedores, já que o Dev Mode é acessível também para somente-leitura.

No entanto, se você quer exportar um projeto completo, com várias páginas e interações, será necessário usar o aplicativo web da Anima. Mas não se preocupe, ainda é bastante fácil e rápido!

Pronto para exportar código HTML pronto para produção para seus designs no Figma?

Bem-vindo a bordo, vamos começar!

• Plugin Anima para o Figma
• Registre-se no Anima
• Quer aprender como criar websites responsivos, adicionar vídeos, links, interações e mais? Confira nosso canal no YouTube.

The post Como exportar Figma para HTML appeared first on Anima Blog.