Camadas 101: Explore os tipos de camadas

Existem vários tipos de camadas diferentes que você pode criar no Figma Design. Abordaremos o básico aqui, mas há ainda mais camadas para explorar.

Estruturas

As estruturas são fundamentais no Figma. Pense nelas como contêineres nos quais é possível colocar outros objetos. Elas permitem que você organize suas camadas em designs coesos.

As estruturas podem ter dimensões definidas e ter propriedades exclusivas. Elas também dão acesso a recursos avançados do Figma, como componentes, layout automático e prototipagem.

As predefinições de estruturas agilizam a criação de estruturas para as dimensões mais utilizadas. Isso inclui telas e dispositivos, como iPhone ou Apple Watch, ou dimensões de assets, como publicações em redes sociais e banners.

Nesta imagem, temos uma predefinição de estrutura com as dimensões de um iPhone 14 e 15 Pro Max. Você pode selecionar predefinições de estrutura na barra lateral direita, quando a ferramenta de estrutura estiver selecionada.

Texto

A tipografia é importante para a maioria dos designs de interface. Uma tipografia eficaz pode comunicar informações, chamar atenção, criar hierarquia e evocar emoções.

Use a ferramenta Texto T para criar camadas de texto e, em seguida, digite para adicionar texto. Use a seção Tipografia na barra lateral direita para formatar e estilizar seu texto. Use outras seções, como Preenchimento, para alterar outros aspectos do seu texto, como a cor.

O Figma vem com uma seleção de centenas de fontes gratuitas do Google para você começar, mas você também pode adicionar e usar suas próprias fontes.

O texto desse design de cartão usa Space Grotesk, uma fonte gratuita do Google que está disponível para todos os usuários do Figma.

Formas

Formas, como retângulos R, elipses O e polígonos, podem adicionar interesse visual e personalidade aos seus designs.

Você também pode combinar várias formas para fazer criações, como ícones. A ferramenta Caneta P também pode ajudar a criar linhas retas e curvas ou formas e ilustrações personalizadas

O octógono acima foi criado usando a ferramenta polígono. Você pode usar o campo Contagem na seção Aparência para ajustar o número de lados de um polígono.

Imagens

Precisa adicionar fotografias, capturas de tela e outros recursos visuais aos seus designs? Sem problemas. O Figma Design também permite adicionar imagens, GIFs e vídeos.

No Figma Design, imagens e vídeos são um tipo de preenchimento, não um tipo de camada. Isso permite que você adicione imagens a qualquer camada que aceite propriedades de preenchimento e traçado, incluindo estruturas, formas e até texto.

Arraste e solte ou copie e cole imagens em seus arquivos. O Figma adicionará as imagens como preenchimento em uma nova camada retangular. Já tem uma forma que precisa de um preenchimento de imagem? Adicione diretamente na seção Preenchimento da barra lateral direita.