delight

Visão geral da skill delight

O que a delight faz

A skill delight ajuda um agente a adicionar alegria sutil, personalidade e microacabamento ao trabalho de UI sem transformar a interface em um truque visual. O papel real dela não é simplesmente “deixar mais divertido” de forma abstrata; é identificar onde pequenos toques emocionais melhoram a experiência, especialmente em estados de sucesso, estados vazios, momentos de carregamento, onboarding e interações leves.

Quem deve usar a delight

A skill delight é mais indicada para quem trabalha com UI de produto, onboarding, dashboards, apps de consumo, ferramentas criativas e experiências com identidade de marca, nas quais o tom emocional importa. Ela é especialmente útil para times que pedem “mais polimento”, “mais personalidade” ou “fazer isso ficar memorável”, mas ainda precisam que o resultado continue utilizável e alinhado à marca.

Melhor encaixe para trabalho de UI Design

Se você quer usar delight para UI Design, essa skill é mais forte do que um prompt genérico de “adicionar animações”, porque ela se concentra em posicionamento, adequação e moderação. Ela direciona para um delight que valoriza o produto em vez de atrapalhar a conclusão da tarefa.

Principal diferencial

O diferencial central é o julgamento. A skill procura explicitamente momentos naturais para delight e pergunta se o contexto do produto sustenta uma expressão mais lúdica, elegante, excêntrica ou profissional. Isso a torna mais útil do que orientações genéricas de “dar mais polimento visual”.

Ressalva importante antes de adotar

A skill delight não é totalmente autônoma. As próprias instruções dela exigem contexto prévio de design, incluindo invocar /frontend-design e, se ainda não houver contexto de design, executar /teach-impeccable primeiro. Se você pular essa preparação, a qualidade da saída cai, porque delight depende muito do tom da marca, do público e do grau de seriedade do produto.

Como usar a skill delight

Instale a delight no seu ambiente de skills

Em uma configuração típica de skills no GitHub, instale com:

npx skills add pbakaus/impeccable --skill delight

Se o seu ambiente já sincroniza o repositório pbakaus/impeccable, confirme que a skill existe em .agents/skills/delight.

Leia este arquivo primeiro

Comece por:

• SKILL.md

Neste recorte do repositório, só há um arquivo realmente relevante para essa skill, então a maior parte do seu entendimento virá desse documento, e não de scripts auxiliares ou referências.

Entenda a preparação obrigatória antes de invocar a delight

Antes de usar a delight, prepare primeiro o contexto de design:

1. Invoque /frontend-design
2. Siga o Context Gathering Protocol
3. Se ainda não houver contexto de design, execute /teach-impeccable
4. Levante o tom do domínio: playful, professional, quirky, elegant ou equivalente

Essa preparação não é burocracia opcional. A skill delight faz julgamentos sobre adequação, então precisa de contexto de produto e público para não gerar uma saída rasa do tipo “coloca um brilho aqui”.

Saiba de que entrada a delight precisa

A skill delight funciona melhor quando você fornece:

• a tela, fluxo ou componente alvo
• o tipo de produto e o público
• a personalidade da marca
• o nível de seriedade da tarefa
• quaisquer restrições de motion, acessibilidade ou performance
• o problema atual, como “está com cara de frio” ou “o estado de sucesso parece sem impacto”

Entrada fraca:

• “Make this screen more delightful.”

Entrada melhor:

• “Use delight on our invoicing app’s payment success screen. Audience is small-business owners, tone is calm and trustworthy, not playful. We want a brief rewarding moment after payment confirmation without slowing users who need the receipt immediately. Avoid heavy animation.”

Onde a delight costuma funcionar melhor

Segundo a orientação da skill, boas oportunidades para delight incluem:

• estados de sucesso
• estados vazios
• estados de carregamento
• conquistas e marcos
• interações de hover, click e drag
• momentos de recuperação de erro
• Easter eggs opcionais

Isso é prático porque ajuda você a focar em momentos em que o delight parece merecido, em vez de espalhá-lo pela interface inteira.

Onde a delight não é uma boa escolha

Não comece por delight quando a superfície é principalmente sobre urgência, segurança, conformidade ou alto volume de tarefas. Exemplos:

