意外と簡単！たった30分で実践できるUX改善アイデア5選

どれほどスタイリッシュなUIを使ってデザインをしても、UX部分に関しては実際にサイトをローンチしてからでないと、その良し悪しは分からないものです。
そのため、ホームページをローンチしたあと、*「果たしてこのままで大丈夫かな？」*と次の手の打ち方に迷いながらサイト運営を行なっているWeb担当者は多いのではないでしょうか。

確かに、ホームページを短い期間で作成して、素早く公開するというのは重要なことです。
しかし、一旦立ち上げたホームページをUXの検証もせずにそのままにしておくというのは、大きなリスクを背負うことになります。

今回は、すぐに実践できるUX改善アイデアをご紹介します。
一見小さな改善にしか見えないものもありますが、こうした改善の積み重ねによって使い心地がよくなり、結果的にコンバージョン率が上がることも期待できます。
今すぐ取り入れられそうなものから、ぜひ実践してみてください。

たった30分で実践できるUX改善アイデア集

1. タイムスタンプを「相対的」に表示する

ブログサイトや頻繁に更新されるホームページの場合、ブログ記事が書かれた時期やホームページを更新した日時は、その情報の*「鮮度」*を知る上で非常に重要です。

もちろん、5年経っても10年経過しても変わらない、不変の事実も存在します。
水は100度で沸騰する、地球は太陽の周りを回る、といった情報は、何年経っても変わりません。
しかし、インターネットで検索したり、SNS経由でたどり着いたホームページの情報の多くは、「新しい」からこそその情報に付加価値が生まれるのではないでしょうか。
その意味では、インターネット上の情報には「賞味期限」があるとも言えます。

一方、記事が書かれた日付はどのように表示されているでしょうか。
最終的に見つけるのは*「11月20日 12時47分」*のようなタイムスタンプフォーマットです。
WordPressなどのCMSでも、特段設定をしていなければ、このような表示になります。

ところが、情報の「鮮度」を決める上で、そのタイムスタンプの表示方法はちょっと不便です。
それはなぜでしょうか。
理由は、情報の「鮮度」は、「記事が書かれた日付」と*「今」との距離だからです。
別の言い方をすれば、「11月20日 12時47分」という形式では「記事が書かれた日付」にはフォーカスが当たっていますが、「今」*を無視していると言えます。
また、何日前の記事かを「計算」するのはユーザーにも一手間掛けさせてしまいます。

twitterやFacebookは、このUXをうまく改善しています。
つまり、今日が「11月23日」であれば、*「3日前」*というように表示しています。
この表示形式であれば、「今」と「記事が書かれた日付」の距離を測ることができ、ユーザーに計算をさせなくても済みます。
ちょっとしたことですが、すぐに改善できる方法なので、やってみてください。

2. 好奇心を煽るためにちょっとだけ見せる

ランディングページの中でも典型的なものの中に、オプトインページというものがあります。
オプトインページというのは、ステップメールなどを登録させるためにヘッドラインや「登録するとこんな情報が手に入ります」といった登録上のメリットを書いた上で、メールアドレスを登録してもらうためのページのことです。
無料のPDFやeブックの進呈などを行うためのページもオプトインページの一種です。

例えばリストを集めるために、*「1週間以内にFacebookで50人集客することができる100の方法」*という無料PDFを配布し、引き換えにメールアドレスを登録してもらうためのオプトインページがあるとしましょう。
しかし、キャッチコピーと簡単な概要、登録フォームだけでは、登録するまで内容が分からないので、結果的にオプトインページから離脱してしまうユーザーが減りません。

UXデザイナーとしては、この状況にどう関われるでしょうか。
それは、人間の根源的な感情を利用して、オプトイン率を上げることです。

つまり、好奇心を煽ることで、続きも見たいと思わせることが大切です。
ユーザーの好奇心を引くために、eブックの内容から3〜5個程度の内容をバラしてしまうことです。
無料でノウハウを提供してしまうのを惜しんでしまうひともいるでしょうが、オプトイン率を上げるために、そのことを気にしてはいけません。
*「もっと知りたい！」「このeブックがあればもっと知ることができる！」*そう思わせたら、こちらの勝ちなのです。

3. 「特徴」よりも「ベネフィット」

ランディングページの中には、*「セールスピッチ」*と呼ばれる部分が存在します。
それは、ヘッドラインや概要の次に現れる、詳細部分のことです。

