この記事をシェアする

ユーザビリティ向上のキーポイントとは…?身近なところから調べてみた!

imarip0i9a7464_tp_v

皆さんこんにちは!

突然ですが、普段ウェブサイトを利用していて、迷いなく目標を達成出来たり、作業を遂行できたりすることに疑問を持ったことはありますか?

きっとほとんどの方が疑問を持ったことがないだろうと思います。私もありません。

ですが、私たちが「当たり前」だと思って利用しているものも実はユーザーにストレスを与えないように工夫して作られているのです。これは、ユーザビリティを考える上でも非常に大切になってきます。

そこで今回は、「当たり前だけど実はこんな効果があるんだよ!」というウェブサイトのポイントを、楽天を一例として取り上げさせていただき、紹介していきたいと思います。

使用させていただくサイト

e8e9f743bafa9da97c292685af02e6fa

楽天市場はインターネット通販が楽しめる総合ショッピングモール。楽天スーパーポイントがどんどん貯まる!使える!毎日お得なクーポンも。あす楽利用で翌日にお届け。食品から家電、ファッション、ベビー用品、コスメまで、充実の品揃え。

さっそく、実際に見ていきましょう!

アイコンは意図が分かりやすいようなデザインで!

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-70

初っ端から「当然だろう」とお叱りを受けそうなことを言って大変恐縮なのですが、まずはどのウェブサイトにも1つはあるだろうと思われるアイコンです。

デザインとして見栄えがよくなるのはもちろんですが、その”意図”がユーザーにきちんと伝わらなければ意味がありません。アイコンの利便性を生かすためにも、ユーザーが直感的に理解でき、しっかりと活用してもらえるような、汎用的なデザインが好ましいですね。

現在地を明確にする

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-67

膨大な情報量を擁するウェブサイトで、いま自分がどこにいて、どこをクリックすれば元のページに戻れるのかをユーザーに示すことは非常に大切です。

ウェブサイトを活用してもらうためにも、位置情報を明確にし、ユーザーを迷わせないようにしなければなりません。

また、例として使用させていただいている楽天のようなECサイトであれば、商品を検索した際にこの商品はどのような括りの中にあるのか、またどのようなジャンルなのかということをユーザーに知らせることができるので、検索しやすくもなります。


完了までのステップを伝える

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-62

ウェブで作業するのに、いくつかのステップを踏まなければ自分の目標を達成できないことがあります。その際に、あとどれだけのステップがあるのか分からないまま作業を続けるのは不安ではないですか?それに比べ、完了までのステップが明示されていれば、安心して作業を行うことができますよね。

ユーザーも同様の気持ちを抱えています。「今どこにいるのか」「あとどのくらいのステップが残っているのか」を明示することで、ユーザーの不安やストレスを低減させることにつながります。特に、ステップが複雑で長くなるような場合はステップを伝えてあげるとユーザーにとっては非常に便利な機能です。

ユーザーの入力を補助する

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-71

よくフォーム画面などで、ユーザー情報を入力しなければならない時がありますよね。郵便番号を入力すれば住所を自動的に入力してくれる住所検索など、現在はさまざまなサイトが導入しており、主流になっています。このような機能はユーザーの入力負担を減らすことで、ユーザーの作業効率も良くなりますし、サイトがやってほしい目標をユーザーが達成しやすくなります。

住所検索の他にも

  • ユーザーが過去に入力した情報は入力させない
  • 名前入力の際の漢字・カナ同時入力(画像下)

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-72

(名前入力の欄に漢字を入力すれば自動的にフリガナをおくってくれるようになっている)

などがありますが、これはできるだけユーザーの負荷を軽減するという意図があって作られているのですね。

 サブミットさせない

上記と関連して、入力に不備があった場合サブミットさせないということもできます。

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-68

もし入力に空欄や不備があった場合、楽天だとサブミットできず、画像のように赤文字黄色の枠で教えてくれます。

入力が十分でないのにもかかわらずサブミットできてしまうと、ユーザーがエラーを発生させてしまう可能性が高まります。エラーが生じると、ユーザーが何度も何度も情報を入力し直さなけれなならないので、ストレスを与えてしまいます。そうすると、作業から途中で離脱してしまうユーザーも出てきます。

そのようなエラーをなくすためにも、事前にサブミットできないようにし、ユーザーに細やかな配慮をする必要があるのです。

まとめ

いかがだったでしょうか。

私たちが普段目にするウェブサイトにもユーザビリティを高めるための工夫がなされているのですね。また、「便利だなー」と何気なく使用している機能もちゃんとした”意図”があるのです!

これらのユーザーへのちょっとした配慮が、ウェブサイトでの作業をスムーズにしてくれるのですね。

WalkMe(ウォークミー)

この記事をシェアする

フォローする