見出し画像

Amazon.co.jpのUIを変えてみた。

私は大半の買い物をAmazonで済まします。東京で一人暮らししていますが、机から食器まで、ほとんどAmazon Primeに翌日配送してもらいました。そうなるとリピートしたいものが出てくるのですが、Amazonの注文履歴がどうも使いづらい部分があったのでAdobe XDを使って改善案を作ってみました。

注文履歴を閲覧しにくい

画像1

上の画像に挙げたように、Amazonのヘッダーにある「注文履歴」から自分が購入した商品を閲覧できるのですが、初期設定で「過去3か月」のアイテムが表示されるようになっています。ただ私はリピートしたい商品をいつ購入したか記憶になく、検索欄でワードを叩いてもうまくヒットしてくれませんでした。そうなると、「大体この時期に購入したかもしれない」とアテをつけて「2021年」から順に各年を一つずつ見ていかないといけません。

また、注文履歴のページでは「直近購入した商品」から「購入時期が最も古い商品」を一度に見ることができません。上記の「いつ商品を購入したかわからず、検索しても引っかからない」ケースでは、見つけ出すのにかなり時間がかかります。

注文履歴には「パンくずリスト」が設定してあり、1ページに表示する商品が10を超えると「2」のページに飛びます。こちらも商品を購入した時期が若い場合、7、8回ほどページを移動しなければなりません。

表示期間を「これまで」に / 自動でコンテンツ読み込み

これらの問題を解決するために注文履歴の初期表示設定を「これまで」にしてみました。また「パンくずリスト」も取っ払い、ページ最下部までスクロールすると自動で次の商品群を読み込むような改善案を提示します。

具体的には以下のGIFをご覧ください。

(直接GIFをアップロードしたいのですが「データ処理中」表示が出たままで載せられないので、mp4ダウンロード形式にしました。。)​

こうすることで「購入商品の閲覧性」はグッと上がるはずです。パンくずリストの撤廃に関しては、よりシームレスなユーザー体験ができると思います。ただこれは1ページで全ての商品を表示する関係上、商品の探し直しがしにくい部分が欠点といえば欠点ですね。1ページに表示できる商品数を設定して、パンくずリストを用意すれば、仮にリピートしたい商品を見逃したとして、商品を見返したいときにブラウザバックしやすいです。

ただ、個人的にはページ遷移の回数が増えて、読み込みする機会が多くなると、それだけ端末への負荷も高まると思うので、今回の改善案では自動読み込み型の設計をしてみました。

この記事が気に入ったらサポートをしてみませんか?