popup-cro

Visão geral

O que é popup-cro?

popup-cro é uma skill especializada em conversão (CRO — Conversion Rate Optimization) focada inteiramente em popups, modals, overlays, slide-ins, sticky bars e notification banners.

Ela foi criada para ajudar você a criar elementos de interrupção que realmente geram conversão — email capture popups, exit-intent modals, ofertas com desconto, announcement bars e similares — sem prejudicar a experiência do usuário ou a percepção da sua marca.

Quando seu objetivo é gerar mais leads, crescer sua lista de newsletter, divulgar uma oferta ou recuperar visitantes prestes a abandonar o site por meio de um popup ou overlay, popup-cro oferece um processo estruturado e replicável para planejamento, copy, decisões de design, triggers e regras de frequência.

Para quem é popup-cro?

Use popup-cro se você é:

• Um profissional de marketing ou growth focado em melhorar a conversão de landing pages sem refazer toda a página
• Um content ou email marketer usando popups para construir um funil de newsletter ou lead magnet
• Um founder ou operador solo que precisa de orientações simples e eficazes sobre popups sem contratar uma agência de CRO
• Um frontend ou no-code builder que sabe implementar popups, mas precisa de direção clara sobre estratégia, timing e copy

Se você estiver otimizando formulários estáticos incorporados na página (e não em um popup), use a skill form-cro. Para otimização mais ampla de landing pages ou do site como um todo, use page-cro.

Quais problemas popup-cro resolve?

popup-cro ajuda quando você:

• Roda popups com baixa taxa de conversão e alto nível de irritação
• Não tem certeza de quando exibir um popup (atraso no tempo, profundidade de scroll, exit intent, targeting por página)
• Precisa definir melhor o propósito de cada popup (captura de email, desconto, anúncio, promoção de feature, feedback etc.)
• Quer melhorar o desempenho de exit-intent popups em landing pages
• Precisa de headlines, propostas de valor e CTAs de popup mais claros e fortes
• Quer regras de frequência que respeitem o usuário (por exemplo, não mostrar o mesmo popup em toda página)

Ela é especialmente útil quando termos como “exit intent”, “lead capture popup”, “email popup”, “scroll trigger”, “sticky bar” ou “notification bar” fazem parte do seu trabalho.

Principais capacidades a partir do repositório

Com base na definição da skill e nos evaluation prompts do repositório, popup-cro foi ajustada para:

• Começar a partir de um arquivo de product marketing context se disponível (.agents/product-marketing-context.md ou o mais antigo .claude/product-marketing-context.md), garantindo que as recomendações estejam alinhadas ao seu posicionamento e público.
• Classificar o tipo de popup (exit-intent email capture, desconto para first-time visitors, announcement etc.).
• Recomendar headlines, incentivos e estruturas de formulário para maior conversão com mínima fricção (muitas vezes formulários apenas com email).
• Sugerir regras de trigger e frequência (por exemplo, exit-intent detection, “do not show again” para dismissals, targeting para first-time visitors).
• Fornecer benchmarks realistas (como faixas típicas de conversão de exit-intent popups) para você avaliar o desempenho.

Como usar

1. Instalação e configuração

Para instalar a skill popup-cro a partir do repositório coreyhaines31/marketingskills, execute:

npx skills add https://github.com/coreyhaines31/marketingskills --skill popup-cro

Esse comando traz a definição da skill e os arquivos de avaliação de suporte para o seu ambiente de skills.

Após a instalação:

• Abra skills/popup-cro/SKILL.md para revisar os princípios centrais e o fluxo de trabalho.
• Verifique skills/popup-cro/evals/evals.json para ver prompts de exemplo e o que uma boa resposta deve contemplar.

2. Entenda o fluxo de trabalho

popup-cro segue uma abordagem estruturada antes de oferecer recomendações:

1. Checar o product marketing context

   • Se o seu repositório tiver .agents/product-marketing-context.md (ou o mais antigo .claude/product-marketing-context.md), popup-cro vai usar esse arquivo primeiro.
   • Isso garante que as recomendações de popups combinem com seu público, posicionamento e principais value props.

2. Esclarecer o propósito do popup
   A skill parte do princípio de que você esteja claro (ou que isso seja clarificado em conjunto) sobre o objetivo do popup, como por exemplo:

   • Captura de email/newsletter
   • Entrega de lead magnet
   • Desconto ou promoção (ex.: 10% off para first-time visitors)
   • Announcement de produto ou feature
   • Exit-intent save offer
   • Coleta de feedback ou pesquisa

3. Avaliar o estado atual e o tráfego
   Se o popup já existir, popup-cro vai orientar você a compartilhar:

   • Desempenho atual (views, conversions, CTR)
   • Triggers usados hoje (tempo na página, profundidade de scroll, exit intent, targeting por página)
   • Reclamações de usuários ou problemas de UX (especialmente em mobile)
   • Fontes de tráfego (paid vs organic, new vs returning visitors, tipos principais de página)

3. Executando casos de uso práticos

Use popup-cro de forma interativa no seu agente ou ambiente de skills, fazendo perguntas bem focadas em tarefas. Veja alguns cenários de exemplo alinhados com os evals do repositório.

Exit-intent email capture popup

Acione popup-cro com algo como:

Help me create an exit-intent popup for our SaaS landing page. We want to capture emails from visitors who are about to leave without signing up.

Normalmente popup-cro vai ajudar você a:

