マイクロインタラクションとは?5つの活用事例とメリット

Sara Nagy

Saraはコロラド在住のUXデザイナーリサーチャーです。彼女はSpringboardの意欲的なUXデザイナーのエキスパート・メンターでもあります。バイオリン演奏、国際開発の背景を持ち、旅行と社会を変えるデザインを作ることを好みます。

この記事はProto.ioからの翻訳転載です。配信元または著者の許可を得て配信しています。

The Secret To Killer UX Design: It’s All in the Microinteractions

マイクロインタラクションは、ユーザーに楽しい体験や役に立つフィードバックを与えることで、ある瞬間のあるタスクを達成することを補助するものです。

このようなマイクロモーメントは、一連のフローの中でユーザーを直感的かつ効果的に導くために用いられます。

マイクロインタラクションとは?

Microinteractionsの著者であり、Mayfield Robotics のプロダクト統括責任者であるDan Saffer氏は、マイクロインタラクションをこのように定義しています。

(マイクロインタラクションは)プロダクトのユースケースを中心としたさまざまなモーメントに関連します。設定の変更、データやデバイスの同期、アラームの設定、パスワードの選択、ログイン、ステータス・メッセージの設定、『いいね』や『お気に入り』などをする時など、さまざまな場面でマイクロインタラクションは関わってきます。

携帯しているデバイスや家の電化製品、スマートフォンやパソコン内のアプリ、さらには私たちの生活や仕事場など、どこにでもマイクロインタラクションは存在しています。ほとんどの電化製品やアプリは、マイクロインタラクションを中心として作り上げられています。

また、Saffer氏によるとマイクロインタラクションは以下のような事例に効果があるとしています。

  • 一つのタスクの実行。(一つのタスクに限る)
  • 気温や音楽のレーティングなどのインタラクション。
  • Spotifyで流している楽曲の音量調整などの進行中プロセスのコントロール。
  • 設定の調整。
  • Facebookのステータスのような、ちょっとしたコンテンツの閲覧や作成。
  • 機能のオン・オフの切り替え。

WHAT IS A MICROINTERACTION?

マイクロインタラクションのメリットは?

マイクロインタラクションのメリットとして、以下のような点が挙げられます。

  • ボタンのクリック、コンテンツをシェア、お知らせやメッセージへの返信などのユーザーとサイト間のインタラクションを手助けする。
  • ユーザーにすぐさまフィードバックを与える。
  • サイト内でユーザーが回遊する手助けをする。
  • ユーザーを直感的でわかりやすい方法で導く。

より詳しくは以下の記事を参照してください。

5つのマイクロインタラクションの成功例

Slack絵文字

ウェブサイトLittle Big Detailsは、マイクロインタラクションのとても良い例をいくつかキュレーションしています。

その一つとしてSlackの絵文字があります。Slackでは、絵文字を検索した時に目当てのものが見つからないと、「泣き顔」の絵文字が選択肢として表示されます。これは、目当てのものが見つからなくて、がっかりさせる代わりにこの「泣き顔」の絵文字を表示することででユーザーを面白がらせるマイクロインタラクションです。

slack_cry_emoji

Google翻訳

グーグル翻訳で「聴く」のボタンを2回押すと、グーグル翻訳はあなたが理解することに少し時間がかかるだろうと予測し、翻訳したものを1回目よりゆっくりと読みあげてくれます。

Google Mapのナイトモード

Google Mapは、時間に合わせ背景が少しずつ黒になっていきます。このナイトモードは、視界と安全性を向上させるためにあり全て自動で調整されます。

セーターの袖のサプライズ

以前、柔らかく暖かい長袖のセーターの話を誰かがしているの聞きました。ある日、その人は寒くなってきたので袖にある余分な布地を引っ張ったといいます。これは寒い日に手を覆うためにあり、ぱっとひっくり返して手に被せるものだそうです。

すると隠れていた布地に「あなたは愛されている」と書かれた文章が見つかったのです。この文章は布地の正確な位置にひっそりとプリントされ、着ている人に一瞬の喜びと共に驚きを与えるために、このような瞬間まで隠されていました。

スクロール・バー

このページの右側についている小さなスクロール・バーでさえマイクロインタラクションがいかに便利で効果的であるかを示す、素晴らしいシンプルな例の一つです。

この記事を読んでいるあなたに、あと記事がどれだけ続くかを教えてくれます。


イベント

2017/12/05(火)
Design Thinking Square