• ações médicas ou financeiras críticas
• consoles operacionais de alto estresse
• confirmações de segurança
• fluxos em que velocidade e clareza importam mais do que personalidade

Nesses casos, use delight com muita parcimônia, se usar, e prefira transmitir calma e segurança em vez de novidade.

Transforme um objetivo vago em um prompt forte de delight

Um bom prompt de uso da delight deve conter cinco coisas:

1. superfície alvo
2. emoção do usuário antes e depois
3. tom da marca
4. restrições
5. formato da saída

Exemplo:

Apply the delight skill to our empty dashboard state for first-time users.
Context: B2B analytics product, audience is marketers, tone is smart and optimistic.
Goal: reduce the cold, intimidating feel of an empty workspace.
Constraints: keep copy concise, no cartoon tone, minimal motion, accessible by default.
Output: propose 5 delight opportunities ranked by impact, then rewrite the empty state copy and describe one subtle interaction.

Essa estrutura dá à skill informação suficiente para escolher um delight adequado, em vez de cair em microinterações genéricas por padrão.

Peça opções ranqueadas, não uma única ideia

Para um uso mais prático da delight, peça ao agente que classifique as ideias por:

• impacto na emoção do usuário
• complexidade de implementação
• aderência à marca
• risco de distração

Isso importa porque delight é subjetivo. Opções ranqueadas facilitam a revisão e reduzem a chance de o primeiro conceito ser fofo demais, caro demais ou desalinhado com a marca.

Use a delight depois que a UX base já funcionar

A skill delight é mais eficaz quando os fluxos principais já estão compreensíveis. Se a sua tela ainda tem problemas de IA, copy ou usabilidade, delight pode mascarar problemas em vez de resolvê-los. Um bom fluxo de trabalho é:

1. estabelecer a UX base
2. reunir contexto de design
3. executar a delight
4. revisar tom e acessibilidade
5. implementar primeiro os menores toques com maior valor

O que uma boa saída da delight deve trazer

Um guia útil de delight vindo dessa skill deve entregar mais do que “adicione animação”. Procure uma saída que especifique:

• o momento exato da UI a ser aprimorado
• por que esse momento merece delight
• qual deve ser a intensidade da expressão
• como preservar clareza e velocidade
• o que evitar nesse domínio

Se a saída estiver ampla demais, peça ao agente para restringi-la a uma tela e um resultado emocional.

Use a delight para explorar conceitos e depois refine para produção

Um fluxo prático é deixar a delight gerar primeiro vários conceitos de alto nível e depois fazer um segundo passe mais rígido, voltado para produção:

• reduzir motion
• encurtar a copy
• remover extras decorativos
• verificar acessibilidade
• checar custo de performance

Essa abordagem em duas etapas traz o benefício criativo da delight sem colocar em produção floreios desnecessários.

FAQ da skill delight

A delight serve só para produtos lúdicos

Não. A skill delight também é útil em produtos profissionais, mas a forma de expressão muda. Em produtos mais sérios, delight costuma significar alívio, fluidez, calor humano e feedback bem-acabado, e não humor ou animação chamativa.

O que faz a delight ser melhor do que um prompt comum

Um prompt comum costuma ir direto para efeitos. A skill delight é melhor estruturada em torno de contexto e escolha de oportunidade: onde o delight faz sentido, onde não faz e com que intensidade ele deve aparecer para aquele público e aquela marca.

A delight é amigável para iniciantes

Sim, desde que você já saiba qual tela ou fluxo quer melhorar. O principal erro de iniciantes é faltar contexto. Se você não informar tom de produto, público ou restrições, a skill delight pode gerar ideias que soam bem, mas são difíceis de colocar em produção.

Preciso das outras skills do impeccable antes

Em geral, sim — pelo menos o caminho de contexto de design. A skill delight depende explicitamente de /frontend-design e possivelmente de /teach-impeccable quando esse contexto ainda não existe. Trate a delight como uma camada especializada por cima do entendimento de design, não como uma ferramenta de design para o primeiro passo.

A delight pode ajudar com copy, motion e interações

