purebilliontech/design-pro

Design Pro

Uma camada de roteamento sobre 328 manuais de design de sete coleções publicadas, com um pipeline orquestrado para construções de UI. Cada manual é um arquivo de referência autocontido. Leia apenas os que a tarefa exigir — nunca carregue a biblioteca inteira.

Primeira bifurcação: é uma construção de UI?

Antes de classificar, decida em qual dos dois caminhos o pedido se encaixa. Acertar isso é o que separa uma saída distinta de uma saída genérica.

Caminho A — Construir / projetar / melhorar uma superfície de UI (uma página, tela, componente, landing page, site de marketing, visualização de aplicativo ou dashboard — e você realmente irá produzir ou alterá-la):

→ Leia references/process/orchestrate.md e siga-o. É o pipeline obrigatório. Ele aciona o motor anti-genérico incluso (tastemaker) como espinha dorsal, roteia as outras áreas a serviço dele e impõe uma barreira final anti-slop. Não entregue uma construção de UI diretamente a um único manual — esse é o caminho do painel passivo que produz "qualquer IA poderia ter construído isso."

Caminho B — todo o resto (crítica sem alteração, pesquisa e estratégia, uma cena pura de Three.js / shader, um showreel de motion, um sistema de jogo, uma ilustração SVG, "qual skill cobre X"):

→ Use o painel de controle abaixo.

Painel de controle (Caminho B)

1. Classifique o pedido em uma das cinco áreas abaixo.
2. Leia o INDEX.md dessa área. Ele lista todos os manuais da área com sua descrição de gatilho completa.
3. Leia um ou dois manuais que correspondam. Siga-os conforme escritos — eles são a especialidade; este arquivo é apenas o painel de controle.
4. Se nada corresponder, diga isso e prossiga com seu próprio julgamento, em vez de forçar um encaixe ruim.

Ler dois manuais de áreas diferentes é normal e correto. Ler seis é sinal de que o pedido precisa ser dividido em etapas.

As cinco áreas

Área	Leia quando o trabalho for sobre	Índice
ui-craft (82)	Polimento, tipografia, sistemas de cor, acessibilidade, layout, copy de interface, padrões de interação, animação e sensação de movimento, crítica visual. A camada "isso parece e soa certo".	references/ui-craft/INDEX.md
web-build (121)	Landing pages, sites de marketing, design engineering, storytelling com scroll e GSAP, transformar referências ou gravações de tela em prompts, captura de página, geração de artigos e imagens. A camada "construir a página".	references/web-build/INDEX.md
process (63)	Pesquisa de usuário, entrevistas, personas, JTBD, mapas de jornada, pesquisas, testes de usabilidade, governança de sistemas de design, tokens, design ops, especificações de handoff, trabalho com stakeholders e negociação. A camada "como o trabalho é decidido".	references/process/INDEX.md
motion-3d (36)	Cenas Three.js, materiais, iluminação, água, raios divinos, tours virtuais, showreels de motion, apresentações em vídeo para web e estilos de ilustração SVG feitos à mão.	references/motion-3d/INDEX.md
games (26)	Arquitetura de jogos, loops de gameplay, sistemas de combate, VFX de habilidades, QA de gameplay.	references/games/INDEX.md

Dicas de roteamento

Estas são as chamadas que são fáceis de errar:

• "Deixe mais bonito" / "isso parece gerado por IA" — se você realmente alterar a UI, é Caminho A → references/process/orchestrate.md. Se for apenas crítica, é ui-craft (verbo audit do tastemaker / better-interface).
• "Revise esta interface" (sem alteração) → ui-craft (better-interface fornece um relatório ranqueado em todas as seis lentes).
• Construir uma nova página de marketing → Caminho A → references/process/orchestrate.md. Não roteie diretamente para web-build + ui-craft como dois motores separados; o orquestrador executa um motor, fundamentado e controlado.
• Uma animação parece errada mas você não sabe dizer por quê → ui-craft, os manuais de animação. Easing e duração geralmente são a causa.
• "Devemos construir isso?" → process, não ui-craft. Pesquisa e estratégia precedem o ofício.
• Um design estático que precisa se tornar um vídeo → motion-3d.
• Qualquer coisa com um arquivo Figma como entrada → web-build (build-design).

Arquivos de suporte

Alguns manuais vêm acompanhados de scripts e material de referência em uma pasta irmã chamada <playbook>.files/. Quando um manual se referir a suas próprias referências ou scripts, procure lá. Assets de demonstração (vídeos, capturas de tela, texturas) não foram incluídos — se um manual apontar para um, trate-o como ilustrativo e prossiga.

Proveniência

Cada manual traz um cabeçalho com o nome de seu repositório de origem e autor. Todas as sete coleções são licenciadas sob MIT e incluídas sem modificações, exceto por esse cabeçalho:

Coleção	Autor	Manuais
MengTo/Skills	Meng To	178
Owl-Listener/designer-skills	MC Dean	111
emilkowalski/skills	Emil Kowalski	15
jakubkrehel/skills	Jakub Krehel	14
ConardLi/garden-skills	ConardLi	6
codeswithroh/tastemaker	codeswithroh	2
elayadesign/ai-design-skills	Elaya	2

Mantenha a atribuição intacta ao citar o conteúdo de um manual em trabalhos voltados para o cliente.