人との関わりから考えるタッチUIのあり方

今までは平面的かつシンプルな関わりを基にしたデザインがほとんどでした。より様々なインプットとアウトプットが存在する今後のタッチの世界では、人とデバイスの関係までデザインされているかどうかが、UI の評価に大きく関わるはずです。

タッチ UI のデザインで難しいのは、表層的な部分だけを設計すれば良いものになるわけではないという点です。技術もきちんと理解することで、Web なら Web らしい、アプリならアプリらしいデザインになります。表層的な部分から入ると、見た目は良いけど使い難くなったり、「なんとなく違う」という声に繋がることもあります。

だからといって、絵を描きながら UI を模索することを否定しているわけではありません。しかしながら絵を描く過程があったとしても、人がデバイスとどのように関わるのかを理解していることが前提になります。人はどのように UI に触れて、どのようなフィードバック(アウトプット)を期待しているのでしょうか。

タッチデバイスにある新しい挑戦

多くの方がタッチデバイスを扱うようになって数年経ちますが、今はもう画面に触れるだけが唯一の方法ではありません。人とデバイスの関係はより親密になったと同時に、関わり方は多様で複雑になりました。

おさらいという意味も含めて、最近のデバイスと人との関わり(インプット & アウトプット)をまとめてみました。

多種多様なインプットとアウトプットが行き交うプロダクトデモ

タッチインタラクション

  • タッチ
  • ジェスチャー
  • 物理操作(ハードウェアを動かすなど)

タッチ以外のインタラクション

  • 場所
  • 音声
  • 見た目(顔や身体の大きさなど)
  • 身体の状態(心拍数、体温、仕草)
  • 瞳孔や視線

フィードバック

  • テキスト
  • 画像
  • アニメーション
  • 動画
  • 音声
  • 効果音
  • 触感(震えも含む)

関係を助長するデザイン

今のタッチデバイスは、単にハードウェアに触れるだけでなく、様々な操作方法があります。また、利用者が指を使ったインプットを行わなくても自動的に情報を取得し、フィードバックを提供することができます。これには以下の課題があることを意味しています。

  • どの部分をどのように動かせば良いか
  • 今見ている画面と次の画面の関係性はどのようなものか
  • 何がトリガーになってフィードバックが表示されているか
  • インプットされたタイミングで適したフィードバックは何か
  • タッチ以外のセンサーはどのように作用しているのか
3次元で考えるUI現在、各地で開催中の講座「コンテンツを活かすためのUI設計」でも、UI デザインを平面的ではなく、三次元に広げて考えなければならないと解説しています。

Android と、最近発表された iOS7 に共通しているのは、コンテンツの邪魔にならないインターフェイスをつくることを推進している点。タッチによって、タッチ以前のように様々な GUI 要素をあらかじめ表示する必要はなくなりましたし、必要に応じて操作 UI を出すという表現も見られるようになりました。つまり、どのタイミングが利用者にとっての「必要なタイミング」なのかを想像しなければいけませんし、何かをインプットすることで、操作 UI が表示されることを知らせるための「トリガー/キッカケ」のようなものも必要です。

タッチ UI によって 静止状態(スクリーンショット)だけでは UI の評価がし難くなりました。触ったときの感触はどうか、センサーによって起こることはなにか、何かが起こることを予感させ、その予感に応えるような動きや見せ方・・・こうした人とデバイスの関係までデザインされているかどうかが、UI の評価に大きく関わるはずです。むしろ、見た目(GUI)より、関わりのデザインの方が評価の重要度が高くなる可能性もあります。

まだタッチ UI のデザインは始まったばかりだと思います。アニメーションはいろいろあったものの、今までは平面的かつシンプルな関わりを基にしたデザインがほとんどでした。これから大きく変わるはずです。私たちは、本当の意味でのタッチ UI デザインという開拓地に向かうのだと思います。難しい課題が山積みですが、とてもエキサイティングなことです。

筆者について

Experience Points

電子書籍「エクスペリエンス ポイント」発売中

の初の電子書籍。過去 4 年間にわたり Web と体験について扱ったコラム・エッセーを 34 集めました。概念だけでなく、啓蒙するためのヒントなど、明日から考えを行動にうつすためのヒントが掲載されています。
500円で .epub 又は Kindle 形式で購入できます。

閉じる 共有する

記事はお楽しみいただけましたか?役に立つ情報でしたか?ぜひ他の場所で共有してみてください。