Conteúdo do Curso
UI/UX com Figma
UI/UX com Figma
1. Ferramentas Básicas do Figma
Formas
Desenhando formas
Aprenda a criar formas usando ferramentas como retângulo, elipse, polígono, linha ou estrela. Clique e arraste para desenhar uma forma livremente, segurando Shift para restringir proporções (por exemplo, um quadrado ou círculo perfeito) ou Alt/Option para expandir a forma a partir do centro.
Ajustando dimensões e proporções
- Use o ícone de corrente no painel de Layout para restringir ou desvincular proporções ao redimensionar formas;
- Ajuste a opacidade para alterar a transparência da forma;
- Modifique o raio de canto para bordas arredondadas, com a capacidade de definir valores separados para cantos individuais, se necessário.
Adicionando preenchimentos e contornos
As formas podem ser personalizadas com:
- Preenchimentos: aplique cores sólidas, gradientes ou ajuste a opacidade do preenchimento;
- Contornos (bordas): personalize a posição (dentro, centro, fora), espessura (peso) e estilo (sólido, tracejado, pontilhado). Você também pode ajustar as configurações de traço e espaço para padrões personalizados;
- Linhas: inclua opções adicionais como pontos de início e fim (por exemplo, setas, círculos).
Efeitos e aprimoramentos
Adicione efeitos às formas para visuais aprimorados:
- Sombras projetadas e sombras internas para profundidade;
- Desfoque e desfoque de fundo para um visual polido.
Editando formas vetoriais
Para editar uma forma vetorial:
- Clique duas vezes na forma ou clique no ícone Editar Objeto no painel de design para entrar no modo de isolamento;
- Use a ferramenta de curvatura para criar curvas e ajustar pontos vetoriais conforme necessário;
- Saia do modo de edição clicando em um espaço vazio ou no botão X.
Seguindo essas técnicas, você pode criar e personalizar formas com precisão e criatividade.
Se você deseja saber mais sobre gráficos vetoriais e imagens raster, recomendo conferir o capítulo Raster vs. Vetor no curso Fundamentos do Adobe Illustrator.
Tudo estava claro?
Obrigado pelo seu feedback!
Seção 2. Capítulo 3