Nessa aula, eu apresentei como funciona a estrutura de tokens do nosso design system (Hive). Expliquei os processos necessários para chegar a uma estrutura organizada. Pontos importantes da aula: - Estrutura de Tokens: Mostrei a estrutura de tokens do nosso design system no Figma, incluindo como adicionar novidades nas variáveis como layout grid e espessura de borda. - Processo Manual: Enfatizei que, apesar de haver um processo manual envolvido, o uso do template de taxonomia facilita a organização dos tokens. - Colaboração com Desenvolvedores: Destaquei a importância de trabalhar em conjunto com os desenvolvedores para entender como eles utilizam as variáveis de design, como cores, espaçamentos e tipografia, em diferentes plataformas (web, Android, iOS). - Convenção de Nomes: Discuti a necessidade de alinhar a convenção de nomes entre design e desenvolvimento para garantir uma comunicação clara e evitar redundâncias ou confusões. - Variáveis Primitivas: Apresentei as variáveis primitivas, como cores, espaços, opacidade, fontes, tamanhos e sombras, e como elas são estruturadas no nosso design system. - Tipografia: Expliquei que, embora o Figma ainda não suporte variáveis tipográficas, é possível documentar essas variáveis e preparar-se para quando essa funcionalidade estiver disponível. - Cores no Modo Escuro: Mostrei como ajustar as cores para o modo escuro, mantendo a consistência da cor principal, mas fazendo ajustes sutis para garantir a legibilidade. - Auditoria de Design: Instruí sobre a importância de realizar uma auditoria de design para documentar todos os elementos visuais que serão transformados em variáveis primitivas. - Template de Taxonomia: Comentei sobre o meu template modular e programável que facilita a criação e organização de tokens, e mencionei que disponibilizarei esse recurso para os alunos. A importância da colaboração com desenvolvedores e como utilizar ferramentas e templates para otimizar esse processo.
Links da aula
Data de lançamento
21/04/2025
Duração
Legendas
Português [PT-BR]
Tags
tokens, design, colaboração, tipografia, auditoria
Title Example
Message Example