ios-design-reviewpor Garry Tan

iOS Design Review Skill.

Um skill do Claude Code e Codex para design de aplicativos móveis: auditoria de design visual de apps iOS em hardware real.

Mobile Apps
Relatório de revisão

Baixar OpenDesign Ver guia de uso

garrytan/gstack · ios-design-review/SKILL.mdSKILL.md

--- name: ios-design-review description: Visual design audit for iOS apps on real hardware. (gstack) --- ## When to invoke this skill ## Confusion Protocol ## Claimed Limitations Need Evidence ## Continuous Checkpoint Mode ## Context Health (soft directive) ## Question Tuning (skip entirely if QUESTION_TUNING: false)

Cabeçalho e títulos de seção lidos do arquivo original em 14/09/2026 · 33.841 caracteres no total

01 O que faz

O que o Skill ios-design-review Faz no Claude Code e no Codex

Resumo, fluxo de trabalho e resultados, todos lidos do SKILL.md do skill.

Do SKILL.mdLido em 14/09/2026 · não é uma execução registrada

Nos termos do próprio skill

Conecta-se a um iPhone real via gstack-ios-qa-daemon, captura a tela de cada tela e avalia o design visual em relação às Apple HIG, ao DESIGN.md e às melhores práticas. Pontua dez dimensões (hierarquia tipográfica, ritmo de espaçamento, hierarquia de cores, áreas de toque, estados de carregamento/vazio/erro, acessibilidade, disciplina de animação, alinhamento com os idiomas do iOS, densidade de informação e verificação de "AI-slop") de 0 a 10, usando o enquadramento "o que faria isso ser um 10".

Reflete a rubrica de pontuação do /plan-design-review adaptada para os idiomas do iOS. Produz um relatório em markdown com capturas de tela, pontuações por tela e sugestões de correção com maior alavancagem. Para revisão de design na etapa de planejamento (antes da implementação), use /plan-design-review. Para auditorias visuais em tempo real na web, use /design-review.

O que ele produz

Relatório em markdown com capturas de tela inline, pontuações por tela (0-10 para cada dimensão) e sugestões de correção com maior alavancagem por dimensão

Veja o exemplo de prompt ↗

Como funciona

01
Conectar ao Daemon em Execução
Usa o gstack-ios-qa-daemon em execução. Se nenhum daemon estiver em execução, inicia um seguindo o mesmo fluxo do /ios-qa (Fase 0-2).
02
Capturar Telas
Para cada tela principal (a partir de uma lista de telas fornecida pelo usuário ou descoberta automaticamente via a árvore de acessibilidade), obtém a captura de tela e os elementos via GET /screenshot e GET /elements.
03
Aplicar Rubrica de Dez Dimensões
Pontua a hierarquia tipográfica, o ritmo de espaçamento, a hierarquia de cores, as áreas de toque, os estados de carregamento/vazio/erro, a acessibilidade, a disciplina de animação, o alinhamento com os idiomas do iOS, a densidade de informação e a verificação de "AI-slop" de 0 a 10, explicando o que levaria cada uma a 10.
04
Sinalizar Pontuações Baixas
Usa o AskUserQuestion para qualquer pontuação abaixo de 7, apresentando o problema com a correção recomendada e o tradeoff, para que o usuário decida se deve resolvê-lo.
05
Escrever Relatório
Produz um relatório em markdown com capturas de tela inline, pontuações por tela e sugestões de correção com maior alavancagem por dimensão, escrito em ~/.gstack/projects/<slug>/ios-design-review-<date>.md.

02 Encontre o ideal para você

Quando Usar a Skill ios-design-review

Use a skill ios-design-review no Claude Code ou Codex quando o trabalho for design de aplicativo mobile desse tipo. Adequação e limites abaixo são retirados do próprio arquivo da skill.

Boa Combinação

QA visual de um app iOS em hardware real antes do lançamento
Verificando a conformidade de acessibilidade (rótulos do VoiceOver, Dynamic Type, Reduce Motion)

Conheça os Limites

Revisão de design na fase de planejamento antes da implementação (use /plan-design-review)
Auditorias visuais em tempo real na web (use /design-review)

03 Dentro da skill

Regras que a Skill ios-design-review Dá ao Claude Code e ao Codex

8 instruções concretas, padrões e limites que o SKILL.md define para o agente — a parte do arquivo que muda o resultado.

Somente Leitura por Padrão
Adquire a sessão com capacidade de observação, sem realizar chamadas de alteração no dispositivo iOS.
Tipografia Usa SF Pro e Dynamic Type
A hierarquia tipográfica avalia os tamanhos de display, corpo e legenda quanto à consistência com a Apple HIG, usando SF Pro na escala correta de dynamic type. Nenhum texto de corpo com 12pt em nenhum lugar.
Espaçamento Deve Seguir Grade de 4pt ou 8pt
A dimensão de ritmo de espaçamento exige o uso consistente da grade de 4pt ou 8pt, sem preenchimentos mágicos de 17/23/31pt, e com respeito às margens de área segura (safe-area insets).
Áreas de Toque com Mínimo de 44x44pt
Todo elemento interativo deve ter no mínimo 44x44pt. Nenhum texto tocável menor que 24pt.
Taxas de Contraste Atendem ao WCAG AA
A dimensão de hierarquia de cores exige taxas de contraste que atendam ao WCAG AA para texto de corpo (4.5:1) e texto grande (3:1), com renderização correta no modo escuro.
Animação Limitada a 2 Simultâneas
A dimensão de disciplina de animação limita a 2 animações simultâneas, com duração de 200-300ms para feedback de UI e amortecimento de spring correto (não saltitante em fluxos sérios).
Use Componentes Nativos do iOS
A dimensão de alinhamento ao idioma do iOS exige o uso de componentes nativos (NavigationStack, List, Form, sheets do sistema) quando apropriado, sem navegação reinventada ou menus hambúrguer de estilo web no celular.
Sinalize Padrões de AI-slop
A dimensão de verificação de AI-slop identifica layouts genéricos de banco de imagens, dados lorem ipsum deixados no lugar, Material Design importado por cargo-cult do Android, e gradientes gerados por IA.