ページの製作者としては、この製品やサービス、eブックがどれくらいユーザーにとって役立つものなのかを理解してほしいものです。
しかし、特徴をいくら説明されても、ユーザーにとっては「ふーん」と鼻であしらうくらいで終わってしまいます。

「特徴」よりも*「ベネフィット」*、つまり相手がどういう風にメリットを感じるかを具体的に書いてみてください。
例えば、「税金対策になります」よりも「お金の節約になります」、「WindowsだけでなくMacやLinuxでも使えます」より「ほどんどのコンピュータと互換性があるので、安心して利用できます」といった具合です。

弁護士が読むならまだしも普通のひとが特定商取引法についての説明を専門用語が散りばめられた中で聞くのが億劫なように、Webに精通していない人がNodeJSやReactの技術的な仕組みの説明をされても、その良さはよく分からないものです。
むしろ、特定商取引法を知ることでどんなメリットがあるのか、NodeJSやReactを取り入れることでどのようなメリットがあるのか、ベネフィットを理解したほうが、より効果的に行動を促すことができます。

4. タッチやクリックの対象エリアを広くする

スマートフォンでサービスのサインアップをするときに、入力フォームがあまりにも小さくて何度も拡大して入力しなければならなかった、そんな経験はありませんか。

残念ながら、Webデザイナーが考えている以上にスマートフォンは操作しづらいです。
現在では若い人からお年寄りまでスマートフォンを持つひとは増えましたが、20代・30代のユーザーと同じくらい、40代以上もスマホを使っていることを心に留めておかなければいけません。

「ズームしてタップさせる」という行為は煩雑さを増やしてしまうだけでなく、間違えて入力途中に送信ボタンを押してしまうような誤操作を引き起こす原因にもなります。
ユーザーにしてみたら、操作がしにくくその結果誤操作で送信ボタンを押してしまったのに、「住所が入力されていません」なんて注意されると、腹が立ってブラウザを閉じたくなってしまいます。

ところで、フィッツの法則(Fitts’s Law)というものを聞いたことはあるでしょうか。
これは、ヒューマンマシンインターフェイスにおける人間の動作をモデル化したもので、対象物に手や指を物理的に触れたり、コンピュータのディスプレイ上でポインティングデバイスを用いて仮想的にクリックしたりするサイズをモデリングしたもので、*「小さいとクリックが難しくなるので、ボタンなどの GUI 部品はある程度の大きさがなければならない」*といったことを証明する法則だと言われています。
小さいと探すのが大変で、きちんと押すのも大変なので、結果的に煩雑でユーザーの時間を奪ってしまう原因となります。

代わりに、フォームの入力フィールドやCTAボタン、リンクが簡単にタップできるように、大きさや位置を調整してみてください。
指の腹でなんとかタップできるくらいの高さではなく、完全にタッチできるくらいの大きさが好ましいです。
そして、パソコンやスマートフォンのエミュレーターだけでなく、実際のスマホやタブレットでもタップのしやすさを確かめるようにしましょう。

5. スマホ特有のシチュエーションを利用する

スマートフォンでは、パソコンに比べると画面サイズが小さく、１画面あたりの情報量も少ないです。
しかし、そうした外見的な特徴だけでなく、活用シーンにも大きな違いがあります。
それは、パソコンを利用する際には室内利用での長時間利用が多いのに比べて、スマートフォンは電車などの移動中や隙間時間などで短い時間でサイトを回遊することが多い、ということです。

スマートフォンを利用するときには、面倒でストレスが溜まる文字入力をして問合せをするよりも、電話で問い合わせるほうが早いと考えるひともいます。
特に飲食店や美容室の予約など、すぐに使いたいサービスを提供している場合には、パソコンサイトで電話番号を表示するよりも、スマホを使ってワンタップで電話したほうが楽で早く済みます。

また、最近では企業向けページにLINEのアカウント登録を促すQRコードを設置しているホームページも増えてきました。
残念ながら、QRコードはデスクトップサイトで表示されていればスマートフォンで読み込めばいいのですが、スマホ用サイトにQRコードが載っていても読み取ることが困難です。
そこで、ワンタップでLINE登録できるボタンを設置したほうが、登録率が上がります。
デスクトップサイトではQRコード、モバイルサイトでは登録ボタンと、デバイスによって登録方法を分けることで、確実にCVRを上げていきましょう。