Design System
Design System Multi-tenant
De arquivos Figma defasados na Play4tune a uma base de tokens única que hoje também sustenta a Multibet e a Supernova
Arquitetado e construído do zero para sustentar a operação multi-tenant da Play4tune (Brasil, Colômbia, Paquistão), o design system hoje também dá suporte à Multibet e à Supernova — 87 telas, 200+ componentes, cortando o tempo de criação de novas telas em ~80%.
PAPEL
Arquitetura de Design System
DURAÇÃO
Em andamento desde janeiro
PLATAFORMA
Web (multi-tenant)
SQUAD
Eu (arquitetura) + líder (refinamento) + colega (aplicação)
CONTEXTO
O desafio
Antes do design system existir, não havia reuso real de componentes entre tenants: cada tela nova exigia entrar em arquivos específicos e garimpar o componente de onde ele tivesse sido usado da última vez — e esses arquivos ficavam defasados quase imediatamente. Na prática, nunca existia uma fonte única e atualizada: cada designer trabalhava com uma versão ligeiramente diferente da interface, o que gerava inconsistência visual e retrabalho constante entre design e desenvolvimento.
ABORDAGEM
Como cheguei lá
Arquitetura de tokens
Base estruturada em Figma variables com aliasing primitiva → semântica — a mesma disciplina de tokens usada hoje neste portfólio. Do lado do código, os tokens migram para o Storybook por sincronização própria (script/processo manual, sem Tokens Studio ou Style Dictionary na ponte).
Automação de tema por tenant
Em vez de customização manual, cor por cor, tela por tela, criei uma camada de automação sobre a base semântica que gera o tema de cada tenant automaticamente — hoje atende 3 tenants, eliminando a troca manual de cor e acelerando a entrada de novos tenants no sistema.
Dívida técnica em paralelo
Corrigi componentes cadastrados sem cobertura responsiva completa e migrei componentes antigos para o padrão novo — dois problemas de dívida técnica resolvidos junto com a evolução da base, não depois dela.
Governança compartilhada
A evolução da base ficou dividida entre arquitetura (eu), refinamento (liderança) e aplicação rigorosa no dia a dia (um colega de time) — o que ajudou a manter consistência mesmo com mais de uma pessoa mexendo no sistema. Um processo formal de review/versionamento ainda está amadurecendo.
SOLUÇÃO
O sistema em uso
Home
Gamepage
Welcome Bonus
Telas reais em produção, do mobile ao desktop, com os mesmos tokens e componentes do design system.
Biblioteca de componentes documentada no Storybook — nomes catalogados, sem exibir nenhuma tela real por confidencialidade.
IMPACTO
Resultados
(métricas sujeitas a aprovação de divulgação)
0
telas sustentadas pelo design system
0+
componentes reutilizados entre tenants
3
tenants atendidos pela automação de tema
1/5
do tempo para criar uma tela nova
outros projetos
Zentupet →CONTATO
Vamos conversar sobre o seu projeto?
Preencha os campos abaixo — sua mensagem chega direto no meu WhatsApp, sem formulário de e-mail e sem espera.