画像が横方向に、ビュンビュン切り替わっていくカルーセルUI。
Amazonのトップページ(2018年1月現在)の切り替わりスピードが速い!?と思い、気になって測定しました。
切り替わりに要する時間は0.2秒
原始的な手法ですが・・・Amazonのトップページを録画し、動画編集ソフトでカルーセルの切り替わり速度を測りました。
0.2秒!
参考までに有名そうなカルーセルライブラリのコード、slickを確認したところ、デモでは0.3秒で設定されていました。
たった0.1秒ですが、1.5倍違いますし、Amazonのカルーセル画像は大きいので、体感速度は恐ろしく速く感じます。
ユーザーを待たせない
これだけ速いのは、カルーセル切り替えの間、ユーザーを待たせないようにする配慮から来たものだと思います。
「読み込みが0.1秒早くなると、売上が1%増加する」というAmazonの発表があったように、待つ要素を極限まで削っているのかもしれません。
0.2秒のスライドは、アニメーションデザインとして見ると体感速度が速すぎ、美しいかどうか分かりませんが、UIデザインとして見ると美しく感じます。
ただし、カルーセルは成果を上げられない事例を良く耳にするので、まずは導入すべきか検討したほうが良さそうです。