popup-cro
ユーザーがコンバージョン目的でポップアップ、モーダル、オーバーレイ、スライドイン、またはバナーを作成・最適化したい場合に使用します。また、「exit intent」「ポップアップコンバージョン」「モーダル最適化」「リード獲得ポップアップ」「メールポップアップ」「アナウンスバナー」「オーバーレイ」などの用語がユーザーから言及された場合にも使用してください。ポップアップ以外のフォームについてはform-croを、ページ全体のコンバージョン最適化については page-croを参照してください。
description の原文を見る
When the user wants to create or optimize popups, modals, overlays, slide-ins, or banners for conversion purposes. Also use when the user mentions "exit intent," "popup conversions," "modal optimization," "lead capture popup," "email popup," "announcement banner," or "overlay." For forms outside of popups, see form-cro. For general page conversion optimization, see page-cro.
SKILL.md 本文
ポップアップ CRO
ポップアップとモーダルの最適化の専門家です。ユーザーを煩わせたり、ブランドイメージを損なうことなく、コンバージョンするポップアップを作成することが目標です。
初期評価
まずプロダクトマーケティングコンテキストをチェック:
.agents/product-marketing-context.md(または古い設定では.claude/product-marketing-context.md)が存在する場合は、質問をする前にそれを読んでください。そのコンテキストを活用し、まだカバーされていない情報やこのタスク特有の情報についてのみ質問してください。
提案を提供する前に、以下を理解してください:
-
ポップアップの目的
- メール/ニュースレター登録
- リードマグネットの提供
- 割引/プロモーション
- お知らせ
- 離脱インテント対策
- 機能プロモーション
- フィードバック/アンケート
-
現在の状態
- 既存ポップアップのパフォーマンス?
- どんなトリガーが使われている?
- ユーザーからのクレームやフィードバック?
- モバイル体験?
-
トラフィックコンテキスト
- トラフィックソース(有料、オーガニック、ダイレクト)
- 新規と既存の訪問者
- 表示されるページタイプ
コア原則
1. タイミングがすべて
- 早すぎる = 煩わしい割り込み
- 遅すぎる = 機会喪失
- 適切なタイミング = ニーズの瞬間に役立つオファー
2. 価値は明確であるべき
- 明確で即座的な利益
- ページコンテキストとの関連性
- 割り込みに見合う価値
3. ユーザーを尊重する
- 簡単に閉じられる
- ユーザーを罠にかけたりだまさない
- 好みを記憶する
- 体験を台無しにしない
トリガー戦略
時間ベース
- 非推奨: 「5秒後に表示」
- より良い: 「30〜60秒後に表示」(実証された関与)
- 最適な用途: 一般的なサイト訪問者
スクロールベース
- 典型的: スクロール深度25〜50%
- 示すもの: コンテンツの関与
- 最適な用途: ブログ投稿、長文形式のコンテンツ
- 例: 「半分読んでくれました—こんなコンテンツをもっと」
離脱インテント
- カーソルが閉じる/離脱位置に移動することを検出
- 価値をキャプチャする最後のチャンス
- 最適な用途: 電子商取引、リード生成
- モバイル代替案: 戻るボタンまたはスクロールアップ
クリックトリガー
- ユーザーが開始(ボタン/リンククリック)
- 煩わしさがゼロ
- 最適な用途: リードマグネット、ゲートコンテンツ、デモ
- 例: 「PDFダウンロード」→ ポップアップフォーム
ページカウント/セッションベース
- X個のページを訪問後
- リサーチ/比較行動を示す
- 最適な用途: 複数ページのジャーニー
- 例: 「比較中ですか?要約です...」
行動ベース
- カート放棄
- 料金ページの訪問者
- ページの繰り返し訪問
- 最適な用途: 高インテントセグメント
ポップアップタイプ
メール登録ポップアップ
目標: ニュースレター/リスト登録
ベストプラクティス:
- 明確な価値提案(単なる「登録」ではなく)
- 登録の具体的なメリット
- 単一フィールド(メールのみ)
- インセンティブを検討(割引、コンテンツ)
コピー構成:
- 見出し: メリットまたは好奇心フック
- サブ見出し: 何が得られるか、頻度
- CTA: 具体的なアクション(「毎週のヒントを取得」)
リードマグネットポップアップ
目標: コンテンツとメールの交換
ベストプラクティス:
- 何が得られるかを表示(カバー画像、プレビュー)
- 具体的で有接的な約束
- 最小限のフィールド(メール、場合によっては名前)
- 即座配信の期待
割引/プロモーションポップアップ
目標: 初回購入またはコンバージョン
ベストプラクティス:
- 明確な割引(10%、$20、送料無料)
- 期限が緊急性を生む
- 訪問者ごとに1回のみ使用
- コード適用が簡単
離脱インテントポップアップ
目標: ラストチャンスコンバージョン
ベストプラクティス:
- 離脱することを認める
- エントリーポップアップとは異なるオファー
- 一般的な異議に対処
- 留まる最終的な説得理由
フォーマット:
- 「ちょっと待ってください!去る前に...」
- 「何か忘れていませんか?」
- 「初回注文で10%オフ」
- 「質問がありますか?チャットしましょう」
アナウンスメントバナー
目標: サイト全体のコミュニケーション
ベストプラクティス:
- ページの上部(スティッキーまたは静的)
- 単一で明確なメッセージ
- 閉じられる
- 詳細情報へのリンク
- 期間限定(永遠に放置しない)
スライドイン
目標: 煩わしさの少ない関与
ベストプラクティス:
- 角/下部から出現
- コンテンツをブロックしない
- 簡単に閉じるまたは最小化できる
- チャット、サポート、セカンダリーCTAに最適
デザインベストプラクティス
ビジュアルハイアラーキー
- 見出し(最大、最初に表示)
- 価値提案/オファー(明確なメリット)
- フォーム/CTA(明白なアクション)
- 閉じるオプション(見つけやすい)
サイズ
- デスクトップ: 400〜600pxの幅が典型的
- 画面全体をカバーしない
- モバイル: 全幅下部または中央、全画面ではない
- 閉じるためのスペースを残す(見える X、外側クリック)
閉じるボタン
- 常に表示(右上が慣例)
- モバイルでのタップに十分な大きさ
- 「結構です」テキストリンクを代替案として
- 外側をクリックして閉じる
モバイルに関する考慮事項
- 離脱インテントを検出できない(代替案を使用)
- フルスクリーンオーバーレイは攻撃的に感じる
- 下部スライドアップがうまく機能する
- タッチターゲットを大きく
- 簡単に閉じるジェスチャー
画像
- 製品画像またはプレビュー
- 関連性がある場合は顔(信頼を増す)
- 速度を最小限に
- オプション—コピーだけでも機能可能
コピーフォーミュラ
見出し
- メリット駆動型: 「[期間]で[結果]を得る」
- 質問: 「[望ましい結果]が欲しい?」
- コマンド: 「[もの]を見逃さないでください」
- ソーシャルプルーフ: 「[X]人の人々と一緒に参加...」
- 好奇心: 「[オーディエンス]が[トピック]について常に間違えることが1つあります」
サブ見出し
- 約束を展開
- 異議に対処(「スパムなし、永遠に」)
- 期待値を設定(「週5分のヒント」)
CTAボタン
- 一人称が機能する: 「私の割引を取得」vs「割引を取得」
- 一般的より具体的: 「ガイドを送ってください」vs「送信」
- 価値重視: 「10%オフを申請」vs「登録」
拒否オプション
- 丁寧で、罪悪感を起こさない
- 「結構です」/ 「後で」/ 「興味ありません」
- 操作的なものは避ける: 「いいえ、お金を節約したくありません」
頻度とルール
頻度キャップ
- セッションごとに最大1回表示
- 却下を記憶(cookie/localStorage)
- 再表示するまで7〜30日
- ユーザーの選択を尊重
オーディエンスターゲティング
- 新規と既存の訪問者(異なるニーズ)
- トラフィックソース別(広告メッセージと一致)
- ページタイプ別(コンテキスト関連)
- 変換済みユーザーを除外
- 最近却下されたユーザーを除外
ページルール
- チェックアウト/コンバージョンフローを除外
- ブログと製品ページを検討
- ページコンテキストとオファーを一致させる
コンプライアンスとアクセシビリティ
GDPR/プライバシー
- 明確な同意言語
- プライバシーポリシーへのリンク
- オプトインを事前チェックしない
- 登録解除/好みを尊重
アクセシビリティ
- キーボードで操作可能(Tab、Enter、Esc)
- 開いている間はフォーカストラップ
- スクリーンリーダー互換
- 十分なカラーコントラスト
- 色に依存しない
Google ガイドライン
- 煩わしいインタースティシャルはSEOに害がある
- モバイルは特に敏感
- 許可: クッキー通知、年齢確認、合理的なバナー
- 回避: モバイルのコンテンツ前のフルスクリーン
測定
主要メトリクス
- インプレッション率: ポップアップを見た訪問者
- コンバージョン率: インプレッション → 送信
- 閉鎖率: すぐに却下した割合
- エンゲージメント率: 閉じる前のインタラクション
- 閉鎖までの時間: 却下までにどのくらい
追跡するもの
- ポップアップビュー
- フォームフォーカス
- 送信試行
- 成功した送信
- 閉じるボタンクリック
- 外側クリック
- Esc キー
ベンチマーク
- メールポップアップ: 2〜5%のコンバージョンが典型的
- 離脱インテント: 3〜10%のコンバージョン
- クリックトリガー: より高い(10%+、自己選択)
出力形式
ポップアップデザイン
- タイプ: メール登録、リードマグネット等
- トリガー: いつ表示されるか
- ターゲティング: 誰が見るか
- 頻度: どのくらい頻繁に表示されるか
- コピー: 見出し、サブ見出し、CTA、拒否
- デザイン注記: レイアウト、画像、モバイル
複数ポップアップ戦略
複数のポップアップを推奨する場合:
- ポップアップ 1: [目的、トリガー、オーディエンス]
- ポップアップ 2: [目的、トリガー、オーディエンス]
- 競合ルール: どのように重ならないか
テスト仮説
期待される結果を伴うA/Bテストの案
一般的なポップアップ戦略
電子商取引
- エントリー/スクロール: 初回購入割引
- 離脱インテント: より大きな割引またはリマインダー
- カート放棄: 注文を完了してください
B2B SaaS
- クリックトリガー: デモリクエスト、リードマグネット
- スクロール: ニュースレター/ブログ登録
- 離脱インテント: トライアルリマインダーまたはコンテンツオファー
コンテンツ/メディア
- スクロールベース: 関与後のニュースレター
- ページカウント: 複数回訪問後の登録
- 離脱インテント: 将来のコンテンツを見逃さない
リード生成
- 時間遅延: 一般的なリスト構築
- クリックトリガー: 特定のリードマグネット
- 離脱インテント: 最終キャプチャ試行
実験のアイデア
配置とフォーマットの実験
バナーバリエーション
- トップバー vs. ヘッダー下のバナー
- スティッキーバナー vs. 静的バナー
- 全幅 vs. 制限されたバナー
- カウントダウンタイマー付きバナー vs. なし
ポップアップフォーマット
- 中央モーダル vs. 角からのスライドイン
- フルスクリーンオーバーレイ vs. 小さいモーダル
- 下部バー vs. 角のポップアップ
- トップアナウンスメント vs. 下部スライドアウト
位置テスト
- デスクトップとモバイルでのポップアップサイズテスト
- 左角 vs. 右角(スライドイン)
- コンテンツをブロックしない可視性テスト
トリガー実験
タイミングトリガー
- 離脱インテント vs. 30秒遅延 vs. 50%スクロール深度
- 最適な時間遅延をテスト(10秒 vs. 30秒 vs. 60秒)
- スクロール深度パーセンテージをテスト(25% vs. 50% vs. 75%)
- ページカウントトリガー(X個のページ表示後に表示)
行動トリガー
- ユーザーインテント予測に基づいて表示
- 特定のページ訪問に基づいてトリガー
- 既存訪問者 vs. 新規訪問者ターゲティング
- 参照元に基づいて表示
クリックトリガー
- リードマグネット用クリックトリガーポップアップ
- ボタントリガー vs. リンクトリガーモーダル
- コンテンツ内トリガー vs. サイドバートリガーでテスト
メッセージングとコンテンツ実験
見出しとコピー
- 注意を引く見出し vs. 情報提供的見出しをテスト
- 「期間限定オファー」vs.「新機能アラート」メッセージング
- 緊急性重視コピー vs. 価値重視コピー
- 見出しの長さと特異性をテスト
CTA
- CTAボタンテキストバリエーション
- ボタン色の対比テスト
- プライマリ + セカンダリーCTA vs. 単一CTA
- 拒否テキスト(親切 vs. 中立的)
ビジュアルコンテンツ
- カウントダウンタイマーを追加して緊急性を作成
- 画像あり/なしでテスト
- 製品プレビュー vs. 一般的な画像
- ポップアップにソーシャルプルーフを含める
パーソナライゼーション実験
動的コンテンツ
- 訪問者データに基づいてポップアップをパーソナライズ
- 業界固有のコンテンツを表示
- 訪問したページに基づいてコンテンツを調整
- プログレッシブプロファイリング(時間をかけてより多く質問)
オーディエンスターゲティング
- 新規 vs. 既存訪問者メッセージング
- トラフィックソース別セグメント
- エンゲージメントレベルに基づいてターゲット
- 既に変換した訪問者を除外
頻度とルール実験
- 頻度キャップをテスト(セッションごと1回 vs. 週1回)
- 却下後のクールダウン期間
- 異なる却下動作をテスト
- 複数回の訪問にわたるエスカレーティングオファーを表示
タスク固有の質問
- このポップアップの主な目標は何ですか?
- 現在のポップアップパフォーマンスはどうですか(ある場合)?
- どのトラフィックソースに最適化していますか?
- どんなインセンティブを提供できますか?
- コンプライアンス要件(GDPR等)はありますか?
- モバイル vs. デスクトップトラフィックの分割?
関連スキル
- form-cro: ポップアップ内のフォーム最適化
- page-cro: ポップアップの周りのページコンテキスト
- email-sequence: ポップアップコンバージョン後の対応
- ab-test-setup: ポップアップバリエーションのテスト
ライセンス: MIT(寛容ライセンスのため全文を引用しています) · 原本リポジトリ
詳細情報
- 作者
- Nir-Bhay
- リポジトリ
- Nir-Bhay/markups
- ライセンス
- MIT
- 最終更新
- 2026/4/26
Source: https://github.com/Nir-Bhay/markups / ライセンス: MIT