Amazonメニューの気づかれない進化

昨日、Amazonメニューの配慮について、衝撃を受けたことを書きました。

ただ、衝撃を受けたのは2年前で、その当時と2016年現在のメニューでは、操作感が微妙に変わっているような気がします。

真偽を確かめるため、サイトの過去の状態を見ることができるWayback Machineでタイプスリップして調査しました。

 

・・・やはり、進化してます。

2014年当時はメニューをマウスオーバーして、プルダウンが表示されるまで0.3秒遅らせる処理でした。

キャプチャ:Amazon2014年のメニュー挙動
2014年当時のAmazonメニュー

ユーザーの意図に反してプルダウンが表示されることを防ぐ点では、大きな効果を発揮したと思いますが、弱点もありました。

  • マウス操作が遅いとプルダウンが表示されてしまう
  • メニューを使う気満々のユーザーにとっては、0.3秒待たされる

キャプチャ:Amazonメニュー2014年の問題

Gifアニメだと分かりにくいかもしれませんが、横方向にマウスを移動したとき、プルダウンが開かない0.3秒の時間が連続で発生します。

この問題を解決するため、マウスが止まったときにプルダウン表示させるという仕組みに改修されていました。

Amazonの進化を見るたびに、毎回脱帽です。

Amazonメニューの気づかれない配慮

AmazonのUIにおけるこだわりで、衝撃を受けたことがあります。

PCサイトを利用中、メニューをマウスオーバーした時です。

キャプチャ:Amazonのメニューでマウスカーソルが反応しない

「アカウントサービス▼」、「プライム▼」、「リスト▼」といったページ上部のメニューをマウスオーバーしても、マウスカーソルが移動中の場合、メニューがプルダウン表示しないようになっています。

これは、ブラウザ上部にあるタブなどを操作をしてから、マウスカーソルをサイト上に移動した際、コンテンツが隠れないようにする配慮です。

もし、メニューが即時にプルダウン表示していたら、ユーザーの意図に反して情報が隠れたり、押したいところが押せなかったり、最悪、メニューを誤ってクリックするなど、ストレスの原因になります。

キャプチャ:Amazonのサイトメニューが即展開していたら

AmazonのPCサイトでは、マウスカーソルがメニューの上で停止したときだけ反応するよう、配慮されています。

キャプチャ:Amazonのメニューでマウスカーソルが反応するタイミング

気づくユーザーは非常に少ないと思いますが、「あまりに自然で操作していることを意識させない」・・・気づかれないことが、UIデザインの目標の一つでもあります。
UIではなく、コンテンツに意識がいってほしいからです。

 

そんな、気づかれないUIデザインにこだわりすぎて、最近UIデザインの仕事を受注できなくなりました・・・。

 

クリスマスのAmazon UXデザイン

AmazonのWebサイトでは、いつも小さな感動を覚えます。

クリスマス前に商品ページに表示される文言。

「クリスマスイブまでにお届け。」

キャプチャ:クリスマスイブまでにお届け。の表記

この一言は、到着日が機械的に掲載されるよりも、人間ぽく、ちょっとした心遣いを感じるかもしれません。

人から人へプレゼントを贈るこの時期は、普段とは違うUX(行動や体験)デザインが求められ、UI(表示)デザインも変化します。

ちなみに、今回の事例は「人間ぽく、ちょっとした心遣いを感じる」といったものの、実際は全商品ページに機械的に「クリスマスイブまでにお届け。」と埋め込まれているようです。もちろん、この文言は全ユーザーに必要な情報ではありません。

だからといって、クリスマスの行動を把握され、個人ごとにリコメンドされても困りますので・・・全ユーザーに表示することが、費用対効果も考え現実的な施策なのでしょう。

 

余談です。

妻が料理で使う「はかり」を欲しがっているのは知っていたので、クリスマスプレゼントに用意しました。

しかし、クリスマス直前に妻がホームセンターで買ってしまい、2つになりました。

写真:はかりが2つ

ユーザー行動を予測できなかった失敗例です。。

しかも私のプレゼントより高機能だし。

このブログについて

社会の利便性をちょっとでも上げられたら

IT分野を中心に、ユーザビリティ、アクセシビリティ、UI、UXデザインの情報を発信するブログです。

お役に立てる情報があれば幸いです。