関連商品表示のロジック

関連商品表示とは

「この商品と似た商品」を表示する機能です。お客様が比較検討しやすいよう、同じカテゴリの別商品を提案します。

「コーディネート提案」が異なるカテゴリの商品を提案するのに対し、関連商品は同じカテゴリ内での選択肢を広げます。

表示する商品の選び方

基本的な条件

• 同じカテゴリ: ジャケットを見ているなら、他のジャケット
• 同じ性別: メンズならメンズ
• 同じシーズン: 秋冬なら秋冬、または通年
• 現在の商品は除外: 今見ている商品自体は表示しない

優先度の考え方

条件に合う商品が多い場合、以下を考慮して選んでいます。

• 価格帯が近い商品: 大きく価格が異なる商品より、近い価格帯を優先
• 在庫がある商品: 在庫切れより、すぐ購入できる商品を優先
• 新着商品: 古い商品より、新しい商品を優先

コーディネート提案との違い

表示の最適化

表示件数

関連商品は多すぎると逆に選びにくくなります。適度な件数に絞って表示しています。

画像の重要性

関連商品は「パッと見て比較できる」ことが重要です。商品画像を中心に、価格と商品名を簡潔に表示しています。

レスポンシブ対応

スマートフォンでは横スクロールで表示し、PCでは複数列のグリッドで表示するなど、デバイスに応じた最適なレイアウトにしています。

データ取得の効率化

APIの呼び出しを最小化

商品ページの表示時に、メインの商品情報と一緒に関連商品も取得します。別々に取得するよりも、通信回数を減らせます。

キャッシュの活用

一度取得した関連商品情報は、一定時間キャッシュしています。同じ商品ページに複数のお客様がアクセスしても、APIへの負荷を抑えられます。

構成図

まとめ

関連商品表示は、お客様の比較検討をサポートする機能です。適切な商品を選んで表示することで、購入の意思決定を後押しします。コーディネート提案と組み合わせることで、より充実した商品提案が可能になります。