CVに繋げるUI/UXデザインのポイント（３）

こんにちは。FASTCODING UI/UXデザイナー、一富士二鷹三茄子です。

今回もCVに繋げるUI/UXデザインのポイントをご紹介します。CVを妨げる要因は色々ありますが、ユーザーにとって初めて訪れたサイトやサービスでは「購入」「登録」などといったアクションは、非常にハードルが高いものです。
人は、その行動によって得られる利益よりも損失の方を意識する傾向があると言われています。ユーザーが損失と感じる不安は取り除き、直感的に利用できる体験を提供することがCVのハードルを取り除く近道となります。

では、どのようなUIにすれば効果的なのか、その方法についてご紹介します。

CTAを統一する

申し込みを検討している際、同一ページに「無料トライアル」「資料請求」という２つのCTAが存在した場合、ユーザーは「無料トライアルでお試ししたいが、資料も欲しい。どちらを先にすべきか？」という迷いが生じてしまうかもしれません。このように、異なるCTAが同一ページに存在する場合、迷いが生じ一旦そこで思考が停止してしまいます。それをきっかけに深く検討し始め、選択する事自体を辞めてしまうといった事にもなり兼ねません。
どうしても複数のCTAが必要な場合は、優先度の高いボタンを大きめに表示する、ページ内で目立つ色にするなど、優先順位をつける様にしましょう。

マイクロコピーを工夫する

マイクロコピーとは、数文字・数行程度のテキストの事で、ユーザーにアクションを起こしてもらうための「一押し」として用いられる事が多いです。

その中でも特に効果的なものを二つご紹介します。
一つ目は「実績」を訴求するマイクロコピーです。初めて利用するユーザーにとって、十分な実績があるという事は不安解消の手助けとなります。「導入実績○○社以上」「DL数 No.1」といったコピーは、よく使われているので目にした覚えがあるのではないでしょうか。
別ページを設けて実績を紹介するケースもありますが、CTAの近くに実績を置く事で、よりCVRの改善が期待できます。

二つ目は「手軽さ・簡単さ」を訴求するマイクロコピーです。移動中などに購入や申し込みを行うケースも考えられますので「簡単3ステップ！」などのコピーをCTAボタンの周辺に配置し、手軽さを訴求する事でCVに繋がりやすくなります。
また、「1分で完了」よりも「60秒で完了」の様に「秒」で表記した方がCVRが高いという結果も出ています。この様に、そのコピーがユーザーにとって身近に感じられるかどうかも重要となります。

入力フォームを改善する

問い合わせやユーザー登録が複雑・面倒だと思われた場合、離脱してしまう確率が高くなります。
スムーズに入力できるフォームにするために注意したい点をご紹介します。

視線の動きに配慮した配置にする

インタラクションコストを最小限にする為、視線の動きに配慮した配置にしましょう。視線を左右に動かさなければならない場合、ユーザーは入力しづらく感じます。スマホでは上から下にスクロールする為、垂直方向が自然でストレスの少ない配置になります。

なるべく項目数を減らす

必須となる項目以外はなるべく減らすよう心がけましょう。登録に必要な情報だけ先に入力させ、属性に関する情報は登録後に取得するなど工夫することで離脱を防ぐことが出来ます。

グルーピングする

全てを等間隔で並べてしまうと、見辛くなり入力が困難になります。ラベルと入力欄、関連項目などはグルーピングすることで見やすくなります。

入力例や注意事項はフォーム外に表示する

プレースホルダー内に記入例などを表示しているケースを見かけますが、ユーザーが文字を入力し始めると消えてしまう為、何を入力しているのか分からなくなってしまいます。入力はフォームの外に表示しましょう。

入力方式に注意する

ユーザーのインタラクションコストを最小限にする為、入力方式に注意しましょう。
例えば、選択肢が多くないのにも関わらずプルダウンを採用した場合、プルダウンを開く手間が発生し、ユーザーにワンステップ多く操作させることになります。選択肢が少ない場合はラジオボタンにするなど、最適な入力方式を選択しましょう。