Webサイト改善の施策事例

エンタメ系メーカーECにおけるShopify再設計。商品増加・規模拡大に対応するUI改善と運用フローの整理

概要と担当範囲

エンタメ系メーカーのECサイトにおいて、Shopifyの既存テーマをベースに運用していたものの、商品数の増加や事業規模の拡大に伴い、既存のUI・導線では対応しきれなくなった状況に対する改善支援です。

当社はブランドの既存トーン&マナーを踏襲しながら、規模拡大に合わせた導線設計・UI再設計を担当。既存の運用フローへの影響を確認しながら段階的に進めました。

  • CV最適化
  • UI/UX設計
  • 導線改善

課題背景

事業の成長に伴い、Shopifyの既存テーマでの運用に限界が見え始めていました。

  • 商品数・カテゴリ数の増加により、既存テーマのナビゲーションやレイアウトでは情報を整理しきれなくなっていた
  • トップページや商品一覧の導線が商品数の少なかった初期のまま設計されており、回遊性が低下
  • ブランドとして大事にしてきたトーン&マナーは維持したいが、UIは刷新したいという要件
  • テーマの標準機能の範囲では、拡大した商品構成に合った見せ方が実現できない

これはShopifyテーマの問題というより、事業フェーズの変化にサイト設計が追いついていないという構造的な課題でした。

改善の考え方

ブランドの世界観を壊さないことを大前提に、「今の商品規模に合ったUI」へ再設計するアプローチを取りました。また、リニューアルに伴って既存の運用フローが破綻しないよう、変更箇所ごとに運用への影響を確認しながら段階的に進めました。

当社の関与領域

  • UI/UXデザイン
  • 情報設計(IA)
  • Shopifyテーマ開発
  • 運用フロー整理

既存のブランドトーンを維持しながらUIを刷新するため、以下の領域に関与しました。

  • 現行サイトのUI・導線の課題整理と改善方針の策定
  • 増加した商品群を適切に分類・回遊させるためのナビゲーション再設計
  • トップページ・商品一覧・商品詳細ページのレイアウト再設計
  • 既存のトーン&マナーを踏襲したデザインルールの再定義
  • Shopifyテーマのカスタマイズによるフロントエンド実装
  • リニューアルに伴う運用フロー変更箇所の洗い出しと影響確認

変えるべきところと守るべきところの線引きを明確にし、ブランドの一貫性を保ちながら改善を進めました。

主な取り組み

  • 商品数・カテゴリ構成を踏まえたサイト全体のナビゲーション再設計
  • ユーザーの回遊を促すカテゴリ導線・レコメンド表示の最適化
  • 既存ブランドのビジュアルトーンを活かしたUIコンポーネントの再設計
  • Shopify既存テーマからカスタムテーマへの移行と実装
  • 運用担当者との定例レビューによる変更箇所のフロー確認と合意形成

デザイン変更のたびに運用フローへの影響を確認し、「運用が回る状態」を維持しながらリニューアルを進めました。

変化・成果

  • 商品数の増加に耐えうるナビゲーション・導線構造が整備された
  • ブランドの世界観を維持したまま、UIの現代化と回遊性の向上を実現
  • Shopify標準テーマの制約から解放され、事業の成長に合わせた拡張が可能になった
  • 運用フローの整理により、リニューアル後もスムーズに日常運用が継続できている

※具体的な数値は非公表