← GPT-AI-LP
DOCUMENT · 2.2 KB

docs/wf-layout-principles.md

Workspace snapshot · 08/31 23:51

LPワイヤーフレーム・レイアウト原則

PENGINの複数実案件を横断し、クライアント固有の文言・数値・社外秘を持ち込まずに、情報設計の型だけを抽象化したものです。単一案件の見た目をテンプレート化せず、情報量・素材・証拠・CV方法からレイアウトを選びます。

調査母集団

  • 店舗向けBtoBサービス:FV内フォーム、ロゴ帯、仕組み図、検知サンプル、用途グリッド、円形ステップ
  • 士業セミナー:悩み、選ばれる理由、解決マップ、遅延リスク、当日の流れ、専門家、申込フォーム
  • AI業務支援:概念提示、Before/After、業務別ユースケース、効果指標、4週間工程、3プラン
  • 業務改善支援:人とAIの役割比較、支援メニュー、代替比較、業界実績、支援チーム
  • 住宅設備商品:商品ステージ、権威性、3ステップ、商品ラインナップ、写真付き事例、サンプル請求
  • 個人向け相談:診断導線、放置リスク、費用構造、活用例、利用者の声、予約フォーム

選定ルール

  • FVはCVがフォームなら hero-form、商品理解が先なら hero-product-stage、強い実績があるなら hero-proof-split、新概念の理解が最優先なら hero-copy-led。
  • 課題は短い並列項目ならカード、具体チェックならチェックリスト、前提説明が必要ならナラティブ。
  • 仕組みは順序ならステップ、変化の対比ならBefore/After、複数要因の関係なら解決マップ。
  • 実績は数値だけならメトリクス、顧客の背景から結果まで読ませるなら事例特集、声が主証拠ならレビューカード。
  • 価格は同条件のプラン比較ならカード、商品群ならラインナップ、個別要件で変わるなら見積説明。
  • CTAはページ途中の再提示ならバナー、体験物があるならサンプルCTA、入力が主目的ならフォーム分割。

同一のレイアウトを連続させず、各セクションの「読者がここで何を判断するか」に合わない型は使いません。