Downloads - Template de taxonomia: https://docs.google.com/spreadsheets/d/1u13-7WEVNsf61ZlTJkVXyaxq51cI4UHlyh2J5WWVwKA/copy - Copie o link a seguir no plugin para usar os tokens do Hive: Nessa aula, eu mostrei como importar e começar a usar o nosso template que disponibilizei acima para facilitar o trabalho com as variáveis no nosso Design Systems no Figma. Antes de tudo, é importante saber que para usar o template, é necessário ter uma conta doGoogle, pois ele foi criado noGoogle Sheetse é acessado viaGoogle Drive. Pontos importantes da aula: - Acesso ao TemplateAo clicar no link fornecido acima, você será direcionado para fazer uma cópia do documento noGoogle Drive. - Apps ScriptO template possui funções rodando no Apps Script do Google para automatizar tarefas. Ao criar uma cópia, você precisará autorizar essas funções. - Código e FunçõesNão é necessário entender de código para usar o template. As funções já estão criadas e são responsáveis por ações como adicionar cores, alterar contrastes e definir a semântica correta. - Criação e Duplicação de TokensVocê pode criar tokens primitivos e semânticos, além de adicionar novos tokens duplicando as coleções existentes e alterando os nomes conforme necessário. - Exportação para o FigmaPara importar os tokens para o Figma, você deve usar a função "cfPRO Figma Token" no Apps Script e executá-la. Isso criará um novo documento que será usado para importar os tokens no Figma através do plugin "Design Tokens Manager". - Autorização do GoogleDurante o processo, será necessário autorizar o acesso do Apps Script ao seu Google Drive para que ele possa criar o documento necessário para a importação dos tokens. - Importação no FigmaNo Figma, você usará o plugin "Design Tokens Manager" para importar os tokens, colando a URL gerada pelo Apps Script. - Atualizações GlobaisO template permite fazer alterações globais rapidamente. Por exemplo, alterar a cor principal do design system e ver essa mudança refletida em todo o design imediatamente. - Próximos PassosNo próximo módulo, vamos começar a criar componentes e a estrutura do Design System, utilizando os tokens já criados. O objetivo é desenvolver um design system piloto que poderá ser publicado pelos alunos. Lembre-se de que o uso do template é opcional. Se preferir, você pode simplesmente importar os tokens já criados no template do Hive. Isso permitirá que você acompanhe as próximas aulas da mesma forma.
Data de lançamento
22/04/2025
Duração
Legendas
Português [PT-BR]
Tags
downloads, template, figma, tokens, automatização
Title Example
Message Example