Skills de Addyosmani

Auditar e melhorar a acessibilidade web seguindo as diretrizes WCAG 2.2. Use quando solicitado a "melhorar a acessibilidade", "auditoria de a11y", "conformidade com WCAG", "suporte a leitores de tela", "navegação por teclado" ou "tornar acessível".

Orienta o design estável de APIs e interfaces. Use ao projetar APIs, limites de módulos ou qualquer interface pública. Use ao criar endpoints REST ou GraphQL, definir contratos de tipos entre módulos ou estabelecer limites entre frontend e backend.

Aplicar as melhores práticas modernas de desenvolvimento web para segurança, compatibilidade e qualidade de código. Usar quando solicitado a "aplicar melhores práticas", "auditoria de segurança", "modernizar código", "revisão de qualidade de código" ou "verificar vulnerabilidades".

Testa em navegadores reais via Chrome DevTools MCP. Use ao construir ou depurar qualquer coisa que rode em um navegador. Use quando precisar inspecionar o DOM, capturar erros do console, analisar requisições de rede, perfilar desempenho ou verificar saída visual com dados reais de execução. Requer que o servidor MCP chrome-devtools esteja configurado.

Automatiza a configuração de pipelines de CI/CD. Use ao configurar ou modificar pipelines de build e deploy. Use quando precisar automatizar portões de qualidade, configurar executores de teste em CI ou estabelecer estratégias de implantação.

Realiza revisão de código em múltiplos eixos. Use antes de mesclar qualquer alteração. Use ao revisar código escrito por você, outro agente ou um humano. Use quando precisar avaliar a qualidade do código em várias dimensões antes de ele entrar no branch principal.

Simplifica o código para maior clareza. Use ao refatorar código para clareza sem alterar o comportamento. Use quando o código funciona, mas está mais difícil de ler, manter ou estender do que deveria. Use ao revisar código que acumulou complexidade desnecessária.

Otimiza a configuração de contexto do agente. Use ao iniciar uma nova sessão, quando a qualidade da saída do agente degradar, ao alternar entre tarefas, ou quando precisar configurar arquivos de regras e contexto para um projeto.

Otimize Core Web Vitals (LCP, INP, CLS) para melhor experiência de página e classificação em buscas. Use quando solicitado a "melhorar Core Web Vitals", "corrigir LCP", "reduzir CLS", "otimizar INP", "otimização de experiência de página" ou "corrigir mudanças de layout".

Guia a depuração sistemática de causa raiz. Use quando testes falharem, builds quebrarem, comportamento não corresponder às expectativas ou você encontrar qualquer erro inesperado. Use quando precisar de uma abordagem sistemática para encontrar e corrigir a causa raiz, em vez de adivinhar.

Gerencia depreciação e migração. Use ao remover sistemas, APIs ou recursos antigos. Use ao migrar usuários de uma implementação para outra. Use ao decidir se deve manter ou descontinuar código existente.

Registra decisões e documentação. Use ao tomar decisões arquiteturais, alterar APIs públicas, lançar funcionalidades ou quando precisar registrar contexto que engenheiros e agentes futuros precisarão entender o código.

Submete toda decisão não trivial a uma revisão adversarial em novo contexto antes de ser consolidada. Use quando a correção importa mais que a velocidade, ao trabalhar em código desconhecido, quando os riscos são altos (produção, lógica sensível à segurança, operações irreversíveis), ou sempre que uma saída confiável agora for mais barata do que depurar depois.

Constrói interfaces de usuário responsivas, acessíveis e com qualidade de produção. Use ao construir ou modificar interfaces e páginas, criar componentes, implementar layouts, atender aos requisitos de acessibilidade WCAG, gerenciar estado, ou quando a saída precisar ter aparência e sensação de qualidade de produção em vez de gerada por IA.

Estrutura práticas de fluxo de trabalho git. Use ao fazer qualquer alteração de código. Use ao commitar, criar branches, resolver conflitos ou quando precisar organizar o trabalho em múltiplos fluxos paralelos. Use ao cortar um release, escolher um incremento de versão semântica, criar tags ou escrever um changelog.

Refina ideias brutas em conceitos nítidos e acionáveis por meio de pensamento divergente e convergente estruturado. Use quando uma ideia ainda estiver vaga, quando precisar testar suposições antes de se comprometer com um plano, ou quando quiser expandir opções antes de convergir para uma. Aciona com "idear", "refinar esta ideia" ou "testar meu plano".

