カラーバリエーションの適切な表示と検索を実現したECサイト改修事例 – 商品ページと検索機能の両立を図るシステム対応|オートプロジェクトのシステム開発・構築事例
依頼の背景
あるメーカーのECサイトでは、数千点におよぶ商品を取り扱っており、それぞれに多彩なカラーバリエーションが存在していました。たとえば「青」といっても「スカイブルー」や「ブルードット」など細分化された名称があります。
しかし、ECシステム移行の際、システムの仕様により個別のカラーバリエーション名がすべて「青」に集約されてしまいました。その結果、商品ページ上では複数の「青」が並び、ユーザーにとってはどの色を選べばよいのか判断が難しい状況となっていました。
顧客の希望仕様
お客様からは、以下のようなご要望をいただきました。
- 商品ページでは「スカイブルー」「ブルードット」など個別のカラーバリエーション名を適用したい
- 一方で、サイト全体に備わっているカラー検索機能では、個別の色名をそのまま反映すると数百もの選択肢が並び、UX(ユーザー体験)が大きく損なわれてしまう
- そのため、検索機能上では「青(系)」「赤(系)」といった大分類に集約し、利便性を確保したい
オートプロジェクトが行った開発・対応
こうした課題に対し、当社では以下の対応を行いました。
- カラーバリエーションの削除前に、事前バックアップを実施
- 旧システムで利用していた個別カラー名を取得し、CSVとして整理
- 検索機能に対応するため、「検索用選択肢(例:青)」と「商品ごとの個別カラー名(スカイブルーやブルードットなど)」の対照表を作成
- 実際のインポート前にテストを行い、その後インポート作業を実施
- 検索ロジックを修正し、商品ページと検索機能の両立を実現
このようにして、ユーザーが商品ページ上で正確にカラーバリエーションを選べる一方で、検索機能ではシンプルかつ使いやすい集約表示を可能にしました。
IT担当者がいない企業のみなさまへ
株式会社オートプロジェクトでは、スタッフが直接お伺いし、PC・ソフトのトラブル解決や、クラウド導入の設定支援などを行います。現場で一緒に確認できる、安心の「訪問サポート」をぜひご利用ください。