• Confirmar que se trata de um popup de exit-intent email capture.
• Escrever uma headline convincente que aborde o motivo da saída ou ofereça valor extra.
• Escolher um lead magnet ou incentivo (por exemplo, extended trial, checklist, desconto) para elevar a conversão.
• Manter o formulário enxuto (muitas vezes apenas email) para reduzir fricção.
• Definir uma CTA clara e uma opção de fechamento fácil.
• Recomendar a configuração de trigger (comportamento de exit intent em desktop, alternativas em mobile) e regras de frequência (por exemplo, não exibir por um período após o dismiss, não mostrar para converters recentes).
• Compartilhar benchmarks de conversão realistas para exit-intent popups (por exemplo, faixas de baixo dígito simples a baixo dígito duplo) para você saber se os resultados estão saudáveis.

Popup de desconto para first-time visitors

Para uma oferta com desconto, pergunte algo como:

We want to offer a 10% discount to first-time visitors via a popup. When should we show it and what should it say?

popup-cro vai ajudar você a:

• Tratar isso como um discount/promotion popup focado em first-time visitors.
• Recomendar o timing (por exemplo, após algum engajamento em vez de imediatamente no page load).
• Sugerir copy e forma de apresentar o valor para que o desconto pareça relevante, não aleatório.
• Propor regras de frequência e targeting (somente first-time visitors, limitar impressões, evitar interromper fluxos críticos).

4. Como integrar ao seu stack

popup-cro em si não injeta JavaScript nem gerencia a renderização do popup. Em vez disso, fornece a estratégia e a especificação para você aplicar nas suas ferramentas, como:

• Código frontend (componentes React/Vue customizados, popups em vanilla JS)
• Landing page builders (Webflow, Framer etc.)
• Ferramentas de popup e onsite messaging (por exemplo, plataformas dedicadas de popup)

Use popup-cro para definir:

• Objetivo do popup e KPIs
• Regras de trigger (tempo, scroll, exit intent, targeting por página)
• Trade-offs de design e layout (número de campos, uso de imagens, posição do botão de fechar)
• Variações de copy e CTA para testar

Depois, implemente essas recomendações nas suas ferramentas e rode testes A/B conforme fizer sentido.

5. Arquivos da skill para revisar

Para extrair o máximo de popup-cro, comece por:

• SKILL.md – definição principal da skill, com princípios e orientações passo a passo (incluindo seções como Initial Assessment e Core Principles).
• evals/evals.json – evaluation prompts selecionados que mostram casos de uso e o que uma resposta completa e de alta qualidade deve incluir.

FAQ

Quando devo usar popup-cro em vez de form-cro ou page-cro?

Use popup-cro quando estiver trabalhando em qualquer elemento de interrupção:

• Popups e modals
• Slide-ins e overlays
• Sticky bars e notification bars

Se o elemento de conversão estiver embutido na página (por exemplo, um formulário de signup no hero), use form-cro. Se você estiver otimizando o layout geral, a copy e os fluxos de uma página ou funil completo, use page-cro.

Que tipos de popups popup-cro trabalha melhor?

popup-cro foi ajustada para lidar com uma ampla variedade de popups de marketing, incluindo:

• Exit-intent email capture popups
• Popups de newsletter e lead magnet
• Discount e promotion modals para first-time visitors
• Overlays de announcement de produto ou feature
• Prompts de feedback e pesquisa
• Sticky bars e notification banners em landing pages

popup-cro define o design visual ou só a estratégia?

popup-cro foca principalmente em estratégia e mensagem:

• Objetivo e público bem definidos
• Timing, triggers e regras de frequência
• Escolha de oferta e forma de apresentar o incentivo
• Sugestões de headline, body copy e CTA
• Recomendações de tamanho e campos do formulário

Você ou suas ferramentas de design cuidam do visual em si (cores, fontes, layout). popup-cro vai apenas destacar pontos de UX, como facilitar o fechamento do popup e garantir boa usabilidade em mobile.

popup-cro pode me ajudar a não irritar usuários?

Sim. Um objetivo central de popup-cro é aumentar conversão sem irritar usuários nem prejudicar a percepção da marca. A skill incentiva:

• Timing sensato (evitar popups instantâneos antes de qualquer engajamento)
• Limitar a frequência com que um popup aparece por sessão/usuário
• Respeitar dismissals (não mostrar novamente por um período definido)
• Manter a copy honesta e alinhada com seu product marketing context

popup-cro inclui benchmarks de performance?

As avaliações do repositório indicam que popup-cro faz referência a faixas típicas de conversão para tipos comuns de popup (por exemplo, o que é razoável para exit-intent popups). Você pode usar essas faixas para:

• Avaliar se um popup atual está abaixo do esperado
• Definir metas e expectativas realistas para testes

Sempre compare com seus próprios dados históricos e com a qualidade do seu tráfego para fechar o diagnóstico.

O que eu preciso ter no meu repositório para melhores resultados?

Para recomendações mais precisas e alinhadas, ajuda ter:

• Um arquivo atual de product marketing context:
  • .agents/product-marketing-context.md, ou
  • .claude/product-marketing-context.md (setups mais antigos)
• Dados básicos de performance de qualquer popup existente (views, conversions, principais fontes de tráfego)
• Clareza sobre seu objetivo principal (por exemplo, crescimento da lista de emails vs vendas imediatas)

popup-cro ainda funciona sem isso, mas fornecer esses insumos melhora a qualidade e a especificidade das orientações.

popup-cro é adequada para modals não voltados a marketing?

Se o seu modal for puramente funcional (por exemplo, diálogos de login, cookie consent, alertas de sistema), popup-cro não é a melhor opção, porque sua orientação é voltada para marketing e conversão. Nesses casos, siga seu design system e guidelines de UX.

popup-cro é ideal quando o modal ou popup existe para gerar uma ação de marketing: cadastros, leads, ofertas ou feedback diretamente ligados a growth e conversão.