超初心者のためのマイクロインタラクション説明書

この記事では、強力なマイクロインタラクションが何であるか、インタラクティブなプロトタイプでそれらを使用してユーザーの顔に笑顔を浮かべる体験を作り出す方法について説明します。

 

 

マイクロ・インタラクションとは？

マイクロインタラクションとは、1つの主要なタスク（目的は1つ）を持つイベントで、デバイス全体やアプリ内で見られます。その目的はユーザーを楽しませることです。魅力的で歓迎的で、デザインにほんのちょっぴりの人間らしさを加える方法です。

 

具体的には、Googleマップで州境を越えると、あなたを新しい州に迎える小さなメッセージが届きます。 Instagramでは、スクリーンショットを撮ると、アプリケーション内で共有機能を使用するよう促す通知が表示されます。

 

これらはマイクロインタラクションの例です。あなたが瞬きすれば、それらを見逃すかもしれない。マイクロ・インタラクションが特別なであるのは、その繊細さによってUXを高める強力な武器になりうるからなのです。

 

 

いつマイクロ・インタラクションを使用するのか

マイクロインタラクションを使用する機会は数多くあります。肝はディテールにあり、私たちがほとんど目にすることのないような方法で経験をナビゲートするのに役立つのがマイクロインタラクションです。クリエイティブなことをするチャンスです。曲を変更する、またはスキップするなどの単純なことは、マイクロインタラクションを追加する興味深いチャンスです。

 

Carrie Cousins氏によると、マイクロ・インタラクションは、

• ステータスやフィードバックを伝える
• アクションの結果を見る
• ユーザーが何かを操作するのを助ける

 

あなたが目を覚ました瞬間から眠る瞬間まで、Webサイトやモバイルアプリで100以上のマイクロインタラクションに触れている可能性が高いでしょう。

 

マイクロ・インタラクションは、UXデザインを向上させることができます。

 

マイクロインタラクションを見つけることができるいくつかの例があります：

• 設定を変更する
• あなたの携帯電話のロックを解除する
• チェックアウトに何かを追加する
• 何かをオンまたはオフにする
• 好きなことや何かを共有している
• 単一のタスクを実行する
• デバイスを一緒に接続する

 

 

マイクロ・インタラクションを作るには？

プロダクトデザイナーであり作家のDan Safferは、マイクロインタラクションに関する本を書いています。その中には、マイクロインタラクションの構造が詳述されています。彼は効果が出るようにその材料の概要を説明します。

 

マイクロインタラクションの4つの主要コンポーネントは次のとおりです。

• 引き金
• ルール
• フィードバック
• ループとモード

 

トリガーとは、微妙なやりとりから始まるものです。クリック、スワイプ、タップ、プルの間で変化します。

 

ルールはマイクロインタラクションに適用されるため、それに応じて応答します。ルールによって何が起こるかが決まります。

 

フィードバックは、何かが起こっていることをユーザーに知らせる。これは、アニメーション、ポップアップ、または他の相互作用の範囲の形で来る可能性があります。

 

ループとモードは、微小相互作用の長さと、繰り返すか、時間の経過とともに変化するかを決定します。

 

 

マイクロインタラクションの設計：ベストプラクティス

マイクロ・インタラクションが何であり、どのようなもので構成されているのかが分かりましたので、マイクロ・インタラクションを成功させる設計について、いくつかのベストプラクティスを見てみましょう。

 

1.単純にする

多くのマイクロインタラクションとやりとりをしているのであれば、それらのやりとりはできるだけシンプルに保つことが最善です。作用が複雑すぎると、ユーザーの疲労を招く可能性があります。

トリッキーさを避け、マイクロインタラクション１つ１つに価値と意味を加えることに集中しましょう。

 

2.一貫性を維持する

マイクロ・インタラクションは、ユーザーを喜ばせながら、できるだけ気付かれないようにするべきです。簡単な作業ではありませんが、設計全体の一貫性が達成されると簡単になります。

特定のカラーパレットを使用している場合や、特定のガイドラインを使用してアプリを作成している場合は、独自のマイクロインタラクションを作成する際にこれらの境界内に留まりましょう。

無駄な驚きはユーザーエクスペリエンスを損なう可能性があるので、テーマがあればそれを実行してください。マイクロ・インタラクションと強力なマイクロ・コピーを組み合わせて、その一貫性を保ちましょう。

 

3.理由を考える

なぜあなたはこのマイクロインタラクションを選択していますか？それはなぜ必要なのですか？マイクロインタラクションは、経験するのが楽しく、さらに楽しく設計できますが、マイクロインタラクションの目的を決して忘れることはありません。見た目がかわいく見えるので、デザイナーはそのデザイン中に自身の意図したオーディエンスを見失ってしまうこともよくあります。

 

4.プロトタイプ

あなたが良いアイデアを持っていると思うのは大切ですが、あなたに良いアイデアがあることを「知る」ことはもっと大切です。プロトタイピングを行いましょう。あなたが持っているアイデアをテストし、再テストし、テストします。

 

 

 

結論

マイクロインタラクションは、ユーザーエクスペリエンスの設計の重要な部分です。

マイクロ・インタラクションのポイントは、ユーザーエクスペリエンスを向上させ、ユーザーエクスペリエンスを損なうものではないため、細部への注意が推奨されます。

 

 

▼こちらの記事もおすすめです！

 

 

 

 

 

※本記事はMicro-interactions: a complete beginner’s guideを翻訳・再構成したものです。