FacebookメッセンジャーやInstagram、Airbnbなど、シリコンバレーを牽引する企業は、白色をベースにUIをできるだけシンプルにデザインしたアプリをリリースしています。
これらの「白っぽい」デザインは、色彩をできるだけ取り除いたデザインから、「コンプレクション・リダクション」(CR)と呼ばれています。

こうした白っぽいデザインのアプリケーションは、SNSアプリを中心として使われています。
しかし、、NetflixやAmazon Prime Video、Spotifyなどのメディア系のアプリケーションは、白とは真逆の「黒っぽい」デザインを採用しています。

なぜ、NetflixやSpotifyは黒っぽいデザインを採用するのはなぜでしょうか。
今回は、ダークカラーを採用するメリットと事例をご紹介します。

白背景 vs. 黒背景

冒頭でもお伝えしたように、さまざまなアプリケーションが「白っぽい」デザイン(コンプレクション・リダクション)を採用しています。

white.png

参考：
デザインはもっとシンプルに！無駄な要素を削ぎ落としたUIデザイン「コンプレクション・リダクション」とは？

このデザイントレンドは非常にシンプルなので、UIのデザインがコンテンツの邪魔をすることなく、ユーザーの投稿自体がはっきり・くっきりと見えます。

black.png

一方で、SpotifyやNetflixなどはダークカラーを取り入れています。
なぜ、動画や音楽を配信するプラットフォームのアプリケーションでは、ダークカラーの背景を取り入れているのでしょうか。

コンテンツ重視なら「黒背景」がよし

実は2009年の時点でProbloggerによって、白背景と黒背景、どちらをユーザーは好むのか、調査が行われています。

調査によれば、およそ半分のユーザーはブログで記事を読むなら「白背景」のほうがいいと答えています。
実際、ブログの多くは文字が多いので、白いほうが可読性も高いのが理由のひとつです。

しかし、面白いことに回答者の1割は黒背景のサイトを好んでおり、3分の1以上がブログの内容によって異なると回答しました。
確かに、ブログのように、ページ全体にテキストが占める割合が多ければ白背景のほうが読みやすいでしょうが、逆にテキストの量がそれほど多くない場合には白である必要はないとも言えます。

実際に、Richard Hall博士とPatrick Hanna博士が行なった研究によれば、画像や動画の認識率は、背景色によって決まるとも言われています。

hover.png

黒背景にすれば、画像は浮き出るように見えるので、アートワーク(ジャケット画像)を多用するようなアプリケーションに向いています。
一方、白背景だと、黒いテキストは浮き出るように見えますが、写真は背景よりも奥手にあるように見えるので、テキストの量が比較的多い場合に有効だと言えます。
SNSは、性質上テキストメッセージも多いので白背景を採用する一方、動画や音楽アプリなどはアートワークが画面に占める割合が多いので、黒背景を採用しているのです。