shape
Planejar Design UX/UI Antes de Programar
A maioria das interfaces geradas por IA falham porque pulam o pensamento de design. Esta skill executa uma entrevista de descoberta estruturada para entender as necessidades do usuário, restrições e objetivos antes de produzir um briefing de design completo que orienta a implementação.
Baixar o ZIP da skill
Upload no Claude
Vá em Configurações → Capacidades → Skills → Upload skill
Ative e comece a usar
Testar
A utilizar "shape". Shape the UX for a user onboarding flow that helps new users set up their workspace.
Resultado esperado:
Resumo da Funcionalidade: Configuração inicial de workspace para usuários que acabaram de se cadastrar. Objetivo principal é levar usuários ao 'momento aha' em 5 minutos enquanto reduz a ansiedade sobre complexidade de configuração. Ação Principal do Usuário: Completar configuração do workspace com confiança. Direção de Design: Calmo, reconfortante, revelação progressiva. Estratégia de Layout: Fluxo vertical de coluna única com indicadores de progresso claros. Estados-Chave: Primeira visita (boas-vindas), Em progresso (indicadores de etapa), Completado (celebração de sucesso), Erro (validação com orientação). Modelo de Interação: Assistente guiado com etapas opcionais de pular, salvamento automático após cada seção. Requisitos de Conteúdo: Mensagem de boas-vindas, cabeçalhos de etapa, texto de ajuda inline, mensagens de validação. Referências Recomendadas: interaction-design.md, form-design.md. Perguntas em Aberto: Devemos permitir pular configuração de perfil?
A utilizar "shape". I need to design a dashboard for monitoring API health.
Resultado esperado:
Resumo da Funcionalidade: Dashboard de monitoramento de API em tempo real para engenheiros DevOps. Objetivo principal é identificação rápida de problemas e análise de causa raiz. Ação Principal do Usuário: Identificar e diagnosticar anomalias de API rapidamente. Direção de Design: Denso em informações, alto contraste, varredura rápida. Estratégia de Layout: Baseado em grade com visão geral de status no topo, métricas detalhadas embaixo, gradiente de severidade esquerda-para-direita. Estados-Chave: Todos os sistemas saudáveis, degradação parcial (aviso), falha crítica, carregando (busca inicial de dados), sem dados. Modelo de Interação: Hover para detalhes, clique para detalhar, atualização automática a cada 30s, atualização manual disponível. Requisitos de Conteúdo: Nomes de serviços, indicadores de status, números de latência, contagens de erros, timestamps, mensagens de erro. Referências Recomendadas: data-visualization.md, dashboard-design.md. Perguntas em Aberto: Preferências de limite de alerta?
Auditoria de Segurança
SeguroStatic analysis detected 22 potential issues (21 'weak cryptographic algorithm' patterns, 1 'external commands' pattern). All findings are false positives caused by pattern matching on markdown formatting (backticks around `.impeccable.md`) and common English words ('block', 'key', 'cipher'). This is a pure documentation/planning skill with no executable code, no network operations, no file system access, and no security risks. The skill runs a structured interview process and generates design documentation.
Problemas de Baixo Risco (1)
Pontuação de qualidade
O Que Você Pode Construir
Product Manager Planejando Nova Funcionalidade
Antes de passar requisitos para engenharia, use esta skill para estabelecer direção clara de UX, métricas de sucesso e restrições de design.
Desenvolvedor Iniciando Implementação
Use antes de programar para esclarecer o que precisa ser construído, evitando retrabalho por requisitos mal compreendidos ou casos extremos esquecidos.
Designer Definindo Padrões de Interação
Estruturar o pensamento em torno de fluxos de usuário, estados e requisitos de conteúdo antes de criar mockups visuais ou protótipos.
Tente Estes Prompts
Preciso projetar um [descrição da funcionalidade]. Execute a entrevista de descoberta e crie um briefing de design.
Modele o UX para [funcionalidade]. Já tenho contexto de design de /impeccable, então use isso ao discutir restrições e padrões.
Planeje o UX para [funcionalidade] com estas restrições: [liste restrições como mobile-first, requisitos de acessibilidade, orçamentos de performance]. Foque a entrevista em como essas restrições moldam o design.
Quero projetar [funcionalidade] mas estou preocupado com [preocupação específica como complexidade esmagadora]. Certifique-se de que a entrevista de descoberta explore anti-objetivos e o que isto NÃO deve ser.
Melhores Práticas
- Invoca /impeccable antes de usar esta skill para garantir que princípios de design e contexto do projeto estejam carregados
- Responda às perguntas da entrevista cuidadosamente mesmo se achar que um detalhe é óbvio
- Revise o briefing de design gerado cuidadosamente antes de confirmar
- Passe o briefing confirmado para /impeccable craft ou /impeccable para implementação perfeita
Evitar
- Pular a entrevista de descoberta e ir direto para sugestões de design
- Fornecer respostas de uma palavra às perguntas da entrevista sem contexto
- Usar esta skill esperando output de código ao invés de documentação de design
- Ignorar a etapa de confirmação do briefing e prosseguir com entendimento incompleto