1. Crie um componente.

No editor Figma, selecione as camadas que deseja incluir em seu componente. Clique no Componente ícone na barra de ferramentas ou use o atalho de teclado Cmd/Ctrl + Alt + K .

Em Criar componente caixa de diálogo, insira um nome para seu componente e selecione uma categoria. Clique em Criar botão.

2. Use componentes.

Para usar um componente, basta arrastá-lo da seção Ativos painel em sua tela. Você também pode usar o Inserir> Componente item de menu.

Ao inserir um componente, você pode redimensioná-lo, girá-lo e invertê-lo como qualquer outra camada. Entretanto, diferentemente das camadas normais, os componentes podem ser editados sem afetar outras instâncias do mesmo componente.

3. Editar componentes

Para editar um componente, clique duas vezes nele. Isso abrirá o componente no modo de edição. No modo de edição, você pode fazer alterações no design do componente. Quaisquer alterações feitas serão aplicadas a todas as instâncias do componente.

4. Excluir componentes

Para excluir um componente, selecione-o na tela e pressione o botão Excluir chave. Isso excluirá o componente dos Ativos painel e de todas as instâncias onde ele é usado.

5. Gerenciar componentes

Os Ativos painel é onde você pode gerenciar seus componentes. Você pode arrastar e soltar componentes ou usar o Filtro campo para pesquisar componentes específicos.

Para exportar componentes, selecione-os em Ativos painel e clique em Exportar ícone. Você pode exportar componentes como arquivos SVG, PNG ou JSON.

Dicas para usar componentes no Figma

- Use componentes para criar designs consistentes. Os componentes podem ajudar você a manter seus projetos consistentes, garantindo que todas as instâncias de um elemento específico tenham a mesma aparência e comportamento.
- Use componentes para acelerar seu fluxo de trabalho. Os componentes podem economizar tempo, eliminando a necessidade de criar os mesmos elementos repetidamente.
- Use componentes para compartilhar seu trabalho de design com outras pessoas. Os componentes facilitam o compartilhamento do seu trabalho de design com outras pessoas, mesmo que elas não tenham acesso ao editor Figma.

Conclusão

Os componentes são um recurso poderoso do Figma que pode ajudá-lo a criar designs consistentes e coesos. Ao usar componentes, você pode acelerar seu fluxo de trabalho e compartilhar seu trabalho de design com outras pessoas.