Pular para o conteúdo
SubjectFelipe Paulino · UI Specialist
Time / FocoZé Delivery · AI Design
Window2025 — 2026

Cincoentregáveis.Um eixo.

Como UI Specialist no Zé com foco em AI, virei o craft de UI em autonomia pro time — Design System para o app, versão pra prototipação com IA, plugin que aplica o sistema sozinho, skills de craft e a cerimônia que ensinou os PDs a usar tudo isso. Cada um existe pra libertar o time, não pra terminar uma tela.

Reading time~ 4 min
Entregáveis
5
Frentes contínuas
Tokens · DS
427
Gelada · +40 componentes
Skills LIPE
9
Verbos pra IA · open
Café com AI
2×/sem
Cerimônia · designers Zé
01 · 5× Entregáveis

Os cinco que multiplicam.

Live · em produção
[ 001 ] · Design System

DS Gelada.

UI Specialist · Mantenedor
Plataforma
Figma · base de design
Marco
Refundado · Q4 2025
DNA
Cara e marca Zé Delivery
Status
Funcional · governança em consolidação
Dor

App do Zé crescendo em surface — promo, gamificação, restaurantes, palpites — sobre uma fundação que já estava cansada. Tokens fragmentados, componentes que viviam em ilhas, identidade visual diluída em cada feature nova. Brand do Zé perdendo presença visual, time perdendo velocidade revisando o que já existia.

Solução

Design System refeito do zero no final de 2025. Não foi reformulação — foi refundação. A base de tudo que o Zé desenha hoje no Figma, com o DNA da marca incorporado em cada decisão: do token primitivo à ilustração spot.

  • Tokens semânticos + primitives + text styles, pensados pra carregar identidade Zé
  • Componentes desenhados pra produção real, com governança de variantes e ready-for-dev marcado
  • Biblioteca de ícones e ilustrações curada com tom da marca
  • Figma como single source of truth — toda decisão de design parte daqui

Impacto

Citado na 360 como cartão de visitas do time — “o lugar onde a interface ganha alma”. Padrão alto inclusive sob pressão. Base sobre a qual todo o resto deste documento se apoia — Gelada for Builders, Stella, AI Builders: tudo parte daqui.

Escala
427
Tokens
+40
Componentes
271
Ícones
174
Ilustrações
Tags
Design SystemFigmaRefundação 2025Brand DNATokensGovernança
Live · em rollout
[ 002 ] · DS para Prototipação AI

Gelada for Builders.

Autor · UI Specialist
Plataformas
Cursor · Figma Make · AI Builders
Público
Time de Design e Produto
Status
Em uso · em amarração
Período
2025 — 2026
Dor

Design e Produto querem prototipar de verdade — navegável, com os componentes reais do app — mas o DS Gelada oficial é app-first e não cabe em Cursor, no Figma Make ou no AI Builders interno do Zé. Resultado: protótipo solto em Figma estático, ou pior, recriação do zero que diverge do produto sem ninguém ver.

Solução

Versão do Gelada empacotada pra prototipação assistida por IA, ajudando Design e Produto a montarem telas reais e extremamente ricas — não placeholders, não wireframe.

  • Funciona no Cursor — descreve, IA monta tela com componentes reais
  • Funciona no Figma Make — protótipo gera HTML/React aderente ao Gelada
  • Funciona no AI Builders (Builder interno do Zé) — protótipos prontos pra rodar
  • Tokens W3C, documentação otimizada pra contexto de LLM

Impacto

Design e Produto prototipam com a verdade do produto— telas ricas, navegáveis, fiéis ao app. Implementação completa em semanas, comprimindo um trabalho de dois anos. Pioneirismo citado pelos pares como referência de “ousadia + craft” e adoptado como prática nos critique-rooms.

Tags
AI DesignPrototipaçãoCursorFigma MakeAI BuildersTokens W3C
Live · em uso
[ 003 ] · Plugin Figma

Stella.

Autor · Design + Code
Stack
React · TypeScript
Função
Linter de DS · Auto-apply
Público
Product Designers
Período
2025 — presente
Dor

