UXデザインインターフェースマイクロインタラクションとは
User Interface - 2019 -
皆さんはあこがれのスマートフォン（自分の場合はiPhoneでした)を購入し、真っ先に覚えたのはどの機能だったでしょうか。自分は購入後かなりの時間が経過した後に、ようやくマナーモードへの切り替え方を覚えたのですが、今回はこの消音への切り替え操作が原因で起こった有名な事件を振り返りながら、細部の操作性を追求していくマイクロインタラクションについて語ってみたいと思います。
それは荘厳な世界をも破壊する
オライリー社から刊行されているダン・サファー氏の「マイクロインタラクション UIUXデザインの神が宿る細部」の冒頭では、クラシックコンサートの演奏中に起こった出来事が描写されています。
それは、ニューヨーク・フィルによるマーラーの交響曲第9番のフィナーレで起こりました。最前列にいた年配男性のiPhoneのマリンバ(アラーム音)が甲高く鳴り響き、コンサートホールを包む荘厳な空気を切り裂きます。（これも珍しいですが、音の出所が最前列からだったためか）指揮者が演奏を中止し注意します。しかし音は鳴りやまずに、観客の怒りが男性会員に向けられるというものでした。
マナーモード時の挙動
演奏家の友達によれば、マーラーの荘厳な音楽は、観客のみならず演奏家自身も言い知れぬ感動に包まれるそうで、絶大な人気を誇っているそうです。その演奏の最後の最後、会場全体が荘厳な世界に包まれている時に、無情にもマリンバが鳴り響いたのです。
どれだけこの男性に非があるのかと思いましたが、実はこの方はしっかりとマナー(消音)モードにしていたのです。デフォルトの設定（初期設定）ですと、アラーム音はマナーモードでも鳴ってしまうのです。この男性会員は大のクラシックファンで、いくつかのメンバーシップを購入し、普段は咳払いの音やタイミングの悪い拍手にうんざりしていたそうで、「まさか自分が（迷惑をかけてしまうとは）」と語っていました。それだけ細心の注意を払う人ですら、仕様の罠に嵌ってしまったのです。
この事件では、iPhoneの機能自体への賛否から、会場での案内が行き届いていないこと、着信音そのものを皮肉ったものなど、様々な議論が起こりました。ダン・サファー氏自身も「マナーモードでアラームが鳴らなかったら、毎朝何千という人が寝過ごしてしまうだろう」と語っています。
マイクロインタラクションとは最小の操作単位
さて、前置きが長くなりましたが、このクラシックコンサートで起こったような出来事を防ぐにはどのような設計が求められてくるのでしょうか。iPhoneを「スイッチ切り替えの操作感が良い」という理由で購入する人はほとんどいないと思いますが、マナーモードへの切り替えは購入した誰もが使う重要な機能になります。マイクロインタラクションを意識した設計では、製品そのもの：マクロに対して、細部の操作をマイクロ(ミクロ)と定義し、応答性や明確さなど、ひとつひとつのインターフェースの質を高めていきます。
特定のインターフェースに馴染めないと、その機能自体にもアクセスしなくなるのは当然です。キャズム(イノベーター)理論などでも明らかにされていますが、技術導入に積極的な人の割合は非常に少なく、深い溝(越えるのがおっくうな壁)を前に躊躇する人がほとんどですから、インターフェースには簡潔さと明示的なレスポンスを付加することで、導入の手がかりを与える必要があります。
アラームのオンオフというマイクロインタラクション
インターフェースデザインのスイッチの機能紹介のページでも書いていますが、(iPhoneの場合は)アラームをオンオフするという単純操作にも若干のクセがあります。
画面を指ではじくというアクションが馴染みのないユーザーも多いはずですし、私が使っても下図のような感じで切り替え時に意図しない動作が起こってしまうこともあります。(削除ボタンが出てきてしまう)
単純に、下図のようなデザインでも良いのではとも感じますが、いかがでしょうか。
このように、製品全体の質や、製品に対するユーザーの満足度・安心感は、マイクロインタラクションの設計に大きく依存しています。コンサートホールでの出来事は、さらにもうワン・ステップのレスポンスやアラートが必要でしたが、デザインやブランディングの問題もありますし、前述のダン・サファー氏のコメントにもあるように、(個人的には)Apple社の設計に非はなかったと思います。
さてここからは、マイクロインタラクションを4つのステップに分けて解説してみたいと思います。ダン・サファー氏の著作では、マイクロインタラクションは次に示す4つのステップに分解されています。
トリガー
iPhoneXsですと端末にある物理的に操作が可能な箇所は4つ存在し、そのうちの一つがマナーモード(Apple社的にはサイレントモードと呼んでいます)への切り替えスイッチに割り当てられています。このボタンがトリガーに該当します。電子レンジやストーブの入・切ボタンなども同様ですし、ホーム画面上に並ぶアイコンもトリガーの一つです。天気アプリなど、運営側がトリガーを引きユーザーの端末に通知を表示させる、システムトリガーも存在します。
ルール
マイクロインタラクションにおいて根幹になるのがルールです。このステップではマイクロインタラクションの仕様について定義します。位置情報を取得してアラーム機能を停止させるのも良いですし、午後の特定の時間帯に設定した場合のみ「マナーモードでもアラームは音を出力します」とスクリーン上で警告する仕様にしても構いません。すべては制作者の意図に委ねられる部分です。デザイナーからすると、M社、A社のアプリケーションなど、変更してもらいたいマイクロインタラクションのルール(仕様)は山ほど思いつきます。数多くの事例がありますので、別途紹介していきたいと思います。
フィードバック
トリガーのみで完結するインタラクションもありますが、たいていのマイクロインタラクションは、ユーザーになんらかのフィードバックを与える必要があります。サウンドやバイブレーション、ローディングアニメーションはフィードバックに該当します。
ダン・サファー氏は「フィードバックは、製品全体の形態と並んで、製品の個性を決定づける要素だと言っても過言ではない」と述べています。簡潔さがウリのアプリに仰々しいエフェクトを用いたり、配色を間違ったりすると、ユーザーエクスペリエンスは損なわれます。
ループとモード
キーボード入力時のシフトキーは、一時的に大文字にするためのモードです。一見して分からない場合もあることから、モードはマイクロインタラクションでは極力避けたい機能として扱われます。ループは文字そのままに、繰り返しの判定のことで、フィードバックに直接的に関与し進行中の情報を明示的に扱う役割を担うタイプのものと、あらかじめのルールとして一定の動作後にシステム側でアプリに対して命令を行うタイプのものがあります。
まとめ
このページではマイクロインタラクションについて比較的簡潔にまとめてみましたが、いかがでしたでしょうか。ユーザーにとってより分かりやすく、それでいて利便性のあるアプリケーションを制作するために、本ページにて提示した各工程を見直してみるのも良いかもしれません。
以下のページにて、マイクロインタラクションの各ステップを個別に解説していますので、興味のある方はご覧になってください。
