studio clear.ウェディングフォトスタジオ
ブライダルフォトサロンの世界観を表現
現場スタッフが手軽にミスなく更新できるWordPress実装によるWebサイト構築(ポートフォリオ用架空プロジェクト)
制作期間
3日
使用ツール
WordPress
情報設計
- 要件定義
- ペルソナ
- ユーザーストーリー
- スタイルガイド
工夫した点
- 【ファーストビュー】直感的なブランディング
画面いっぱいに広がる写真と、キャッチコピーを静かにフェードインさせることで、SNSや広告から流入したユーザーに対し、サロンのトンマナを一瞬で直感的に印象付けます。
また情報をシンプルにすることで、主役である「写真のクオリティ」を際立たせることでブランド価値を高めるデザインにしました。 - 【GALLERY】スクロールを促すアシンメトリーレイアウト
画一的な均等グリッドにあえて囚われず、写真を交互・不規則に配置するエディトリアル(雑誌風)なレイアウトを採用しました。
あえて不規則に配置することでユーザーにスクロールを促し、下層ページへの回遊率を向上。
- 【PLAN】離脱を防ぐ「1ページ完結型」
ユーザーが最も比較検討したい「価格や含まれるセット内容」は、ページ遷移をさせず、その場で開閉するアコーディオンUIで実装しました。
「プラン比較のために何度もページを行き来する」ストレスを排除しました。
ユーザーの熱量を維持したまま、スムーズに体験フェアや予約導線へと繋げる、コンバージョンを意識した設計にしています。 - キャンペーンページへの誘導バナー
- 【ページ構成の分離】高画質写真による表示速度低下の回避
詳細な「GALLERY(全作品一覧)」と「キャンペーン」をトップページから切り離し、別ページ化しました。ブライダル写真の高画質なファイルサイズによる「トップページの読み込み遅延」を回避。
表示速度を最速に保つことでユーザーの離脱を防ぎます。
また、「和装 ギャラリー」「前撮り フェア」など、目的が明確な検索ユーザーをダイレクトに下層ページへ着地させられるため、SEO(集客)面でも強いサイト構造にしています。