04 Coloque em prática

Instale ios-design-review no Claude Code ou Codex

Um comando npx skills add, depois uma primeira tarefa no seu agente e uma checklist para o resultado.

Adicione ios-design-review ao Claude Code, Codex ou seu agente

Rode no seu projeto; o instalador pergunta a qual agente adicioná-lo.

Terminal

npx skills add https://github.com/garrytan/gstack --skill ios-design-review

Formato genérico da CLI skills para ios-design-review/SKILL.md; o repositório pode documentar seu próprio caminho.

Dê à Skill uma Primeira Tarefa de Design de Aplicativo Mobile

Escrito nos próprios termos do skill; substitua as partes entre colchetes pelo seu material.

Starter prompt

Review the iOS design of [MyApp] running on the connected iPhone. Focus on the onboarding flow, home screen, and settings. Check for typography hierarchy issues, spacing rhythm inconsistencies, and accessibility compliance. Write the report to the project folder.

Fonte: escrito a partir do SKILL.md nos próprios termos do skill.

Verifique o Primeiro Resultado

O que o próprio SKILL.md diz sobre como é um resultado correto:

Confirme que a sessão foi adquirida com capacidade de observação e que nenhuma chamada de alteração foi feita

No OpenDesign importe o ios-design-review a partir do link do seu SKILL.md: Plugins → Add → Skill → Import from link, depois selecione-o na barra superior.

Baixar OpenDesign Ler o quickstart

05 Código aberto, rastreável

Fonte, Licença e Verificação

De onde vêm os fatos desta página e quando foram verificados pela última vez.

Author: Garry Tan
Repository: github.com/garrytan/gstack Branch main
Arquivo da skill: ios-design-review/SKILL.md Checksum do conteúdo registrado na verificação; commit 71f6048
License: MIT De LICENSE.
Estrelas do repositório: 132.921 Snapshot do GitHub tirado em 14/09/2026 para todo o repositório garrytan/gstack, que contém 7 skills neste catálogo. Não é uma classificação ou contagem de uso para ios-design-review.
Verificado pelo OpenDesign: 14/09/2026 Arquivo de origem, caminho, texto da licença e contagem de estrelas foram verificados. Não integrado ao OpenDesign principal (verificado em 28/08/2026); uma execução ao vivo não foi registrada nesta página.

Dentro do SKILL.md

Quando invocar esta skillAuditoria visual de apps iOS em hardware real via StateServer, avalia dez dimensões de 0 a 10
ConexãoUsa o gstack-ios-qa-daemon em execução, iniciando via fluxo /ios-qa quando necessário, somente leitura por padrão
Dimensões e pontuaçãoRubrica de dez dimensões: tipografia, espaçamento, cor, áreas de toque, estados, acessibilidade, animação, idioma iOS, densidade, AI-slop
LoopAdquire a sessão, captura cada tela, aplica a rubrica, registra as descobertas, produz relatório em markdown
SaídaRelatório em markdown com capturas de tela inline, pontuações por tela, sugestões de correção com maior impacto
Modos de falhaTrata 403 capability_insufficient, capturas de tela em branco, telas ausentes

A Descrição da Própria Skill

"Auditoria de design visual para aplicativos iOS em hardware real. (gstack)"

Descrição do front-matter do SKILL.md. O arquivo completo tem cerca de 33.841 caracteres. Leia o arquivo completo no GitHub.

06 Antes de instalar

Perguntas sobre o Skill ios-design-review

As respostas vêm do SKILL.md conforme lido em 2026-09-14, e não de uma execução registrada.

Qual é a diferença entre este e o /plan-design-review?

Este skill é executado em um dispositivo iOS real e avalia apps lançados ou em desenvolvimento em relação à HIG da Apple e aos idiomas do iOS. O /plan-design-review avalia especificações de design antes da implementação. Este skill reflete a mesma rubrica de pontuação adaptada para o iOS.

Revisão de Design iOS

Execute ios-design-review em uma tarefa real de design de aplicativo móvel.

Baixe o OpenDesign, importe ios-design-review a partir do link do SKILL.md, cole o prompt acima e leia o plano antes do resultado.

Baixar OpenDesign Ver todas as skills

Terminal

npx skills add https://github.com/garrytan/gstack --skill ios-design-review

O que o Skill ios-design-review Faz no Claude Code e no Codex

Nos termos do próprio skill

Como funciona

Quando Usar a Skill ios-design-review

Boa Combinação

Conheça os Limites

Regras que a Skill ios-design-review Dá ao Claude Code e ao Codex

Somente Leitura por Padrão

Tipografia Usa SF Pro e Dynamic Type

Espaçamento Deve Seguir Grade de 4pt ou 8pt

Áreas de Toque com Mínimo de 44x44pt

Taxas de Contraste Atendem ao WCAG AA

Animação Limitada a 2 Simultâneas

Use Componentes Nativos do iOS

Sinalize Padrões de AI-slop