web-dev-qa-db-ja.com

モバイルWebサイトに製品比較を実装する最良の方法は何ですか?

これまでのところ、この例(Best Buy)は1つしか見つかりませんでしたが、十分に実行されていません。製品の比較が可能なモバイルサイトの良い例があるのか​​、それとも比較機能がモバイルでうまく実行できるものではないのだろうか。

11
Michael Histen

製品の比較には多くの不動産が必要になることが多いため、これはUXの難しい課題です。ここで明らかにモバイルデバイスでの競合。

誰も本当にそんなにうまくやっているわけではないので、モバイルデバイスの強みを発揮する、思いがけないことを少し試してみませんか?私の考えの1つは、オリエンテーションで遊ぶことです。垂直モードで一連のサムネイルが表示されるように設定できます。それは視覚的な比較になります。垂直モードには、初めてユーザーが水平モードに切り替えて仕様を比較するように促すための小さな説明テキストも含まれます。画面を回転させると、右にスライドして製品の詳細を表示する機能と、技術仕様を比較できます。

そのような何かはきちんとすることができます。

2
Matthew Moore

それが「最良の方法」かどうかはわかりませんが、すぐに思いついたのは、比較している製品属性の水平スクロールリストです。 Appleは、アプリケーションのスクリーンショットをスクロールできるApp Storeアプリでも同様のことを行います。スクリーンショットではなく、製品の属性を表示していると想像してください。比較している属性のリストがそれほど長くない場合、二重スクロールの状況(水平および垂直)になる可能性があります。

2
Andy S

私が出会った唯一のレスポンシブな業界ソリューションは http://www.samsung.com/nl/consumer/tv-audio-video/televisions/ です。いくつかの調整により、最小のビューポートでもうまく機能する場合があります。比較のためにあまりにも多くの製品を使用しないように考慮してください。

1
Great Dane

比較に技術仕様が含まれていると仮定します-ユーザーが多かれ少なかれ重要な仕様項目を追加、削除、または配置(ドラッグアンドドロップ)できるようにします。ユーザーが新しいモニターを購入する場合は、解像度が重要な要素になることがあります。ユーザーにその仕様のみを比較させます。

0
Tony Bolero

デザインの列が1つだけであると仮定して、最初に一般的な属性のリストを作成し、次に、さまざまな属性のリストを順番に並べますが、リストアイテム内に含めます。

COMMON:
-----------------
Touchscreen
-----------------
1GHz processor
-----------------
Aluminum body
-----------------

COMPARISON:
-----------------
(1) Android
·················
(2) WebOS
-----------------
(1) 4 inch screen
·················
(2) 3 inch screen
-----------------
0
Naoise Golden

横スクロールがこの問題の最良の答えだと思います。そして、Andy Sの発言は、Apple App Storeが機能するはずのアプリ詳細内のスクリーンショットギャラリーのようなものです。

0
Luis Arriojas