「マテリアルデザイン」がどれだけAndroidの近代化に貢献したかという話

皆様こんにちは。現在のスマートフォンというとAndroidかiOS、どちらかのOSを搭載している機種がほとんどです。そのOSを形作るうえで欠かせないのがGUI(グラフィカルユーザーインターフェース)デザインで、ここはOSすべてにおいての見た目や操作性に直結するものです

近年のデザインの流行りは?

最近のトレンドはフラットデザインと呼ばれるもので、このデザインの変遷を簡単に表すなら、パソコン用OSであるWindowsのマークの変化が分かりやすいのかなと思っています。

言葉の通りかもしれませんが、XPから7のような立体感をそぎ落とし、できる限り平面上に表すようなものがフラットデザインへの変化といえます。Windows8では、アイコンのみならずOS全体をフラットなものに変更(メトロデザインとも呼ばれた)し、これまでのWindowsを覆すようなものになりました。残念ながら、デスクトップの事実の廃止などといった操作性の悪化から多くの人の混乱を招き、Windows8.1や10において修正が行われました。メトロデザインも事実上廃止されています。

「Windows 8」のスタート画面。タッチパネル搭載デバイスに配慮し、スタートボタンとスタートメニューを省き、代わりにタイルが並ぶスタート画面を導入した。この大胆なUI変更が、Windows 8の普及を阻害する要因となった
Windows8

これはiPhoneのアプリアイコンの変化でも同様であり、iOS6からiOS7においての変化もよい例といえるでしょう。こちらもWindowsほどではないものの、比較的大幅なデザイン変更だったため賛否が分かれていました。

そんな近年のフラットデザイン化にAndroidも当然便乗しましたが、単なるフラットデザインではなく、「マテリアルデザイン」という形で2014年にAndroid5.0(Lolipop)から採用しました。

では今回は私が一番好きなUI、マテリアルデザインについてお話していきます。

フラットデザインとの違いは?

そんなマテリアルデザインですが、フラットデザインと何が違うんだという話によくなります。

簡単に言うと、奥行きが存在する、アニメーションが定義づけられているということになります。

いいですねぇ

このgif画像を例にすると、奥行きの部分は「設定」と書いてあるレイヤー、小見出しともいえる「無線とネットワーク」「端末」のレイヤーがそれにあたるといえます。

奥行きの関係性
アニメーション

奥行をできる限り排除したフラットデザインに対して、マテリアルデザインでは奥行(Z軸)が存在しています。どこら辺が奥行なのかという点ですが、例えば今回記事一番上のサムネイル画像、白と緑の色の間にシャドウを設けることによって、フラットながら奥行きを感じさせることができるということです。

この奥行きがどのようにUIに影響するかというと、全てを平面上に配置したフラットデザインと比較して、クリックやタップできる要素やレイヤーの違いを分かりやすくすることができ、理路整然とした動作に結びつけることができるということです。

マテリアルデザインがもたらした影響

いよいよ本題に入ります。古いandroidというと、やたらとごちゃごちゃしているイメージがあり、お洒落さが無いように感じませんでしょうか。少なくとも私はこのように感じており、その一因としては雑多なキャリアアプリをはじめとするアプリアイコン、UIの統一性の無さがあったのではないかと感じています。このころはデザインにおいてもiOSから遅れをとっているようにも感じます。

そんなandroidスマートフォンにはじめて統一的なデザインを取り入れ、サードパーティーにも普及させたといえるのがマテリアルデザインです。

電卓アプリから見る

これまでとの違いを表す上でわかりやすいのが電卓アプリです。

かなり印象が変わりました。どちらが使いやすいかというのは完全に意見が分かれるものだとは思いますが、デザインの向上という点では非常にフラットかつシンプルなものになっています。右側の緑の部分はフリックすると関数などの追加機能を表示させることができ、今までよりも存在感を示せています。
この電卓、使いやすかったのですが最近になって残念ながらデザインが変わってしまいました。

以下にはマテリアルデザインによって統一されたアプリを比較していきます。

地図(Googleマップ)

Googleマップアプリでは、検索バーを上部に配置し、設定などのその他機能を左端にまとめることで、表示領域を拡大しつつ使いたい機能を探しやすくしています。また、検索バーと右下の二つのボタンに影がついていることで、地図よりも上のレイヤーであるということを認識しやすくしています。

設定アプリ

アプリドロワー…アイコン

マテリアルデザインが適用されたアプリのアイコン(右)です。同じデザインコンセプトがあるだけで非常にスッキリとしていますね。

キーボード

基本的には電卓と同じような変更です。非常にスッキリしますね。

まとめ

このコンセプトがもたらした統一感はOSの寿命を延ばしたといってもいい

Windows8、iOS7と、次々にOSのUIがフラットデザイン化していった中なので、Googleももちろん同じような行動を起こしていたのだろうと思います。そのうえで、Google自らが作成したマテリアルデザインが採用されたことがAndroidOSの魅力を更に引きたてたのではないでしょうか。Windowsと同じように完全フラットデザインを全体に施していたら成功しなかったかもしれませんし、当時のまま引きずっていたらいつまでも古臭いままだったかもしれません。

実際私はこのOSのデザイン性の良さにはとても憧れていました。(当時所有していたSHV31がAndroid4.4から5.0にアップデートされなくて絶望した思い出) Android5.0が発表されてから、それ未満のOSがとても古臭くてダサくみえたのも思い出です。

意味のない話が長くなりましたが、マテリアルデザインを統一的に採用することによって操作感が統一され、ユーザーにとって使いやすいもになったのでないでしょうか。

今後も期待大

Android5.0の登場から7年目に当たる2021年には、更に昇華させたデザインである「Material You」を発表、Android12からOS単位で、アプリ単位でもGoogle系のものから搭載され始めています。今後ますますのデザインの進化には目が離せませんし、マテリアルデザインを引き継いでいるというのも嬉しい限りです。

マテリアル繋がりです

コメントする

メールアドレスが公開されることはありません。 が付いている欄は必須項目です