しっかりと考えられたUIのアプリやWebサイトはとても使いやすいく、使っていてとても楽しいですよね。この記事を見ているデザイナーやディレクターの方の中でショッピングサイトや登録型サービスを担当し、UI設計をしている方もいるのではないでしょうか。UI設計をする上で必ず考えるのが「ユーザーが使いやすいUI」だと思います。しかし前述したショッピングサイトや登録型サービスの場合は使いやすさと共に、「ショッピング購入数」や「登録者数」にも気を配る必要があります。そこで今回は「ショッピング購入数」や「登録者数」を示す、”コンバージョン率” を高めるUIとはどんなものか、海外の記事を参考に考えてみたいと思います。
(この記事はGoodUIから翻訳抜粋したものです)

GoodUIには簡単に使えて、コンバージョン率を高めるUIのアイデアがいくつかまとめられています。その中から6つ、素晴らしいアイデアをピックアップしました。

1, マルチカラムではなく、1カラムレイアウトにする

corpus

(参考: http://getcorpus.com/)

1カラムレイアウトにすることでユーザーをコンテンツに集中させることができます。1カラムにすることで、読者は文章を上から下へ読めば容易に予測できます。一方マルチカラムレイアウトはユーザーが一番大事な箇所に目がいかず、他の箇所に気が散ってしまう危険性があります。ユーザーに読んでもらいたい文章を読んでもらい、最終的に必要なアクションを起こしてもらいましょう。

2, 似た機能のUI要素をまとめる

dropbox

(参考: https://www.dropbox.com/

デザインしていると意図せずに同じ様なUI要素を並べてしまうことがあるかもしれません。しかし、ユーザーが混乱しないように似た様なUI要素が点在しないように細心の注意を払っておくべきです。似た様なUI要素がバラバラに点在する場合、ユーザーはどれを選べばいいか理解するのに時間がかかってしまいます。もう一度あなたのWebサイトを見直して、似た意味でまとめられるUI要素が無いか確認してみてください。

3, クリックできる要素と選択中の要素の区別を明確にする

KFC

(参考: http://www.kfc.com.au/

色や深さ、コントラストはユーザーがインターフェイスを理解する上で、わかりやすく信頼できる情報です。それらによってユーザーは今自分はどこにいて、どこへ飛べるかが容易に理解することができます。そのためにはクリック可能なアクション(リンク, ボタン)とプレーンなテキストを明確に区別し、Webサイト全体で一貫しましょう。

4, 選択肢を並列して表示させるのではなく、オススメを強調する

spotify

(参考: http://www.shopify.com/pricing

Webサイトに(料金プランなど)いくつかの選択肢が提案する場合は、オススメのものを強調しましょう。選択肢がいくつもあると選択の意思決定が難しくなってしまうので、特定の選択肢を強調して提案してみましょう。

5, 入力フォームで求める記入事項はできるだけ減らす

Twitter

(参考: https://twitter.com/

人間はできるだけ多い作業を避けたいものです。入力フォームに記入事項が多いとユーザーは入力をあきらめてしまいます。よって、可能な限りの入力項目を減らす必要があります。もしどうしても削除できない場合は、登録後に別ベージで入力を求めるなどの対策を検討してみてください。入力フォームの数を増やすことは簡単ですが、数を減らす努力をすることでより良いものへと変化します。

6, 無駄にリンクを配置させずに、ユーザーに求めるアクションに集中させる

sketch something

(参考: http://robbiepearce.com/devices

ユーザーが必要としそうなページへのリンクをたくさん配置することは簡単です。しかし、ページの下にユーザーに押してもらいたいボタンがある場合は、それ以外のリンクが存在することは危険です。その押してもらいたいボタンまでにリンクがたくさんあると、ユーザーは押してもらいたいボタン以外のリンクを押してしまう可能性があります。無駄なリンクを省くことで重要なボタンにユーザーが到達する確率が高まります。

以上です。
今回GoodUIで述べられていたTipsは全て、ユーザーが最終的なアクションを起こしやすくなるようなものでしたね。今回のTipsを通じて改めてUIの重要性を再確認しました。今回の記事がみなさんのWeb制作の力になると幸いです!