マイクロインタラクションは、１つのタスクを達成する際に生じるわずかな瞬間のことを指します。私たちの周りのほとんどのアプリケーションはマイクロインタラクションで満たされています。いくつかの例をご紹介しましょう。
- アイテムがカートに追加されていることを確認する
- コンテンツを更新するために、引き下げてリロードをする
- 動作を確かめるインタフェースのアニメーション（例：トグルボタン）
この小さな瞬間の一つ一つがマイクロインタラクションを形成しており、注目されることはあまりありませんが、私たちはその存在を感じることはできます。これらの小さな瞬間はUIから機械らしさを取り除き、より人間らしくすることで、結果としてより良いUXを生むことになります。
この記事では、マイクロインタラクションのための５つの有用なテクニックを挙げ、役に立つ例をいくつかご紹介します。
１. 習慣ループを作る
マイクロインタラクションは、ユーザーがUIに対して何かしらのアクションをとるように促す力を持っています。これは、習慣ループを形成するのに役立つ強力な手段です。習慣は人々が同じ動作を繰り返し行うときに形成され、次の３つの要素で構成されています。
- キュー：動作を行うきっかけ
- ルーチン：キューに対し、動作を実行すること
- リワード：ルーチンを完了することで得られる利益であり、動作を行う理由
Image credit: wikia
Facebookの受信メッセージにおける通知は、習慣ループの良い例です。赤いバッジと白いアイコン（キュー）が新しいメッセージがあることを示し、ユーザーにアイコンをクリックさせ（ルーチン）、友達とチャットできるようにします（リワード）。やがて、ユーザーは赤いバッジを見るなり、無意識にアイコンをクリックするようになります。
マイクロインタラクションは、依存性のあるアプリにおける隠し味のようなものなのです。
アドバイス
リワードはユーザーのモチベーションを刺激します。リワードが強力であるほど、習慣もより強くなります。
２. テーマとつなぎ合わせる
マイクロインタラクションは、デザインの一部として自然であるべきです。全てのインタラクション（マイクロ及びマクロ）が相互に結びついた、統一されたテーマを作成する必要があります。次に挙げる２つの簡単な原理に従いましょう。
継続性
オブジェクトの様々な状態の間における画面遷移を、不連続ではなくスムーズに見えるようにアニメーション化しましょう。
Image credit: Cam Runcie
予測可能性
適切なマイクロインタラクションによって、ユーザーに行動を予測させ、情報への理解の手助けをすることが可能です。
Image credit: Leo Zakour
Image credit: Matt D. Smith
３. フィードバックにアニメーションを使う
アニメーションは、正しく使用されればUXに大きく貢献することができます。機能的かつ心地よいアニメーションは、フィードバックを送るときに有用です。
機能的なアニメーションは認知的な負荷を軽減し、変化の見落としを防ぎ、空間的な関係性においてより良い回想を呼び起こします。
Image credit: Tamino Martinius
心地よいアニメーションはマイクロインタラクションをより面白くします。動きは目を引き、UIを生き生きとさせます。
Image credit: Chris Bannister
アドバイス
ユーザーに飽きが来てしまわないように心がけましょう。そのアニメーションは、100回使用したとき、うっとうしくなるでしょうか？ それとも、普遍的に明確で、邪魔にならないものでしょうか？
４. ユーモアを用いる
インタラクションにおけるユーモアは、どのような規模であれ、UXに感情的なリアクションをもたらす確実な方法です。
例えば、メールの作成・送信を行うWebサービスであるMailChimpは、ユーザーが初めてメルマガを作成し、予約投稿を完了するまでの間、思いもよらないユーモアとポジティブさでユーザーを楽しませます。
ユーザーの体験を通して小さくて楽しい驚きを追加することで、MailChimpはメールの送信をより面白くしているのです。
MailChimpのメルマガ配信における確認画面では、軽いユーモアを使用して緊張した状況を緩和しています。
デザインは、どんな形においても感情を伝える必要があるのです。
アドバイス
人間味をもたせましょう。UIから機械らしさを減らしてより温かみをもたらす簡単な方法は、コピーに人間味をもたせることです。
５. 不要なインタラクションを避ける
視覚的なキューやアニメーションが適切であるよう気を配りましょう。UIにマイクロインタラクションを使いすぎたり、複雑すぎるインタラクションを作ることはよくある間違いです。
後者は以下の例にも見られます。美しいですが、実用的なインタラクションではありません。
ユーザーがチャットをスクロールするたびに画面上を飛ぶボールは、しばらくすると少しうっとうしくなるかもしれません。Image credit: Jakub Antalík
マイクロインタラクションにおいては、より簡潔であることが重要だということを覚えておきましょう。取り除けばUIはよりクリーンになりそうなものは取り除くべきです。そのため、マイクロインタラクションをデザインするときは、ユーザーにとって実用的なもののみに焦点を当てる必要があります。
アドバイス
デザインにKISSの原則を用いましょう。 マイクロインタラクションは小さくシンプルであるべきです。マイクロインタラクションをマクロインタラクションに変えないようにしましょう。
まとめ
UXにおいては、ユーザーにどのように対応するか、そしてプロダクトを使うときにユーザーがどのように感じるかが問題となります。小さな部分でさえも細心の注意を払うに値します。それぞれすべての細部へ配慮することは、人間とコンピューターのインタラクションを簡単にする、成功への鍵なのです。
