UI/UXは進歩の激しい領域のために、時に前例なしの設計が求められることがあります。たとえば近年の例では、スマートフォンやタブレットが急速に普及し、まだノウハウのない中でこれらのデバイスに特化したUI/UXが求められました。これからも誰も触れたことないデバイスや状況でも、的確な設計を行うことが求められます。
そういった未踏の領域では、先端の研究領域に注意を向ける一方、UI/UXの原点を学ぶ必要があります。本コラムではインタラクションの研究者という立場から、これまでのUI/UXにおいて何が本質であるかを知るのと同時に、これから向かう未来を見据えながら、今何を学ぶべきかを分析、考察していきます。そしてUI/UXに携わる人に少しでもUI/UX設計の「なぜ」に答える材料になればと思います。
効率だけでは語れない道具の設計
スマートフォンやタブレットなど、高性能な端末を持ち歩く時代となりました。ネットへの接続も当たり前になり、私たちは日々膨大な情報を小さな端末を通じて扱っています。人々がそういった膨大な情報を快適に利用するために、優れたUIは今日ますます重要性を増しています。
UIの歴史は、ミスをなくしたり、わかりやすくしたりという効率を目標に設計することが理念の中心でしたが、近年ではさらに気持ち良く使えることが重要になってきています。なぜなら、スマートフォンは従来の道具の域を越えている存在だからです。情報端末であるのに服のように身近なこの端末は、より人間の感覚に沿うような設計が求められます。言い換えれば、「自分の身体の一部であるかのように使える」ことが重要になってきます。これが道具の透明性をもたらし、気持ち良さにつながるからです。
今回のコラムでは、何が気持ち良さにつながるのかを考えていきます。
どうすると気持ち良く感じるのか
「道具の存在が透明になり、身体の一部であるかのように気持ち良く使える」と言われても、なかなか実装へ落とすことは難しいと思います。そもそも、道具が透明になるとはどういうことなのでしょうか。
実は、道具の透明性の重要性はヒューマンインタフェース研究ではずっと言われていることです。私たちは道具を使いたいから使っているわけではなく、ある問題を解決するために道具を利用しています。できる限り道具の先の問題に集中し、できるだけ道具を意識させないようにすることが重要です。たとえば、ドライバでねじを回すときに、私たちはドライバそれ自体を意識しないと思います。この状態を透明と言い、身体の一部になっているように感じます。しかしドライバの大きさが少し合わなかったり不具合があったりすると、すぐにドライバが意識の対象としてのぼってきます。
こういった発想はコンピュータでも同じことが言えます。たとえば、私たちはデスクトップではマウスとカーソルを利用してあらゆる操作を行います。カーソルが意識にのぼってくることはほとんどありません。意識するのはクリックする対象のほうです。しかしPCの処理の負荷が高いときにカーソルの動きが一時的に止まると、急にカーソルを意識するようになります。
タッチパネルの場合も画面のスクロールが指に連動して動かないときやひっかかるときに、画面そのものやデバイスの意識がのぼってきます。このような感覚は「もっさり感」や「重さ」といったまるで触覚のような体験のように感じますが、触覚ではない体験です。
この感覚は、視覚と指の連動のずれによって発生しています。人の「操作」は見ることと動かすことが表裏一体なのですが、コンピュータの場合は見ることと動かすことの間に、遅延が起きたり問題が発生することがあります。これは現実世界ではあまり起きない現象で、これが気持ち悪さの原因となります。
ですから気持ち良さを実現するためには、少なくとも人の操作とその対象の動きの連動を確実にすることが必要になります。単純なことのように思いますが、これまで多くのUIはユーザのアクションに対して「反応」することの重要性はわかっていても、現在のスマートフォンの程度にまでなめらかに指の動きと連動しなくてはならない理由は、ほとんどの設計者は理解していなかったと言えます。
タブレット型コンピュータは10年ほど前にも市場に出回りました。しかし、スタイラスで操作したり、カーソル前提のUIをタッチ操作するというものでした。タッチパネルなのにカーソルが画面に表示されていたのです。これは重要な違いです。今日ほとんどのタッチパネルを持つUIではカーソルは表示されません。指がカーソルになったと思われる方もいるかもしれませんが、今日のタッチパネルにおけるUIでは、画面全体がカーソルになったと言える状態です。そう考えると、カーソルがなめらかに動かないときのストレスを感じるように、画面全体はカーソルと同じ程度なめらかに動くことは設計上必須の考え方になります。
カーソルがマウスの動きになめらかに連動して、自分の身体の一部かのように感じるのと同様に、スクリーンの動きはユーザの動きに連動させれば、そのUIはユーザの手になじむ、ユーザの身体に近づくシステムとなるのです。これが、「操作に基づく動き」です。
もう一つの動きのデザイン
ここで注意しなければならないことがあります。最近のUIは多様に動くのが特徴的ですが、動きには2種類あり、きちんと区別する必要があります。一つはこれまで解説した「操作に基づく動き」で、もう一つが「アニメーション」です。UI設計にはどちらも重要な要素ですが、一見しただけではすべてをアニメーションとして考えてしまいがちです。
誤解が多いのは、サクサク感といった気持ち良さは、アニメーションの効果だと思ってしまうことです。しかし前述しましたように、気持ち良さをもたらすのは「操作に基づく動き」です。これを誤解してしまうと、せっかくのアニメーションが気持ち良さとは逆の効果を与えてしまいます。なぜなら、アニメーションはユーザの操作とは連動していないからです。
ここで、アニメーションについて少し整理します。
アニメーション
アニメーションとは、あらかじめ開発者側が設計したとおりに動くものです。基本的にユーザの操作や通知を機に、一定時間動きます。GUI環境では主に注意を引くための通知表現として使われることが多かったのですが、最近では画面遷移や切り替えにアニメーションを導入することが増えてきています。このアニメーションはナビゲーションを意味することが多く、前に見ていた画面やファイルがどこに行ったか(隠されたのか、消えたのか)を表現するときに有効です。たとえばMacに搭載されている最新のSafariでは、ファイルをダウンロードするとアイコンが弧を描くようにダウンロードフォルダに移動し「どこにファイルが保存されたか」を伝えます。
悪い例として考えられるのは、なぜそういう動きするのか意図がわかりにくい動きです。たとえばアプリケーションをタップして起動したときにアニメーション(くるっとまわる)を適用する例を見かけたことがあるのですが、これらはナビゲーションの意味を持っておらず、筆者としてはなぜそれを導入しているか理解に苦しみます。
デバイスを身体に近づけるために
今日のUI設計はわかりやすさという意味での「アニメーション」、気持ち良さという意味での「操作に基づく動き」両方が重要です。両者は共に「動き」であるため、似たように感じてしまいますが、もたらす感覚はまったく違うことに注意してください。
スマートフォンやタブレットなどのUIの歴史はまだ短く、どのような連動がどういった感覚をもたらすかは試行錯誤が必要です。こういった試行錯誤のためには、これまでの物理的な道具を振り返ることも有効でしょう。たとえば、筆者はホースで水を撒くのがたのしいと感じるのですが、これは水の軌跡が手の動きに連動することがたのしい、気持ち良いからとも考えることができます。このような体験をヒントに新しいUIのテクニックにならないかと模索もできるでしょう。
冒頭で述べたとおりスマートフォンは肌身離さず持ち歩くものになりつつあります。ですからそのUIは、できるだけ人間の身体を理解した身体の延長となる考え方がこれからますます求められることになるでしょう。