to the
top

studio clear.ウェディングフォトスタジオ

  • #website
  • #自主制作
バナー画像

ブライダルフォトサロンの世界観を表現
現場スタッフが手軽にミスなく更新できるWordPress実装によるWebサイト構築(ポートフォリオ用架空プロジェクト)

制作期間

3日

使用ツール

WordPress

Webサイトへ

情報設計

  1. 要件定義 要件定義
  2. ペルソナ ペルソナ
  3. ユーザーストーリー ユーザーストーリー
  4. スタイルガイド

工夫した点

  1. 【ファーストビュー】直感的なブランディング ファーストビュー

    画面いっぱいに広がる写真と、キャッチコピーを静かにフェードインさせることで、SNSや広告から流入したユーザーに対し、サロンのトンマナを一瞬で直感的に印象付けます。
    また情報をシンプルにすることで、主役である「写真のクオリティ」を際立たせることでブランド価値を高めるデザインにしました。

  2. 【GALLERY】スクロールを促すアシンメトリーレイアウト

    画一的な均等グリッドにあえて囚われず、写真を交互・不規則に配置するエディトリアル(雑誌風)なレイアウトを採用しました。

    あえて不規則に配置することでユーザーにスクロールを促し、下層ページへの回遊率を向上。

  3. 【PLAN】離脱を防ぐ「1ページ完結型」

    ユーザーが最も比較検討したい「価格や含まれるセット内容」は、ページ遷移をさせず、その場で開閉するアコーディオンUIで実装しました。

    「プラン比較のために何度もページを行き来する」ストレスを排除しました。
    ユーザーの熱量を維持したまま、スムーズに体験フェアや予約導線へと繋げる、コンバージョンを意識した設計にしています。

  4. キャンペーンページへの誘導バナー バナーの制作意図
  5. 【ページ構成の分離】高画質写真による表示速度低下の回避


    詳細な「GALLERY(全作品一覧)」と「キャンペーン」をトップページから切り離し、別ページ化しました。

    ブライダル写真の高画質なファイルサイズによる「トップページの読み込み遅延」を回避。
    表示速度を最速に保つことでユーザーの離脱を防ぎます。
    また、「和装 ギャラリー」「前撮り フェア」など、目的が明確な検索ユーザーをダイレクトに下層ページへ着地させられるため、SEO(集客)面でも強いサイト構造にしています。

WORKS