Hub
AI参謀 ランディングページ
(A / B / C 3案 同時公開中)
本ページはハブです。本番運用ではGTM側で配分する想定で、開発・社内レビュー用に3案へ並列アクセスできるようにしています。
各ページに data-lp="a|b|c"
属性を付与しているので、GA4 / GTM側で簡単に切り分けて分析できます。
- A CTA: green
縦長スクロール(写真 × 手書きアクセント)
経営者写真とAI役員の吹き出しがFVの主役。お悩みチェック → 3ステップ → 数字 → 声 → 料金と続く王道構成。
- 写真主導
- 長尺
- Design/LP_A 準拠
- B CTA: green
AI役員会デモ × Bentoグリッド
ダークの「AI役員会デモ」パネルと7名のAI役員イラストがFVの主役。Cast紹介 → Bento6セル → ベネフィット数字。
- イラスト主導
- Bento
- Design/LP_B 準拠
- C CTA: green
横スワイプ体験(没入型)
ダークティール背景のスマホ型6画面を横スワイプで送る没入型UI。チャットデモの吹き出しが順次出現します。
- 横スワイプ
- 没入型
- Design/LP_C 準拠
補足: KPI計測について
-
・各ページの
<body data-lp>と CTA要素のdata-cta-location属性を、GTM / GA4 側で抽出してください - ・実装済みイベント: view_item / scroll_25/50/75/90 / engaged_time / cta_click / trial_signup
-
・GTM/GA4のIDは
PUBLIC_GTM_ID/PUBLIC_GA4_IDで環境変数として設定可能(Vercel側)