Entrega alterações de forma incremental. Use ao implementar qualquer funcionalidade ou mudança que envolva mais de um arquivo. Use quando estiver prestes a escrever uma grande quantidade de código de uma só vez, ou quando uma tarefa parecer grande demais para ser concluída em uma única etapa.

Extrai o que o usuário realmente deseja, em vez do que ele acha que deveria desejar. Isso é alcançado por meio de uma pergunta por vez até aproximadamente 95% de confiança sobre a intenção subjacente. Use quando uma solicitação for mal especificada ("crie X para mim" sem "para quem" ou "por que agora"), quando o usuário invocar explicitamente ("me entreviste", "me interrogue", "temos certeza?", "teste meu pensamento") ou quando você se pegar preenchendo silenciosamente requisitos ambíguos antes de qualquer plano, especificação ou código existir.

Instrumenta o código para que o comportamento em produção seja visível e diagnosticável. Use ao adicionar logs, métricas, rastreamento ou alertas. Use ao enviar qualquer funcionalidade que rode em produção e você precise de evidências de que funciona. Use quando problemas em produção são reportados, mas você não consegue identificar o que aconteceu a partir dos dados disponíveis.

Otimize o desempenho da web para carregamento mais rápido e melhor experiência do usuário. Use quando solicitado a "acelerar meu site", "otimizar o desempenho", "reduzir o tempo de carregamento", "corrigir carregamento lento", "melhorar a velocidade da página" ou "auditoria de desempenho".

Otimiza o desempenho de aplicações em frontend, backend, consultas e bancos de dados. Use quando houver requisitos de desempenho, quando suspeitar de regressões de desempenho, quando for necessário melhorar Core Web Vitals ou tempos de carregamento, quando padrões de consulta N+1 precisarem ser corrigidos ou quando a criação de perfis revelar gargalos.

Divide o trabalho em tarefas ordenadas. Use quando tiver uma especificação ou requisitos claros e precisar dividir o trabalho em tarefas implementáveis. Use quando uma tarefa parecer grande demais para começar, quando precisar estimar o escopo ou quando o trabalho paralelo for possível.

Endurece o código contra vulnerabilidades. Use ao lidar com entrada do usuário, autenticação, armazenamento de dados ou integrações externas. Use ao criar qualquer funcionalidade que aceite dados não confiáveis, gerencie sessões de usuário ou interaja com serviços de terceiros.

Otimizar para visibilidade e ranqueamento em mecanismos de busca. Use quando solicitado a "melhorar SEO", "otimizar para busca", "corrigir meta tags", "adicionar dados estruturados", "otimização de sitemap" ou "otimização para mecanismos de busca".

Prepara lançamentos de produção. Use ao se preparar para implantar em produção. Use quando precisar de uma lista de verificação pré-lançamento, ao configurar monitoramento, ao planejar uma implantação em etapas ou quando precisar de uma estratégia de reversão.

Fundamenta cada decisão de implementação na documentação oficial. Use quando quiser um código autoritativo e com citações de fontes, livre de padrões desatualizados. Use ao construir com qualquer framework ou biblioteca onde a correção importa.

Cria especificações antes de codificar. Use ao iniciar um novo projeto, funcionalidade ou mudança significativa e quando ainda não existir uma especificação. Use quando os requisitos forem pouco claros, ambíguos ou existirem apenas como uma ideia vaga.

Orienta o desenvolvimento com testes. Use ao implementar qualquer lógica, corrigir qualquer bug ou alterar qualquer comportamento. Use quando precisar provar que o código funciona, quando um relatório de bug chegar ou quando estiver prestes a modificar funcionalidades existentes.

Descobre e invoca habilidades de agente. Use ao iniciar uma sessão ou quando precisar descobrir qual habilidade se aplica à tarefa atual. Esta é a meta-habilidade que governa como todas as outras habilidades são descobertas e invocadas.

Auditoria abrangente de qualidade web cobrindo desempenho, acessibilidade, SEO e melhores práticas. Use quando solicitado a "auditar meu site", "revisar qualidade web", "executar auditoria lighthouse", "verificar qualidade da página" ou "otimizar meu site".