はじめに
こんにちは！新卒2年目のnagaisです！
この記事はistyleアドベントカレンダーの21日目の記事です。
早いもので新卒としてアプリ開発チームに配属され、Androidアプリ開発に携わり始めてから1年が経過しました。
この1年を振り返って見てディスプレイという平面な媒体を通して厚みを感じるデザインであったり、押せたことを認識する大切さを少なからず学んだ気がします。
本記事では、アプリ開発を通して「押せる」「押せた」という感覚に絞り、個人的に感じたユーザ体験の違いをご紹介したいと思います。
前提
- デザインについて学んだ経験はないため、デザインを学んだからすると、当たり前であったり、それは違うということがあると思います。
-
コードを提示による実装についてお話しはしません。
人が触れたと感じる時
アプリを触っていると五感を通して様々な形で人は触れたことを認識します。
ここでは、良くみるフィードバックの一例を紹介します。
Ripple Effect
※ 公式のサンプルより抜粋
マテリアルデザインで定義されているタッチフィードバックの一つです。
詳細は公式のリンクを見ていただければと思います。
Ripple
さざなみ
、小波、波紋、(毛髪などの)波形、ウェーブ、さざなみの(ような)音、さらさら、(談話の)さざめき、リプル、小さな早瀬、(…に)さざなみを立たせる、(…に)波紋を起こす、小さく波打たせる、ウェーブさせる、さざなみが立つ、さらさら流れる、ざわめく、さざなみのように伝わる
※ 参考：Weblioより(2018/12/21日 閲覧) https://ejje.weblio.jp/content/ripple
Ripple（小波、波紋… etc）とあるようにタップした際に波紋のようなエフェクトを発生させ、触れたことがわかるタッチフィードバックです。
公式のサンプルがありますのでご覧ください。
Material Button
フィードバックの話をしているのになぜ急にボタンが出てくるのかと思う方もいると思います。
しかし、ボタンは押されてはじめて次のアクションを起こす起爆剤のようなものです。
それゆえ押せるという認識を持ってもらう必要があるため、非常に参考になります。
ここでは、いくつかあるボタンの一部をご紹介します。
Icon Button
※ 公式のサンプルより抜粋
“いいね”や”お気に入り”を表すアイコンなどで使用されているのを見かけることがあります。
公式のサンプルではアイコンがタップすることにより、アイコンの色が反転する白抜きから黒塗りのアイコンに変わるようになっています。
タップした後に色が変わるという変化が視覚的に押せたというフィードバックを与えてくれます。
Raised Button （持ち上げ型ボタン）
※ 公式のサンプルより抜粋
Androidのデフォルトで用意されているボタンもRaised Buttonになっています。
Raise
(高く)持ち上げる、掲げる、引き揚げる、高める、増す、引き上げる、上昇させる、(…へ)昇進させる、出世させる、身を起こす
※ 参考：Weblioより（2018/12/21 閲覧）
Raise（持ち上げる、掲げる… etc）という意味の通り、タップすることにより、ボタンが持ち上がるものです。
ボタンが浮かび上がるという動きが視覚的に押せたというフィードバックを与えてくれます。
公式サンプルはこちら
振動や音によるフィードバック
視覚的なフィードバック以外にも人の五感を利用したタッチフィードバックがあります。
例えば、画面をタップした際に端末を振動させることで触覚からフィードバックする方法や、音を出すことによって聴覚からフィードバックする方法などがあります。
触れたことが認識できると何が良いか
人がディスプレイという平面に映し出されたモノに対して、押せたという認識を持てたとして何が良いのかを考えてみました。
ユーザーに安心してもらえる
自分が押したい・触りたいと思っていたボタンやセクションがちゃんと押せているか分かるので安心できます。
もし、目的と違う場所を触っていたとしても、フィードバックがあることで一目で分かります。
また、目的と違う場所をタップしたことが分かった時には、画面読み込み完了を待たなくて良いため、せっかく読み込み完了まで待ったのに想定と違うページに移動してイライラするといった、心理的負担を軽減することができます。
ユーザーに待ってもらえる
何かしらのボタンをタップした時のことを想像してみてください。
確かに画面上のボタンを押したつもりでいるのに何もフィードバックがなかったら、押せてないのかと思って不安になったり、何度もタップしてしまいませんか？
少なくとも私は何度かタップを繰り返してしまいます。
もしタップしたことが分かるフィードバックがあったらどうでしょうか？
押せたことは分かるので、ボタンを連打し直す前に「処理が遅れているのかな？」と考えて少し待ちますよね。
これは、フィードバックがあることで 触るというアクションについて安心できたこと により生まれた心理的余裕のおかげだと思います。
触れたと認識できるだけで本当に良いのか
ここまで、触れたという認識持てることがユーザーにとって大事なことだというお話をしてきました。
しかし、触れたと認識できればそれで良いのかというと、そうではありません。
例としてボタンを押した時を考えてみます。
この記事を読んでくださっている皆さんはボタンを押す時に何を期待していますか？
ボタンを押した後に発生するアクションに期待してボタンを押しますよね！
そうです！押せた後が肝心なんです！
ボタンをタップしてユーザーが期待した画面への遷移が発生したとします。
しかし、データの読み込みに時間がかかり画面が真っ白のままだったら、ユーザーは本当に読み込みが進んでいるのか不安になります。
そんな時は画面読み込み中であることがユーザに伝わるようにProgress indicatorsを表示させるといったことをするだけで、ユーザーの心理的負担を軽減することができると思いますが、このお話はまた別の機会にしたいと思います。
おわりに
新卒エンジニアとして過ごした1年間にAndroidアプリ開発を通してユーザーがどう感じるのかをとても考えるようになったと思っています。
ボタンを押した後の読み込み動作については、別の記事を書きたいと思っていますのでご期待ください！
それでは！メリークリスマス！
