よくUIにはフィードバックが重要だ、と言われます。
これは本当にその通りで、フィードバックを適切に与えることでユーザーに「操作できている安心感」を与えることができ、ストレスなく利用できます。
フィードバックとは?
「フィードバック」という言葉の元々の意味は、「出力結果の一部を入力側に戻すこと」です。
日常的にはよく「上司に資料のフィードバックをもらう」というような使い方をしますが、これは「自分が資料に出力したあと、その内容の評価を上司から自分(入力側)に返す」という意味です。
UIで「フィードバック」と言う場合には、主に「ユーザーの操作に対して、操作されたことをユーザーに伝え返す」つまり「ユーザーの操作結果を画面に反映する」ということを指します。
例えばユーザーが画面をタップした時にタップエフェクトを表示したりだとか、ボタンを押した時に画面が切り替わったりだとか。
フィードバックの重要性
UIでフィードバックが重要な理由としては、ユーザーに「操作してる感」「安心感」を与えられるからです。
具体例を示してみます。
PCでこのページを閲覧している方は、下のボタンをクリックしてみてください。
クリックしてね
今回は押しても何のアクションもしないようになっています。
このボタン、「押した感」が全くないですよね。
「本当に押せているのか」と少し不安になりませんでしたか?
一方で、こちらのボタンも押してみてください。
クリックしてね
残念ながらこちらも押したところで何も起きないのですが、「確実にボタンを押した」と感じましたよね。
先ほど感じた「本当に押せているのか」という不安は感じなかったはずです。
このボタンはクリックした際に押し込む表示がされることで、押されたことをユーザーにフィードバックしています。
さらにPCで閲覧している方は、ホバーされたときにもボタン色が濃くなったり、ポインタの形が変わったりするなどのフィードバックもあります。
このようにフィードバックはユーザーに「操作できている安心感」を与えることができ、ストレスを軽減することができるのです。
フィードバックの与え方
では実際にどのようにフィードバックを与えれば良いのか。
例えばボタンだとこのような感じ。

ユーザーが押下したときに押し込んだ状態のボタン画像に変更し、指を離した時には元のボタン画像に戻す、というシンプルなものです。
基本的にはユーザーの操作に合わせて表示を変える、というのが全てなのですが、いくつかポイントがあります。
- 操作後瞬時に行う
- 指で隠れないように表示する
- サウンドに頼らない
操作後瞬時に行う
少しでも操作とフィードバックの間にラグがあると、ユーザーは操作感の悪さを感じてしまいます。
たまに重いゲームをしていると、タップした0.5秒後とかに実行されることがありますよね。
そのとき、少なからず操作感が悪いと感じているはずです。
もしユーザーの操作によって重い処理を行わなければいけない場合は、必ず先にフィードバックを与えてから、重い処理を始めましょう。
指で隠れないように表示する
タップエフェクトを表示する場合などには、指で隠れないように注意する必要があります。
あまりに小さいタップエフェクトだと、せっかくフィードバックを実装してもユーザーに見られずに無意味となる可能性があります。
開発時は必ず実機で表示し、指で完全に隠れてしまっていないかを確認しましょう。
サウンドに頼らない
フィードバックを与える方法のひとつとして、効果音を鳴らすという方法が考えられます。
ボタンは基本的にボタン音が鳴るようにしますよね。
ただ、ボタンのフィードバックが効果音だけで良いかというと、確実にダメです。
フィードバックはサウンドだけでは足りません。
理由は簡単で、ゲームをする際に音を出さずにプレイすることも多々あるからです。
音量がゼロであってもフィードバックを与えるために、必ず視覚的なフィードバックも作成すべきです。
まとめ
フィードバックの重要性について記事にしました。
- UIのフィードバックとは、ユーザーの操作結果を画面に反映すること
- フィードバックは「操作できている安心感」を与える
- 瞬時に、大きさに注意して、視覚的にフィードバックを与える
コメント