LIFULL Creators Blog

LIFULL Creators Blogとは、株式会社LIFULLの社員が記事を共有するブログです。自分の役立つ経験や知識を広めることで世界をもっとFULLにしていきます。

Google I/O 2014 PC画面のデザイン/腕につけたディスプレイ上のデザイン

Apple原理主義者の大坪です。

さて、Google I/O 2014シリーズの第3弾は、デザインに関して私が理解でき(たような気がして)かつ印象的だった点について。

今回Googleは新しいデザイン言語としてMaterial Designを発表しました。キーノートで

「われわれは、ピクセルが色だけでなく奥行きも持っていたらどうなるか想像してみた。また状況に応じてテクスチャーを変えられるような素材があったらどうだろうと考えてみた。これがMaterial Designを開発するきっかけになった」とAndroid OSのユーザー体験の責任者、Matias Durateは語った。

via: Google I/O:デザインでもAppleに対抗へ―ユニバーサル・デザイン言語、Material Design発表 – Techcrunch

この発表があったとき、そしてその背景にながれたアニメーションを見たNerdの90%は

「をを、Googleはとうとう画面のピクセルが物理的に変化するディスプレイを開発したのか!」

と熱狂したに違いない。しかし実際に発表されたのは、Material Designでした。がっかり(<これだから頭のおかしいエンジニアは。。)


━━━

私が興味深いと思ったのはGoogleのMaterial DesignとiOS7で"Depth":「深さ」という共通の言葉が強調されていていたこと。そしてその実現方法が異なっていたこと。2次元でしかない画面上でどうやったらユーザに奥行きがあることをわかってもらえるか?

Google Designのサイトにいってマウスを動かせばすぐ気が付きますが、マウスの下にあるタイル(少なくともその形状をしたもの)が少し浮き上がったように見える。これは周囲との間の陰影関係を制御しているように見えます。

対してiOSではぼかしを含んだ半透明の画面、またはデバイスの動きに応じて背景が少しずれるパララックス効果を使うことで、画面間に奥行きの差があることを示しました。

実現方法の差異はさておき、デモされる画面を見ていると、色の連続的な変化、モーフィングなど「動き」がますます重要になっていることが見て取れます。このGoogle I/Oでも"Material Design:Motion"なるセッションがあり、「動き」がUIの中でどれだけ重要であるかが語られていました。特にこのセッションでは「振付(コリオグラフ)」なる言葉が使われているのには驚きました。そのうち画面設計でもコリオグラファー:振付師という言葉が使われるかもしれません。

画面が非連続的に変化するのではなく、連続的に変化することで、何が起こっているかをユーザに理解させる。こうした点においてiOS7とMaterial Designは共通している。


(ここに「であるからして、Origamiのようなデザインツールの重要性がますます..」といういつもの言説が数十行あると思ってください)

しかしながら違いもあります。私の意見ではAppleよりもGoogleの方が「異なるデバイス間での共通デザイン」という要素を強調しているように思える。Mac OS XもYosemiteでiOSのデザインに近づいたわけですが、それは明示的に強調されていません。WWDCのキーノートを見返したのですが、Yosemiteの新デザインのプレゼンにおいてiOSとの共通性は全く言及されていない。

対するにMaterial Designではたとえば新しく導入された画面上のボタン(Floating Action:下の図の緑の丸です)がすべてのデバイスで画面上に存在している。

Material Design unifies all Google products under one aesthetic.

via: Google I/O 2014 Roundup - HardwareZone.com.ph

Windowsはこうした「共通化」について一番極端だったといえるかもしれません。あのタイル画面をPCでもモバイル機器でも「どん」と正面に据えたわけです。このようにApple/Google/Microsoftがそれぞれ異なる画面上で何を共通にし、何を個別にしたかの判断はなかなか興味深いものがあります。

━━━

次に今回発表されたAndroid Wearのデザインについて。

このセッションについては、実際に行われたセッションの動画が公開されていませんが面白い要素がいくつかありました。

Smart Watchの画面デザインはどうあるべきか?それを考える上で

「まずやってみる」

ことはとても重要。かくしてGoogleのデザインチームは針金(のようなもの)を使ってAndroid スマートフォンを手首に固定したらしい。この「プロトタイプ」は傑作でした。(ああ、写真をとっておけば)

これをやると何がわかるか?手首に固定された画面というのは、非常に激しく動く。これは手のひらの中にあるスマホの画面や、机に座って眺めるPCの画面と大きく異るところです。

従って静止した画面上ではどんなに美しく見えるデザインでも、揺れ動く手首の上では役に立たない。動く画面上では読み取れる情報量は少なくならざるを得ない。

調べてみると他社では、スマートフォンのUIをそのまま縮小してスマートウォッチに載せたような画面デザインもあるようです。

「スマートフォンのUIと共通性が高いので、すぐに移行できる」

という説明もロジックとしては成り立つでしょう。

しかしながらGoogleは実際に「使用」してみて異なるアプローチを採用したわけです。前掲のビデオで強調されているように腕につけたディスプレイ上では

「ユーザが行うタスクはなんなのか。それを実現するために必要な最低限の情報はなにか」

と考え、情報とインタラクションを絞らなくてはならない。そう考えると、Smart Watchの画面デザインというのは、スマホやPCサイトとは異なるチャレンジであることに改めて気がつくわけです。いや、楽しい。

しかし

仮にその問題を解いても

「Smart Watchを購入し、日常的に利用したいか?」

というさらなる難問が控えているわけです。前回書いた内容に沿って考えれば、Smart Phoneでは解けず、Smart Watchが解こうとしている問題は本当に存在しているのか?そしてAndroid Wearはその問題を効果的に解いているのか?これは実際に使ってみないとわからない。

ではさっそく当日プレゼントされたAndroid Wearを着用して自分で確かめてみよう、、としたわけですが、Androidスマホを持っていないと設定画面の最初で躓くことを知ったのでした。

ここらへんがApple原理主義者の限界、ということでGoogle I/O 2014の参加報告はめでたく(どこがだ)お開きです。