UIとはユーザーインターフェース(User Interface)の略で、ターゲットにとっての使い勝手を指す。
WebサイトのUI設計はそのままWebサイトの質に大きく影響するほど非常に重要な要素だ。
購買意欲のあるターゲットの離脱を減らし、できるだけ多くのターゲットに購買活動してもらうために必要であるし、ターゲットにしっかりと情報伝達をし、その先のステップに繋げるためにも必要である。
また、UI設計というのは、デザインだけで成り立つものではない。キャッチコピーやメニュー構成なども含めてWebサイトの全体部分に関わってくるものだ。そしてUI設計をする上で、明確なターゲットの絞り込みと、ロジカルに組まれたWeb戦略は欠かせない。
明確なターゲットの絞り込みとロジカルに組まれたWeb戦略はUI設計にどうして欠かせないのだろうか？
お気づきの方も多いと思うが、それはUIがターゲットにとっての使い勝手だからだ。Webサイトは万人のために作られるのではない。ターゲットに向けてつくられる。
ターゲットにとって本当に使いやすいものであれば、極端な話、それ以外の人たちから敬遠されてもよいだろう。すべてはターゲットにとっての使いやすさ、ターゲットが求めているものをすぐに案内できるかどうかだ。
そしてロジカルに組まれたWeb戦略は、ターゲットを最終的にどこへ誘導すべきか、その途中にどんなコンテンツを提供するとよいのか、そういったものを示唆してくれる。それがなければターゲットの導線はできないし、UI設計も不十分になる。
UI設計をする前に、この２つ（明確なターゲットの絞り込みとロジカルに組まれたWeb戦略はUI設計）は押さえておこう。
それでは具体的なUI設計を考えるときの参考として、UIに影響を与える要素をいくつか以下にあげよう。
ターゲットがパッと見てサイトの全体像が見え、どこに何があるかわかるようなメニュー構成になっているだろうか。メニュー名も重要で、中身を見なくても何が書いてあるかわかるようにしておかなければならない。サブメニューをつくる場合には、その構造は適切か考えよう。
階層はあまり深くしない方がよい。全体的なページ構成がすっきりしていて、途中で迷わないページ構成になっているだろうか。
Webサイトの全体レイアウトにはいくつか種類があるので「Webサイトの基本レイアウト５つ」から確認していただきたい。
レイアウトはデザインの好みで決めるわけではなく、これも使い勝手や出したい世界観（ターゲットに好まれる世界観）から決めるものだ。
導線は非常に重要な要素だ。ページの適切な位置に必要なリンクが貼られているだろうか。テキストリンクがよいか、画像リンクがよいかも一考すべきだ。
また、それがクリックできると認識でき、なおかつリンク先がどのようなページであるかがクリックする前に分かるようにしているとよい。「詳細はこちら」というボタンより「◯◯を◯◯する具体的な方法はこちら」という文言の方が親切であり、クリック率もあがる。
ターゲットをスムーズに道案内するためにはどうしたらよいかを常に考えよう。
ユーザーアクションを促すボタンのデザインは重要だ。例えば資料ダウンロードボタンやお問合わせボタンがそれにあたる。
こういった重要なボタンはターゲットにすぐに気づいてもらえるデザインにしよう。これには全体デザインも関わってくる。全体デザインが複雑で色んなカラーを使っていたりすると、ボタンが目立たなくなってしまいかねない。ボタンはボタンであることを明示するとともに、重要なボタンは特にクリックしたくなるようなボタンにする必要がある。そういったメリハリはサイト全体を見やすくすることにも繋がる。
当然重要だ。スマホからの閲覧率はコーポレートサイトでは5~6割にもなってきている。比較的検索流入が多いメディアにおいては7割以上がスマホであったりするから、デバイス別の設計はもはや必須事項である。
これらUIに影響を与える要素を使ってターゲットの購買活動をスムーズにサポートすることがWebサイトのUI設計の本質だ。以降、このWebサイトのUI設計の本質について触れていこう。
ターゲットはどのようにして購買活動をし、目的地点（購入）までたどり着くのだろうか。ユーザーの心理面を考慮しながら検討する。
ターゲットの購買意欲は以下のように３段階に変化すると考える。このそれぞれの購買意欲レベルに対して適切なコンテンツを提供することこそが、購買活動をスムーズにサポートすることであり、UI設計の本質なのではなかろうか。
■検討初期段階のターゲット
→ 興味関心がある状態
■比較/悩み中のターゲット
→ 他社と比較検討中、あるいは本当にこの企業がいいか悩み中
■購入直前の今すぐターゲット
→ すぐにでも購入/お問合わせ
3つの購買意欲レベルに応じたコンテンツを作り込み、検討初期段階から比較/悩み中、そして今すぐ購入、というようにWebサイト上でターゲットの購買意欲を引き上げていくような流れを作ろう。
つまり、以下のようにコンテンツA~Cを作り込み、導線設計を組むということだ。
コンテンツA：検討初期段階のターゲット向けのコンテンツ
コンテンツB：比較/悩み中のターゲット向けのコンテンツ
コンテンツC：購入直前の今すぐターゲット向けのコンテンツ
このようにユーザーの購買意欲レベルにあわせてコンテンツを制作し、スムーズに配置することもUI設計に必要なことである。
このあたりは、Web戦略作成講座で詳しく解説しているのでそちらも参考にされたい。
「Web戦略作成講座：第４章 施策を決める」の「４−２ 価値の質をあげるためにやること」が該当箇所である。
奇抜なデザインを好む人もいるが、Webサイトはあくまでもアーティストのお披露目場ではない。企業のことを知ってもらい、商品のことを知ってもらい、信用してもらい納得してもらうための場であり、そこに奇抜さはいらない。
慣れ親しまれたデザインこそUI設計の基本だ。
例えばお問合わせボタンは一番右側にあることが多いし、テキストに下線がついていればそれはリンクを表すことが多い。ショップのWebサイトであれば、一番上か一番下に電話番号が掲載されていることが多い。
これらのことはユーザーが経験的に知っていることだ。このユーザーが経験的に知っていることをあえて変える必要はない。特にナビゲーションに関わる部分はそうだ。
勝負するのはコンテンツである。コンテンツを閲覧するためのナビゲーションが不慣れなものであればデメリットしかないだろう。
UI設計はWebサイトに大きな影響を与えるだけに真剣に取り組んでおきたいところだ。奥が深いので制作会社ともじっくり相談しながら進めていこう。
そして、UI設計をするためには明確なターゲットの絞り込みと、ロジカルに組まれたWeb戦略が必要であることを忘れないでいただきたい。