DS complexo + escala de PDs = hardcode involuntário. Cores soltas, raios divergentes, spacings fora do sistema. Cada divergência fragmenta o brand e empurra carga de patrulha pra quem mantém o DS — sem multiplicar.

Solução

Plugin que varre o arquivo, identifica valores que deveriam estar usando tokens, sugere a variável correta e aplica com um clique.

  • 5 matchers — Color, Effect, Radius, Spacing, Stroke
  • Suggestion engine que mapeia valor hardcoded → token semântico
  • Auto-apply para correção em massa
  • Checklist guiado de auditoria do arquivo
  • Companion: Stella Variables Manager — visualizar, buscar e exportar variáveis em W3C / CSS / SCSS / JS

Impacto

Adoção do Gelada acelera sem patrulha. PD não precisa decorar o sistema — o plugin guia. Brand fica consistente porque o caminho certo virou o caminho fácil.

Tags
Figma PluginLinterAuto-applyDS AdoptionVariablesW3C Tokens
Beta · em uso
[ 004 ] · AI Skill

Skill — LIPE.

Autor · AI Design Practice
Verbos
9 skills
Plataformas
Claude · Cursor · Codex
Conexão
Ancorada no DS Gelada
Visão
Bridge código ↔ design
Dor

Designer precisa destravar UI rápido — explorar variações, criar componentes em ritmo de ideia. Mas IA solta produz UI que diverge do Gelada: cores fora do token, hierarquia improvisada, padrões que não casam com o app. Falta um direcionador que costure exploração rápida com o sistema real do Zé.

Solução

Conjunto de skills com verbos de craft, ancoradas no DS Gelada do Figma. Cada verbo direciona a IA a criar / explorar UI mantendo as decisões dentro do sistema:

  • Bolder — aumenta presença visual
  • Quieter — reduz ruído, baixa peso
  • Critique — auditoria estruturada de UI
  • Distill — destila em essência
  • Polish — refino fino de detalhes
  • Layout — corrige hierarquia espacial
  • Typeset — tipografia editorial
  • Delight — micro-momentos

Impacto

PD destrava UI rapidamente sem sair do Gelada. Componente novo nasce já aderente. Exploração mantém ritmo, qualidade não cai. Visão futura: evoluir pra ser a ponte entre código e design — skill que conhece tanto o Gelada do Figma quanto o Gelada for Builders no código, e mantém os dois em sincronia.

Tags
AI DesignSkillExploração rápidaDS-awareCode ↔ DesignClaude · Cursor
Live · 2×/sem
[ 005 ] · Cerimônia

Café com AI.

Criador · Facilitador
Cadência
2× por semana
Audiência
PDs do Zé
Foco
AI aplicada a Design · UI
Período
2025 → presente
Dor

PDs sentem a pressão de usar IA no dia a dia, mas onde começar? O mercado lança ferramenta nova toda semana, conceitos novos (Skills, MCPs, agentes...) — e o conhecimento acaba concentrado em poucas pessoas do time. Quem não tem tempo de explorar fica pra trás, e a autonomia trava.

Solução

Cerimônia 2× por semana com os PDs do time pra ensinar AI aplicada a Design — com foco em UI, mas trazendo o panorama do mercado.

  • Ferramentas — Cursor, Figma Make, Claude, Codex, AI Builders e o que vai surgindo
  • Conceitos — Skills, MCPs, agentes, prompts, contexto, fluxos
  • Casos reais — eu mostro o que aprendi na semana, eles mostram o que tentaram, abrimos junto e fazemos
  • Sem palestra, sem slide — prática + repetição até virar reflexo

Impacto

PDs ganham autonomia. Saem da cerimônia conseguindo aplicar IA no próprio fluxo, sem depender de mim como ponte. Um dos comportamentos mais citados na 360 (“nível de referência” em Curiosidade). O gerente direto sugeriu espelhar pra “Cafezinho com UI” — mesma fórmula, foco em craft.

Tags
CapacitaçãoAI ToolingSkills · MCPsAutonomiaCerimôniaCuriosidade