ユーザーフレンドリー

Pocket

こんにちは!
不安定なお天気が続きますね。急に大雨が降ったりするので困ってしまいます。
さっそく新品の靴が濡れてしまいました…みなさんも気をつけて下さいね。
もし靴の買い替えをご検討中の方は梅雨が明けてからの方が良いかもしれませんよ!

さて、今回のテーマは「ユーザーフレンドリー」です。
ユーザーフレンドリーとはどんなものなのか、スマホ向けサービスをデザインする視点で考えていきたいと思います。


ユーザーフレンドリーとは?

ユーザーフレンドリーとは、その名の通り「使う人にとって親切なこと」と言う意味です。
ユーザーの視点に立ったサービス設計や、使いやすい状態を言います。UIデザインをする上でとても大切なことです。

「何も知らない人が初めてこのサービスを見た時、使い方がわかるかな?」と考えてみて下さい。
ユーザーは、何か目的があってサービスを利用しようと思っています。その目的をストレスなく達成してもらう為に、ユーザーフレンドリーを意識してUIデザインを行って下さい。
そうすることで、問題点のある現状よりUIを向上させることが出来るはずです。


ユーザーフレンドリーのポイント

ユーザーフレンドリーで特に意識すべき代表的なポイントをご紹介したいと思います。


①目線の流れを意識する

基礎的なことではありますが「目線の流れ」を考えましょう。
簡単に言えば、横書きの文字は左から右へ、行が変われば上から下へ読むのが自然なことですので、そう行った目の動線を意識すると言うことです。

目線があっちこっちに行くより、一定のルールでテンポよく見せてあげた方が見やすいですよね。

②優先度を明確にする

ユーザーにとって優先度が高い物から順番に構成しましょう。
①とも関係しますが、目線が左から右、上から下へ動く特徴を活かし、優先度の高い物は上部または左上に置くと効果的です。
最も目立ち多くの人に見てもらえる場所ですので、それだけユーザーがすぐ気付くことが出来ます。

更にその中でも優先度が最も低い物やあまり目立たせたくない物、最も重要な物で表現を変えたりするとよりわかりやすくなります。

上記を意識してボタンを配置する場合のイメージも作ってみました。下の図を見てみて下さい。

まず、あまり目立って欲しくない物とは「キャンセル」「戻る」など離脱する要素で、イメージの左の図のように色の面積を減らして目立たないようにしています。
開発側からするとネガティブな要素なので、出来るだけ押してほしくないですよね…。
優先度をかなり下げてテキストだけにすることもありますが、これは開発側の目線なのでユーザーフレンドリーではなくなってしまいます。
その場合はテキストの色を変えてあげたりするとアクションを起こせる気づきになるので、ユーザーフレンドリーになります。

次に、特に重要な物とは「決済の確定」「消去」など取り消せない要素で、イメージの右の図のように注意を促す赤色を使用して目立つようにしています。
こうすることで目線を優先度の高い物へ誘導してあげることが出来ます。


③押せることがすぐわかるようにする

ボタンやリンクパネルなどタップすることでアクションが起きる要素が、押せるものだとすぐわかるようにしましょう。

下記の図を見てみて下さい。

左の図のより、右の図の方がボタンだと認識しやすく押せることが分かりやすいですよね。
文字を囲っただけですが、ちょっとしたことでグッとわかりやすさが変わってきます。

優先度が低いアクションに対しては、テキストの下に下線を引いたり、矢印アイコンを付けるだけでも効果があります。

 

ここで注意したいのが、押せる場所と押せない場所の違いが明確になるようにすることです。
押せない場所が押せるように見えないように表現を変えましょう。


④シンプルに

機能や画面の要素は出来るだけシンプルにしましょう。
選択肢が多ければその分迷いが発生しますので、ユーザーが目的を達成するまでに時間を掛けさせてしまいます。

極端な話ですが、選択肢が2つしかなければ、どちらか1つ選べばいいだけなのでわかりやすいですよね。
機能を減らすのが難しい時など、どうしても画面内が複雑になってしまう場合は、最も優先度が高い物が何なのかわかるように構成しましょう。

例えば下記の図ですが、機能が沢山ある中でもシンプルに見せることが出来ます。

左の図は、選択肢が多い上に見た目も同じなので、どこを選択すればいいか一目ではわかりづらいですよね。
上から下まで読んでから選択する…と言う動きになるので、時間のロスだったりユーザーのストレスに繋がります。
右の図だと、「はい」「いいえ」の選択肢にまず目がいきますよね。「青いボタンのどちらかを押せばいいんだな」とユーザーが直感的に気付けるかと思います。
このように、いかにシンプルに見せるか注意することで、わかりやすさに大きな違いが出てきます。


おわりに

いかがでしたでしょうか?
ユーザーフレンドリーの考え方自体は、そんなに難しい事ではないですよね。
そもそも機能が複雑だったり、サービス開発が進んでいく中で仕様が変化したりすると「どうすればいいかな?」と悩むところではありますが…

悩んだ時こそ、ユーザーにとって何がフレンドリーなのか初心に返ることも大事なのではないでしょうか!

それではまた!デジマースのコンでした。

Pocket