Nesta aula eu mostro passo a passo como estruturar uma tabela de planos no Figma de forma organizada e fácil de alterar. Começo criando o esqueleto com stacks para linhas e colunas, ajustando larguras mínimas, paddings e gaps, e montando um header consistente. Uso componentes prontos para economizar tempo, duplico linhas e títulos, e aplico bordas e cores padronizadas para que o layout fique uniforme e responsivo. Em seguida eu crio um componente "célula" com quatro estados (texto, check, ilimitado e X), padronizo tamanhos (por exemplo 64px) e variáveis de cor para facilitar a troca entre estados. Ajusto tipografias, espaçamentos e radiuses do card, duplico as linhas necessárias e preencho os conteúdos provisórios. O objetivo é ter um layout-esqueleto sólido: fácil de manter, editável pelo cliente e pronto para refinamentos de design e versão mobile. Termos e significados: - Stack: agrupamento vertical ou horizontal que organiza elementos em sequência. - Fit / fio (fill): ajuste para que o elemento ocupe apenas o espaço necessário (fit) ou preencha o disponível (fill/fio). - Padding: espaço interno entre o conteúdo e a borda do elemento. - Gap: espaçamento entre elementos dentro de uma stack. - Componente: elemento reutilizável que pode ter variações (estados). - Variável de cor/estado: configuração que permite trocar cores ou conteúdos do componente sem refazer o layout. - Prototype/Figma: Figma é a ferramenta de design; protótipo é a versão navegável do layout.