『Netflix』vs『Amazon Prime Video』UX辛口比較レビュー ②トップページのUX

②
DESIGNER

世界中に1億人以上の視聴者をもつ『Netflix』と『Amazon Prime Video』。動画配信サービスの利用者が増え続けるいま、それぞれのサービスがもつ特徴にも注目が集まっています。

両サービスのUX(ユーザー・エクスペリエンス)に焦点をあて、それぞれの特徴を全3回の連載で紹介する本シリーズ。第1回は検索機能や検索結果など、検索に関するUXデザインを比較しました。

第2回は「トップページから作品を探す方法」のUXに焦点をあて、両サービスを比較します。

第1回はこちら▼

 

ナビゲーションメニューの比較

Netflixのナビゲーションメニュー

netflix-amazon-3

Netflixのナビゲーションメニューは一箇所にまとまっています。複数のメニューを切り替えながら使う必要がありません。

また、人気コンテンツをキュレーションする取り組みにも注目したいところ。画像ではメニューバーに「Holidays」と表示されていますが、ハロウィーンシーズンにはこの部分が「Halloween」に変わります。

なおNetflixのナビゲーションメニューは上部に固定されており、画面をスクロールしても常にアクセス可能。またナビゲーションメニューをクリックすることで、それぞれ詳細なジャンルにアクセスできます。

netflix-amazon-4

Amazon Prime Videoのナビゲーションメニュー

netflix-amazon-2

Amazonはコアビジネスであるショッピングに重きを置いているために、Amazon Prime Videoのナビゲーション構造はそれに準じています。

Prime Videoのナビゲーションメニューは、画像の①〜③で示した3箇所に分散しています。画像の①はPrime Videoとは関係ない、Amazonショッピングのメニューです。このメニューの有無がショッピングの業績に影響を及ぼさないと判断されれば、いつかPrime Videoから取り除かれるかもしれません。

②のメニューでは、Primeのサービスに含まれている作品や、レンタルおよび購入が可能な作品を選択できます。③は、②で選択した項目下のコンテンツをさらに「映画」「TVドラマ」などのカテゴリで絞り込むためのメニューです。これらのメニュー構造は確実に混乱を生むでしょう。

またAmazon Prime Videoではコンテンツの閲覧中にスクロールダウンするとナビゲーションメニューが隠れてしまう上、ジャンル別に探す機能がありません。

 

ページレイアウトの比較

限られた画面領域を最大限に活用し、数多くの作品を紹介するために、両社とも工夫を凝らしています。異なるテーマを探す際には、垂直スクロール、同じテーマの中で作品を探す際には水平スクロールが両社で採用しています。

水平スクロールはNetflixとAmazon Prime Videoで差を感じる要素のひとつです。Netflixでは、スクロールバーで視覚的にどのくらいスクロールしたかがわかり、さらに最後までスクロールすると自動的に最初まで戻ってきます。一方のAmazon Prime Videoにはスクロールバーがなく、最後までスクロールしたら自力で戻らなければいけません。

netflix-amazon-5

Netflixのページレイアウト

ページトップ

ページトップで宣伝する作品をひとつに絞り、予告編動画を自動再生しています。

netflix-amazon-7

サムネイル画像

サムネイル画像は横長で統一されています。またほとんどのサムネイル画像には、タイトルしか表示されていません。

作品数

画面内に表示される作品数は1行あたり5作品で、一般的なPCの画面全体で2.5行程度が表示される仕様です。

netflix-amazon-10

Amazon Prime Videoのページレイアウト

ページトップ

ページトップにカルーセルを配置し、複数の作品を宣伝しています。予告動画が流れるNetflixとは異なり、表示されるのは静止画のアイキャッチとなっています。

netflix-amazon-6

サムネイル画像

カルーセルの下に各作品のサムネイル画像が並んでいますが、一部のタイトルでは縦長の画像を横長に変換して表示されています。

netflix-amazon-8

サムネイルに賞や出演者名などの情報も重ねて書かれていることがありますが、文字が小さすぎて読めないケースも……。

作品数

Prime Videoでは画面内に1行あたり6作品で、一般的なPCの画面全体で4行程度が表示される仕様です。

Netflixよりも一画面での作品表示数は多いですが、その分文字が小さく読みにくい印象を受けます。

 

