Skip to content
Conduit

skill

ux-ui-review

Skill do Claude para review e redesign de telas de app mobile (iOS e Android) — mede contraste, alvo de toque, plataforma e forma dos controles no próprio print.

igorpdsantos/ux-ui-reviewcommunitylistedunreviewed
Use skill

Set up

Skills are installed by placing their folder where your agent loads skills.

Download ZIP from GitHub Open the repository

The download comes from github.com/igorpdsantos/ux-ui-review itself, not from our server, so what you get is exactly what its author published.

Install instructions come from the README

Skills do not use an MCP config. Follow the steps in the README below.

README

synced Oct 22, 2026

ux-ui-review

Skill para o Claude que revisa, desenha e redesenha telas de app mobile — iOS e Android, nativo ou multiplataforma (React Native, Expo, Flutter, SwiftUI, Jetpack Compose, PWA instalado).

Você manda o print da tela e recebe uma review que mede em vez de achar:

  • Contraste e alvo de toque saem do próprio pixel, com número e veredito contra WCAG, 44pt (iOS) e 48dp (Android).
  • A plataforma é medida, não adivinhada: a barra da base, a Dynamic Island ou o notch dizem se o print é iOS ou Android.
  • A forma dos switches é medida: iOS até o 18, iOS 26, Material 3, ou nenhum dos dois — e o que não bate com a plataforma vira problema.
  • Cada problema vem como o que está errado → por que prejudica quem usa → a correção concreta, e, quando faz sentido, a tela corrigida no estilo do seu projeto.

Versão atual: 1.2.0 · CHANGELOG

Instalar

Claude Code — como plugin (recomendado)

Dentro do Claude Code:

/plugin marketplace add igorpdsantos/ux-ui-review
/plugin install ux-ui-review@igorpdsantos

Ou pelo terminal:

claude plugin marketplace add igorpdsantos/ux-ui-review

claude plugin install ux-ui-review@igorpdsantos

Para atualizar depois: claude plugin update ux-ui-review@igorpdsantos.

Claude Code — com o skills CLI

npx skills add igorpdsantos/ux-ui-review

Claude Code — cópia manual

Para todos os seus projetos:

git clone https://github.com/igorpdsantos/ux-ui-review.git

cp -R ux-ui-review/skills/ux-ui-review ~/.claude/skills/

Só para um projeto: copie a mesma pasta para .claude/skills/ dentro do projeto.

Claude.ai (web e app)

Baixe o arquivo ux-ui-review.skill na página de releases e envie em Configurações → Capabilities → Skills.

No claude.ai não há arquivo local para o script abrir, então contraste, alvo e plataforma saem como estimativa — e a review diz isso. Para medição de verdade, use o Claude Code.

Requisito para medir

Python 3 com Pillow:

pip3 install pillow

Usar

Não há comando obrigatório: descreva o trabalho e a skill entra sozinha.

  • "revisa essa tela de checkout do app"
  • "por que esse app parece feito por IA?"
  • "desenha a tela de onboarding do meu app de agendamento"
  • "essa tela é do site; faz a versão do app"
  • "a Apple reprovou por causa desta tela"

Para chamar direto: /ux-ui-review.

Para a review medir de verdade:

  1. Mande o arquivo de imagem (salvo no projeto ou com o caminho), não a imagem colada na conversa.
  2. Mande a tela inteira, com a status bar — é por ela que a plataforma é fixada.
  3. Diga o contexto: o produto, o público e a ação principal da tela.

O que ela faz

  • Audita em cinco camadas: fundação visual; conteúdo e hierarquia; UX e fluxo; aparelho e sistema (safe areas, teclado, fonte grande, tema, voltar, leitor de tela); e psicologia da decisão, com limites éticos declarados.
  • Mede no print com scripts/medir.py: contraste (WCAG), alvo de toque em pt/dp, plataforma e forma dos switches. O modo candidatos escolhe o que medir antes de você reparar no elemento.
  • Desenha telas novas sob cinco exigências verificáveis, quando não há tela para auditar.
  • Adapta tela web/desktop para app por triagem de bloco, em vez de encolher o layout.
  • Conhece 28 nichos (banco, delivery, saúde, mobilidade, streaming, serviços públicos…).
  • Conhece as regras de loja que viram tela: exclusão de conta, permissões, edge-to-edge no Android 16, rótulos de acessibilidade da App Store.

O que ela não faz

  • Sites, landing pages, web apps ou dashboards de desktop.
  • Ícone, texto de marketing, bug, crash ou métricas.
  • Impor estilo: não tem paleta, fonte nem componente padrão. Corrige o uso da sua identidade.
  • Prometer o que um print não mostra: toque, animação, carregamento, leitor de tela vão para "A verificar em uso", com o teste exato.

Como foi validada

Contra conjuntos de defeitos plantados — telas construídas por quem não conhecia a skill, com gabarito conferível —, comparando com e sem a skill, só com o print:

com a skillsem a skill
Conjunto 1 (66 defeitos)68,2%34,8%
Conjunto 2 (71 defeitos, 6 nichos novos)73,2%23,9%

Na versão 1.2.0, com a medição da plataforma e dos switches passando para o script:

antes1.2.0
Plataforma certa em telas Android44–67%6 de 6 (+ 3 de 3 no controle iOS)
Switch da plataforma errada acusado0 de 53 de 3

As amostras da 1.2.0 são pequenas e estão declaradas como tal. O que ela ainda erra — e com que frequência — está em LIMITACOES.md. Um exemplo de review de ponta a ponta está em EXEMPLO.md.

Estrutura

.claude-plugin/          manifesto de plugin e de marketplace do Claude Code
skills/ux-ui-review/
  SKILL.md               o fluxo de trabalho que o Claude segue
  references/            referências por tema e 28 arquivos de nicho
  scripts/medir.py       medição de contraste, alvo, plataforma e switches
  LIMITACOES.md          onde ela erra
  EXEMPLO.md             uma review completa
  CHANGELOG.md           versões

Licença

MIT © Igor Pereira dos Santos

↑↓ navigate openesc close