ux-skill

# ux-skill — Mecanismo de Inteligência de Design para Ferramentas de Codificação de IA ux-skill é um **mecanismo de inteligência de design** projetado para tornar a UI gerada por IA distinta em vez de genérica. Ele integra-se a 17 ferramentas de codificação de IA, incluindo Claude Code, Cursor, Windsurf, GitHub Copilot, Gemini CLI, Codex e outras. O mecanismo é gratuito, licenciado sob MIT, funciona offline e nunca chama um LLM. ## Principais Recursos - **Sintetizador determinístico de 7 eixos**: Compila briefs em tokens de design novos (calor, contraste, densidade, geometria, formalidade, movimento, personalidade tipográfica) sem escolher de modelos. - **152 regras de lint anti-AI-slop**: Regras determinísticas baseadas em regex que rodam em CI e saem com código não zero em problemas Críticos/Altos. - **160 especificações de marca**: Especificações reais de DESIGN.md para marcas como Apple, Stripe, Linear, Figma, Tesla, BMW, Notion, Spotify, Airbnb, Vercel, Supabase, Cursor, Raycast, Claude e mais. - **12 manifestos JSON consultáveis**: 84 estilos, 176 paletas, 70 pares tipográficos, 148 componentes, 184 indústrias, 35 tipos de gráfico, 57 predefinições de movimento, 112 leis de UX, 152 regras anti-padrão, 25 pilhas tecnológicas e 160 especificações de marca. - **25 comandos de barra**: Descoberta, geração, auditoria, lint, polimento, loop de correção, estudo de caso, workshop, copy, movimento, a11y, painel e comandos de condução. - **5 subagentes**: Engenheiro frontend, engenheiro de movimento, redator, sintetizador de pesquisa e arquiteto de sistema de design. - **18 ferramentas MCP**: Incluindo ux_synthesize, ux_decisions_query e ux_decisions_stats. - **Suporte a 17 IDEs**: Mesmo mecanismo com diferentes colas por IDE. - **Offline e determinístico**: Sem chamadas de LLM, a mesma entrada sempre produz a mesma saída. ## Instalação Três caminhos de instalação estão disponíveis: ### Caminho 1 — Marketplace do Claude Code (canônico) ```bash /plugin marketplace add Laith0003/ux-skill /plugin install ux@ux-skill ``` ### Caminho 2 — pip (universal) ```bash pip install uxskill uxskill init # detecta automaticamente seu IDE, instala o artefato certo uxskill stats # imprime contagens de manifesto para verificar a instalação uxskill lint . # executa o linter no diretório atual ``` ### Caminho 3 — npx (sem Python necessário) ```bash npx uxskill init # baixa pipx + uxskill na primeira execução npx uxskill recommend --industry=fintech-neobank --tone=warm --stack=nextjs-15-app-router ``` ## Como Funciona 1. **Entrada**: Forneça um brief via `/ux-discover` (10 campos) ou flags para `ux recommend`. 2. **5 buscas paralelas**: O mecanismo executa cinco consultas simultaneamente nos manifestos (indústria, estilo, tom, pilha, proibido/região). 3. **Mesclagem**: Um mesclador determinístico classifica candidatos e resolve conflitos. 4. **Saída**: Um documento JSON com estilo, paleta, par tipográfico, predefinições de movimento, componentes, exemplos de marca e proteções anti-padrão. 5. **Geração**: Comandos downstream consomem a recomendação para gerar código via subagentes. 6. **Verificação**: `/ux-lint` reexamina o código gerado contra 152 regras de regex. ## Destaques da v3.1.0 - **Fidelidade de marca reforçada**: Cor primária lida de pixels de logotipo, fontes padrão rejeitadas, piso rígido na avaliação que falha saídas que abandonam cor/logotipo da marca ou não enviam imagens reais. - **Gate mobile-first**: Novas fundações de artesanato mais um gate sensível a quebra que falha em rolagem horizontal, navegação/rótulo de botão com quebra ou cabeçalho fixo alto demais. - **Camada de uau**: O mecanismo deriva 2-3 momentos de assinatura coordenados por página. - **Linter mais afiado**: 152 regras incluindo obrigatoriedade de imagens, detecção só de ícones, token de espaço reservado e regras de 100vw. - **310 testes passando**: Offline, determinístico, nenhum LLM jamais chamado. ## Arquitetura O mecanismo consiste em: - **data/**: Manifestos JSON consultáveis (estilos, paletas, pares tipográficos, componentes, indústrias, tipos de gráfico, pilhas tecnológicas, diretrizes de UX, predefinições de movimento, anti-padrões, marcas). - **engine/**: Núcleo de raciocínio Python (sintetizador, decisões, recomendador, linter, descoberta, gerador, instalador, CLI). - **commands/**: 25 comandos de barra do Claude Code (arquivos .md). - **agents/**: 5 subagentes (arquivos .md). - **references/**: Fonte em prosa para dados e páginas de demonstração. - **bin/**: Wrapper npx e scripts de linter. - **.ux/**: Diretório de estado por projeto. ## Comparação O README inclui uma comparação honesta contra 8 outros plugins de UX do Claude, observando onde ux-skill vence (biblioteca de componentes, predefinições de movimento, linter anti-padrão, especificações de marca, suporte a 17 IDEs, 25 comandos de barra) e onde perde (conscientização, reconhecimento de marca, polimento de marketing). ## Licença Licença MIT. Autor: Laith Aljunaidy, designer e CTO em Amã. Site: uxskill.laithjunaidy.com. GitHub: Laith0003/ux-skill. PyPI: uxskill. npm: uxskill.