Z型パターン

状況: スキンケアD2CのLPでCVR（購入率）が0.8%。ヒートマップで確認すると、CTAボタンが左下に配置されており視線の流れから外れていた。

適用プロセス:

1. Z型パターンに基づき、左上にブランドロゴ、右上に「お試しセット」のテキストリンクを配置
2. 対角線上に使用前後の比較画像を大きく配置
3. 右下にメインCTA「初回限定セットを試す」を配置

成果: CTAのクリック率が2.4倍に向上し、CVRが0.8%→1.9%に改善。ファーストビューだけでの購入完了が全体の35%を占めるようになった。

状況: 音楽フェスのチケット販売ページで、ページ訪問者の購入率が12%と目標の20%に未達。

適用プロセス:

1. ファーストビューをZ型で再設計。左上にフェスロゴ、右上に日程・会場情報
2. 対角線上にアーティスト写真のコラージュ（視線を引きつける動的要素）
3. 右下に「チケットを購入する」ボタンを大きく配置。さらにスクロール後もジグザグレイアウトで各出演者紹介→チケットCTAを繰り返す構成に

成果: 購入率が12%→24%に倍増。特にスマートフォンからの購入が前年比180%に伸びた。

状況: 会計SaaSのトップページが情報過多で、訪問者が何をすべきか迷い、無料トライアル開始率が3.2%にとどまっていた。

適用プロセス:

1. トップページの情報を大幅に削減し、Z型レイアウトに再構成
2. 左上にロゴ+ワンフレーズ、右上にログインボタン。対角線上にプロダクト画面のスクリーンショット（実際の利用イメージ）
3. 右下に「無料で始める」CTA。その下はジグザグで「機能紹介→顧客の声→料金→CTA」を展開

成果: 無料トライアル開始率が3.2%→6.1%に改善。ページ内の平均スクロール深度も58%→76%に向上し、情報がスムーズに伝わるようになった。