作品リストの比較

限られた画面の中でたくさんの作品を表示するためには、作品の表示方法や表示内容を見極めることが不可欠です。大切なのは作品の豊富さをアピールするのではなく、ユーザーがスピーディに目的の作品を選べるよう手助けすること。そのためには、ユーザーが好みそうな作品を、その根拠とともに提示しなければいけません。

両社とも作品の並べ方には力を入れており、どちらも同様のテーマ(ジャンル、人気、トレンド、新作など)に沿ってコンテンツを整理しています。一見あまり差がないように見えますが、注意深く観察するとその違いが見えてきます。

Netflixの作品リスト

Netflixでは視聴履歴やウォッチリスト追加などの履歴に基づいて、おすすめの作品を独自のアルゴリズムのもと割り出しています。作品を視聴すると、その作品を視聴した人へのおすすめリストが表示されるのです。

「実話に基づく映画」「複数の主人公が登場するTV番組・ドラマ」など、おすすめされるジャンルも非常に多岐に渡ります。

netflix-amazon-11

どの行をどの順番で表示するか、特定の作品にどの画像を使用するかなどについても、パーソナライズド化していることが公表されています。

レコメンド機能のアルゴリズムについては以下の記事で詳しく書かれています。

Amazon Prime Videoの作品リスト

Amazon Prime VideoはNetflixに比べると静的で、視聴履歴によって構成があまり変化しません。

たとえばNetflixでは過去に視聴した作品が作品リストに表示されますが、Prime Videoでは再度探す必要があります。

 

作品情報の比較

最後に、作品情報をどのように、どれくらい表示しているかを比較してみましょう。

Netflixの作品情報

使用している画像

作品の中から魅力的な場面を収集し、さらに編集して使用されています。

情報

作品の画像の上にカーソルを移動すると画像が拡大し、ダイジェスト動画が自動再生されます。さらに、動画と重なって小さなテキストによる説明が数秒間だけ表示されます。

netflix-amazon-12

もっと情報を見たいときは、下向きの矢印をクリックするとさらに拡大されます。画面スペースの約70%が動画の再生にあてられており、残りの部分に作品の説明、出演者、ジャンル、獲得した賞などの追加情報が表示されるという仕組みです。

それでもまだ視聴するか決められないか、やはり視聴したくないと思ったら、「こちらもオススメ」から類似のタイトルを探すことも可能。その後も右上のバツ印をクリックすれば、簡単に元の画面に戻れます。

netflix-amazon-13

特に優れていると感じたのは以下の2点です。

  • 2通りの説明:最初にトレーラーを見ているあいだは短い説明が表示され、拡大するとさらに詳細な説明が表示されます。
  • 詳細レコメンド機能:その日の気分で作品を選びたいときに役立つのが、「センチメンタル」や「ラブロマンス」などのキーワードから作品を選べる詳細レコメンド機能。ジャンルよりもさらに細かく絞り込めます。

Amazon Prime Videoの作品情報

使用している画像

提供された画像をそのまま使用しています。

情報

タイトル画像の上にカーソルを移動すると、評価、タイトルの説明、ウォッチリストへの追加と削除、予告編へのリンクなどを含む小さなポップアップがすぐに表示されます。

netflix-amazon-14

ポップアップに表示される情報はほぼ同一ですが、予告編がない作品も存在しています。また説明文が全文表示されず、「詳細」ボタンを押さなければ続きが表示できないケースも。

任意の作品を選択すると、その作品に関する追加情報を閲覧できる別のページに移動します。表示されるのは、類似の作品、説明、出演者、ジャンルなどの情報です。他の作品を見るためには、元のページにブラウザバックしなければいけません。

 

次回の記事

今回はトップページから作品を探す方法にフォーカスして比較しました。

次回は、ユーザーの視聴率を最大化するための「パーソナライズド」について解説したいと思います。

(原文:Gaurav Makkar 翻訳:Asuka Nakajima)

※本記事で扱った各媒体のUXは、2019年1月時点でのものです

 

第3回はこちら▼

 

第1回はこちら▼

SHARE

  • 広告主募集
  • ライター・編集者募集
  • WorkshipSPACE
デザイナー副業案件
Workship