Sistema Escalável de Design Tokens
com Tokens Studio
Aprenda estratégias e práticas para escalar decisões de design de forma inteligente, do Figma ao desenvolvimento.
Tokens Studio
Figma Variables
Style Dictionary
Inscrições encerradas!
+80 aulas
gravadas
Toolkits
exclusivos
Vitalício
+ atualizações inclusas
O primeiro curso brasileiro com foco em Design Tokens
O curso transita entre conceitos básicos sobre design tokens e estratégias avançadas para criação de um sistema com alto poder de escalabilidade. O objetivo é que o aluno expanda os conhecimentos e, com o auxilio de diversas ferramentas, consiga solucionar problemas evidentes que englobam a implementação de decisões de design.
Sistemas escaláveis, tem poder de se desdobrar em múltiplas marcas, produtos, plataformas e temas.
Para garantir o entendimento das estratégias e lógica desse desafio vamos percorrer um roadmap. Utilizaremos o plugin Tokens Studio (com dicas para versão FREE e PRO) em conjunto com o Figma Variables durante o estágio de criação de design tokens no ambiente de design. Em seguida, aprenderemos a sincronizá-los com um repositório do GitHub e a transformar o JSON em arquivos adequados para o front-end por meio da ferramenta Style Dictionary.
Que tal um spoiler?
Por trás de toda estratégia de criação de tokens no plugin Tokens Studio, existe uma abordagem whitelabel. E adivinha? Ela é a grande responsável pelo poder de escalabildiade do sistema.
Sou suspeito pra falar mas a Ana é minha referência em entendimento de arquitetura e taxonomia de tokens. Então, ter tido esse contato mais a fundo com seu conhecimento foi algo que considero imprescindível pra minha carreira e meu trabalho com design systems.
Ivan Jangoux
Um curso onde vale cada centavo! Aprendi muito sobre tokens e sua aplicação… e diferentes dos demais curso as aulas abordam uma temática para adotar no dia a dia e não de forma superficial e genérica! Com certeza foi um grande ganho de conhecimento onde irei aplicar no meu trabalho! Recomendo!
Sérgio Vieira
Conteúdo do Curso
O curso é composto por mais de 80 lissões gravadas, totalizando cerca de 20h. Os módulos serão liberados gradualmente, conforme o calendário fornecido abaixo.
A licença do Tokens Studio PRO será enviada por e-mail no dia 31/07, para coincidir com a liberação do módulo introdutório ao plugin.
- Conceitos Básicos
- Características dos Design Tokens
- Tipos de Dados
- Complexidade no Uso de Design Tokens
- Introdução
- Pesquisas Iniciais do Ecossistema
- Mapeamento de Componentes
- Mapeamento de Dores e Desejos
- Iniciando com Estratégias
- Estratégias de Temificação
- É nomenclatura que você quer?
- Nível Semântico: Base
- Nível Semântico: Modifiers
- Nível Semântico: Group e Object
- Nível Semântico: Namespace
- Princípios e Gerador de Nomes
- Dinâmica para Definir Taxonomias
- Escolhendo uma Convenção de Nomes
- Exercício Prático
- Iniciando no Tokens Studio
- Configuração de Sets
- Grupos de Propriedades Nativas
- Gestão por Meio da Estrutura Semântica
- Modificadores
- Estrutura de JSON no Tokens Studio
- Utilizando a Ferramenta “Inspect”
- Criação e Tipos de Temas
- Importação e Exportação de Arquivos Físicos
- Importação e Exportação de Arquivos de um Provedor
- Diferenças entre Versão PRO e FREE
- Documentações Automatizadas
- Ferramentas Auxiliares
- Design Tokens x Variables x Styles
- O Básico do Figma Variables
- As Divergâncias de Tokens Studio e Figma Variables
- Exportação de Design Tokens para Variables
- Importação de Variables para Tokens Studio
- Importação e Exportação de Styles
- Entendimentos Finais
- Folha de Ouro
- Sistemas Podem Ser Expansíveis
- Alternativas para Escolha da Estratégia de Implementação
- Estrutura do Sistema JellyFish
- G_BASE(Core)
- Introdução ao Grupo “BRANDS”
- Relacionamento de Sets de Cores
- Relacionamento de Sets Tipográficos
- Sets de Plataformas
- Sets de Componentes
- Primitives: Dimensions
- Primitives: Font Sizes
- Outros Tokens Primitivos
- Fountadions: Sizes
- Foundations: Spacings
- Outros Tokens de Fundação
- A Abordagem Whitelabel
- Criando Backgrounds
- Criando Foregrounds
- A Sessão “Patterns”
- Typeset
- Typeset: Font-sizes Fluídas
- Composições Tipográficas
- Compondo Sombras
- Criando outras Marcas e Temas
- Desafios da Distribuição para Times de Design
- Bibliotecas 1:1
- Bibliotecas Compartilhadas
- Criação de Componente
- Vinculando Tokens às Variables criadas
- Governança para Releases de Bibliotecas
- Documentações Automatizadas
- Introdução ao Style Dictionary
- Configurator
- Configurações Iniciais
- Variáveis Globais
- Variáveis de Temas
- Typesets
- Alias
- Componentes
- Complementes
- Comandos Básicos
- Desafios do DesignSystemOps
- Releases
- Descontinuação de Tokens
Conheça o projeto do curso
O JellyFish é um sistema de design tokens criado por mim e será utilizado como base de aprendizado no nosso curso. Quer dar uma espiada? Basta encontrá-lo na comunidade do Figma!
Licença PRO
Do plugin Tokens Studio pelo período de um mês!
Licença liberada no dia 31/07/24.
Faça sua inscrição!
Início: 24 Julho • Carga horária total: 20h
A liberação da plataforma é realizada de imediato, após a confirmação do pagamento. No entanto, os módulos serão liberados de acordo com o cronograma. Você receberá um e-mail a na data de liberação.
- Certificado na conclusão do curso
- Acesso vitalício e atualizações aos materiais do curso
- 80 aulas gravadas e canal exclusivo de comunicação
- Licença por 1 mês do plugin Tokens Studio
R$980,00
R$780,00
à vista com PIX ou em até 12x no cartão de crédito com taxas
Quer capacitar colaboradores do seu time? Ganhe 15% de desconto a partir de 2 inscrições. Fale comigo.
Inscrições encerradas!
Ana Takahashi
DesignOps e DesignSystemOps - cVortex
Comecei a trabalhar com design systems em 2019 e desenvolvi uma paixão questionável por sistemas escaláveis. Desde então dedico um pouco do meu tempo para compartilhar experiências neste vasto universo. Atualmente lidero o time de design do cVortex e sou resposável pelas operações de Design e Design System.
Perguntas Frequentes
Este curso é indicado para Designers, Desenvolvedores e Product Managers que estão passando pelo desafio de criar um design system escalável ou que gostariam de entender práticas e lógicas inteligentes para a implementação de design tokens.
As aulas são todas gravadas. Você vai, imediato à inscrição, ter acesso ao primeiro módulo. A instrutura irá responder às duvidas deixadas em cada módulo ou nos canais de comunicação do curso.
Apesar da base conceitual, o curso não é indicado para iniciates devido às abordagens complexas que necessitam de conhecimento mais profundos tanto no uso da plataforma Figma, quanto em CSS.
Sim!!! Pode trazer a turma que o desconto é garantido. Para isso, envie um e-mail para [email protected] para negociar o valor, método de pagamento e recebimento da nota fiscal.
Você pode solicitar sua NF pelo e-mail: [email protected]
O acesso à plataforma é imediata, logo após a aprovação do pagamento. O curso poderá ser acessado pela plataforma na url cursos.sistematicos.tech. É necessário entrar com login e senha para começar os estudos. Os módulos serão liberados de acordo com o cronograma para que o tempo de estudo fique mais confortável.
Você receberá a licença do Tokens Studio por e-mail no dia 31/07/24. A partir desta data sua licença está ativa e tem o prazo de expiração para o dia 30/08/24. Portanto, logo que recebido, já pode ativar!
Sim! Após a finalização do curso você receberá um certificado bonitão!
Você tem o prazo de 7 dias após a confirmação de compra para solicitar o reembolso através do e-mail [email protected]. Se o cancelamento for feito após este período, a devolução será parcial, sendo esta equivalente a 50% do valor pago se até um dia antes do curso inciar. Verifique nossa página de Política de Reembolso e Devolucões para mais informações.