見出し画像

「YouTube」のコメント機能をリデザインする

YouTubeを見ているとコメントが気になることがありますよね。動画の内容によると思いますが、数百件もコメントが投稿されている動画も珍しくありません。
動画を中心にコニュニケーションが取れるところがYouTubeとテレビの大きな差でもあります。

しかし、アプリではコンテンツの最下部に配置され、ショートカットリンクもありません。関連動画が16件も配置されており、スクロールしない限り辿り着けません。

個人的にコメントを見ることが多いのでもったいないなーと感じたのがリデザインのきかっけです。

YouTubeの狙い

簡単に言ってしまえばいろいろな動画を次から次へと遷移して、より面白い動画を発掘してもらうことにあるように思います。YouTubeというコンテンツにどれだけ時間を割いてもらうかがポイントとなってきます。
また、コメント数はユーザーによって大きく変わるためコンテンツの最後に配置しておくことで件数の制御をしやすくしているのではないかと思います。

リデザインしてみる(A案)

関連動画の重要度を落とさずに、コメント機能の重要度も上げてみたいと思います。

最初に思いつくのはタブデザインです。
関連動画とコメントをタブで制御することで、ユーザーは好きな方を選べます。

ファーストビューに収めることで、コメントの重要度は上げることができました。
しかし関連動画の優先度が落ちすぎています。コンテンツの多い画面の中で「次の動画」というタイトルがスルーされる可能性があります。

リデザインしてみる(B案)

コメントへの動線をあげながら、関連動画も目立たせます。
関連動画はサムネイルが重要であると仮定しました。
一般的に写真はテキスト情報の8倍の情報を持つと言われています。

サムネイルを中心に左右レイアウトに変更しました。コメントへの動線も確保しながら、関連動画も選択できます。また、動画を見ながらどちらも操作可能です。

現状では動画だけが固定表示され、動画+コメントがスクロールという仕様です。

ユーザーとしては面白いか見ながら、次の動画を検討するケースが多いと思います。実際のスクロールイメージとしては下記のようになります。

現状のアプリではコメントを下まで読み込んでから次の行動をするにはページ上部へ戻るしかありません。このデザインであればコメントを読み切った後でそのまま他の動画へ遷移することも可能です。唯一の難点としてはコメントのスクロールエリアが縮小されたことです。iPhone5サイズで半分くらいになります。大型化されてきている端末を考慮すると許容範囲ではないでしょうか。

まとめ

今回はYouTubeのコメント部分に特化してリデザインしてみました。
デザインの過程で「これは重要!」「あれも目立たせたい!」などいろいろな条件に対して、UIの改善で解決できることがあります。
他にもっと良いUIがあればコメントをいただけると嬉しいです。

この記事が気に入ったら、サポートをしてみませんか?気軽にクリエイターを支援できます。

ありがとうございます!
4

yousukeshimizu / TSUMIKI INC.

株式会社つみきで色々とやってます。https://dribbble.com/yousukeshimizu

TSUMIKI Designers

つみきのデザイナーの記事をまとめました。 UIデザイン、インタラクションデザインなどお気軽にご相談ください。 https://tsumikiinc.com/
1つ のマガジンに含まれています
コメントを投稿するには、 ログイン または 会員登録 をする必要があります。