Skip to content

danilonovaisv/portfolio-design-auditor

v0.2.0

Evidence-based portfolio design, UX, accessibility, motion and mobile audits with focused implementation skills.

animate

Implementa motion para interfaces web com foco em propósito, timing, easing, interrupção, saída, performance e reduced motion. Use somente na fase de implementação de uma animação aprovada; para auditoria ampla use improve-animations e para revisão use review-animations.

animate-expo

Implementa motion e gestos em React Native/Expo com Reanimated, Gesture Handler, Expo Router e haptics quando aplicáveis. Use na implementação mobile nativa aprovada; para web use animate e para auditoria use improve-animations/review-animations.

animation-vocabulary

Mapeia descrições vagas de motion para termos técnicos precisos e vocabulário compartilhado. Use para nomear efeitos, gestos e padrões antes de documentar findings, prompts ou tarefas; não use para implementar ou julgar qualidade.

apple-design

Aplica princípios de interfaces fluidas derivados de Apple design/WWDC como lente de auditoria e implementação: feedback, continuidade espacial, gestos, springs, momentum, interrupção, materiais, tipografia e reduced motion. Use seletivamente, sem copiar estética Apple.

ask-sonner

Orienta integração e auditoria de Sonner em React: Toaster, toast(), promise/loading, update/dismiss, styling, theming, posição e múltiplos toasters. Use quando Sonner já existe ou foi selecionado; não use para escolher biblioteca sem antes passar por pick-ui-library.

find-animation-opportunities

Varre uma interface para encontrar poucos pontos de alto valor onde motion pode melhorar continuidade, feedback ou compreensão, e rejeita o restante. Read-only: propõe receitas, não implementa. Use para descobrir oportunidades, não para revisar motion existente.

improve-animations

Audita o sistema de motion de uma codebase e produz findings priorizados e planos autocontidos de implementação. Read-only sobre source code. Use para auditoria ampla e roadmap; para revisão localizada use review-animations e para implementação use animate/animate-expo.

mobile-native

Audita e corrige o platform layer de web apps em celulares para que pareçam nativos: viewport, touch, hover sticky, safe areas, browser chrome, scroll, tap behavior e real-device verification. Use para web mobile/PWA; para React Native use animate-expo.

pick-ui-library

Seleciona biblioteca de UI para uma necessidade frontend depois de inspecionar dependências e constraints do projeto. Use explicitamente quando uma nova dependência pode ser necessária; prefere o que já existe e documenta impacto. Não é um catálogo automático.

portfolio-design-audit

Audita paginas, secoes e componentes de portfolios com evidencias de design, UX, acessibilidade, interacao, responsividade e motion. Use para uma revisao ampla ou para transformar observacoes em findings priorizados; encaminhe problemas especializados aos skills do pacote.

prototype

Cria variantes realmente diferentes de uma UI para exploração comparativa, mantendo identidade e constraints do produto, e organiza a escolha antes da implementação final. Use explicitamente após uma oportunidade aprovada; não use como substituto de auditoria.

review-animations

Revisa motion existente ou uma mudança específica contra padrões de craft, performance, interação e accessibility. Read-only por padrão e focada em motion. Use para validação localizada; para auditoria ampla use improve-animations.