とても久しぶりになってしまったUI分析…
今回は最近UIがアップデートされたYoutubeを分析してみました。

色々みていると、Youtubeは結構細かくなるほどポイントがあり…
細分化して、アイコン周りを中心に分析していきたいと思います。

動画の内・外でアイコンが違う

Youtubeのアイコンは、2つのパターンの動画内・動画外で種類の違ったアイコンが使われています。

・動画内のアイコンは塗り系
・動画外のアイコンはライン系

動画内のアイコンは、以下の理由で塗りが広いアイコンにしているのかなと思います。

①動画を再生していても目立つようにしている
②動画がメインコンテンツであることが、アイコンの区別でも表現している

一方で、動画外のアイコンは、ライン系で統一されていて、情報として強調していない感じがします。

サービスでアイコンは「塗り」「ライン」など統一するもの、と決めつけず何を重要視したいのかはっきりさせる必要があると改めて考えさせられます。

動画視聴時に邪魔にならないアイコンテキスト

PC版のUIでは、アイコンのホバー時にテキストが表示されるようになっています。

アイコンだけだと分かりにくいから、テキストを付けているという訳ではなく、「動画を見せる」ことがメインなので、余分なテキストはなるべく最低限にしている印象を受けます。

スマホの場合だと、アイコンをクリックした後の表示がPCよりもテキストが詳細に書かれています。コンテンツを邪魔しないという部分が徹底されています。

アイコンだけでも、「何を見てもらいたいのか」「何が重要なのか」という部分がはっきりとわかるので、どれだけ情報整理が重要なのかわかりますね...。

アイコンじゃないけど、動画への没入感がすごい

ダークモードで動画を再生した時の背景

Youtubeの設定でダークモードにすると、動画を再生した時に動画の周りが動画を透かしたような雰囲気に変わります。少し動画へ入り込んだような雰囲気になっちゃいます。

ミックスリストの再生中動画のカラー

ミックスリストで動画を再生すると、ミックスリスト内で再生中の動画部分のカラーが動画ごとのカラーに変わります。

MVなどを見ていると、雰囲気にあったカラーになっているので、視界の邪魔にならないなと感じました。

未解決,,,「なんでなんだろう...」と思うところ

「なんでなんだろう...」と思うところが1つあり...

PCとモバイルでアイコンが違う部分があるんですよね...
急上昇のアイコンが、PCだと直線的なアイコンなんですが、モバイルだと、曲線的なアイコンに変わっているんです。
アップデートのとかの問題なんですかね...？

もっと色々探っていきたいと思います