Sim. A orientação de origem aponta para momentos como estados vazios, feedback de sucesso, carregamento, conquistas e interações. Isso significa que a delight pode influenciar microcopy, timing, reações e pequenos comportamentos de UI, não apenas o visual.

Quando eu não devo usar a delight

Evite a delight quando o principal problema for navegação pouco clara, hierarquia ruim, ausência de estratégia de produto ou fundamentos de UX quebrados. Também não é recomendada quando o domínio exige neutralidade ou quando uma expressão mais lúdica pode reduzir a confiança.

Como melhorar a skill delight

Dê à delight um alvo emocional mais preciso

A maior alavanca de melhoria é a especificidade emocional. Em vez de “deixar mais delightful”, diga o que deve mudar:

• de ansioso para tranquilo
• de vazio para convidativo
• de rotineiro para recompensador
• de espera para agradavelmente ocupado

Isso ajuda a delight a escolher melhor os momentos e o tom.

Defina os limites da marca logo de início

A skill delight melhora muito quando você explicita o que está fora de cogitação:

• no mascots
• no bounce animations
• no jokes
• no gamification
• no added delay after success

Essas restrições evitam o modo de falha mais comum: ideias expressivas demais que entram em conflito com a confiança no produto.

Especifique a seriedade e o risco do domínio

Como a delight pode facilmente passar do ponto, diga ao agente quanta intensidade emocional é aceitável. Por exemplo:

• “fintech, medium trust sensitivity”
• “admin tool, low need for whimsy”
• “creative app, high tolerance for playful interaction”

Isso torna o guia de delight muito mais realista.

Peça à delight para separar essencial de opcional

Um problema comum é receber uma lista misturada de ideias com custos de implementação muito diferentes. Melhore a saída pedindo:

• 1 ideia de alto impacto e baixo esforço
• 1 momento de assinatura com esforço médio
• 2 ideias opcionais mais ambiciosas

Isso facilita a adoção por times de produto reais.

Exija que cada ideia se justifique

Peça ao agente que explique, para cada sugestão de delight:

• por que esse momento se beneficia de delight
• qual sentimento do usuário ele apoia
• por que isso não vai atrapalhar a tarefa

Isso filtra enfeite decorativo e mantém o delight conectado ao valor de UX.

Corrija o modo de falha mais comum: delight em excesso

Se a primeira saída parecer barulhenta, peça um segundo passe com limites mais rígidos:

Revise the delight proposals to be 40% more restrained.
Keep only ideas that improve clarity, reward completion, or soften friction.
Remove anything that adds cognitive load, delay, or cartoonish tone.

Muitas vezes, essa é a forma mais rápida de deixar a delight pronta para produção.

Melhore a qualidade da implementação com escopo de uma única tela

Não peça à delight para transformar o produto inteiro de uma vez. Escolha primeiro uma única superfície, como:

• sucesso no signup
• primeiro dashboard vazio
• estado de carregamento de upload de arquivo
• confirmação de salvamento
• feedback de drag-and-drop

Um escopo mais estreito produz recomendações mais acionáveis e deixa a revisão mais simples.

Itere do conceito ao detalhe pronto para ir ao ar

Depois da primeira saída da delight, siga com perguntas objetivas:

• “Which idea has the best value-to-effort ratio?”
• “Rewrite this for an enterprise audience.”
• “Make the interaction accessible with reduced-motion fallback.”
• “Remove anything that could slow expert users.”

É nesse ponto que a skill delight se torna realmente útil, em vez de apenas inspiracional.

Combine a delight com revisão de acessibilidade e performance

Um bom delight para UI Design ainda deve respeitar reduced motion, responsividade e conclusão rápida de tarefas. Uma ideia polida que prejudica acessibilidade ou velocidade não é um delight bem-sucedido. Peça ao agente para incluir comportamento de fallback e apontar quaisquer suposições arriscadas sobre motion ou timing.

Monte um briefing reutilizável de delight para o seu time

Se você pretende usar a delight com frequência, crie um briefing curto e reutilizável contendo:

• tom da marca
• público
• sensibilidade do domínio
• limites de motion
• estilo de copy
• exemplos de delight aceitável e inaceitável

Usar o mesmo briefing todas as vezes torna a skill delight mais consistente e reduz retrabalho.