root
820 views

コンバージョンレートを格段に上げるボタンデザインのコツ!

「資料請求」「商品を購入」「会員登録」などのアクションを、いかにユーザーから引き出すかは、デザイナーにとって大きな課題です。もちろん、サービスや商品が魅力的なものであることや、ユーザビリティの高いページを設計することは言うまでもありませんが、アクションの入口となるボタンのデザインを改善することで、大きな成果をあげられることもあります。

ここでは、サイトに訪れてくれたユーザーを、コンバージョンに繋げるためのボタンについて考えていきましょう。

ユーザーのアクションを引き出すためのポイント

1. 色や大きさでボタンを目立たせる

ボタンを目立たせるベーシックな方法は、まわりとのコントラストの差が大きくなるように色を計画することです。たとえば、背景色が白やグレーなどの場合、ピンクや赤などのビビッドで強い色がいいでしょう。逆に背景色が黒など強い色の場合は、ボタンの色を白や黄色などにしてコントラストの差を確保しましょう。

また、ボタンそのものを大きくしたり、まわりにホワイトスペースを取ったりして目立たせるのも効果があります。

2. 他のボタンとデザインを変える

コンバージョンに関わるボタンは、他とデザインを変えるのもひとつの方法です。たとえば、アイコンや自社のキャラクターなどの画像を入れたり、アニメーションによる演出を加えたりすることで、より目立たせ、ユーザーの興味を引くことができます。

3. おトク情報を加える

ECサイトの場合、ユーザーにとって有益な情報をボタンに表示することで、興味を引くのも有効な方法です。例としては「本日限り50%OFF」「今なら送料無料」「サイトだけの限定商品」などのようなおトク情報があげられるでしょう。実店舗で店員さんが商品を勧めるときの文句を表示すると考えると、分かりやすいのではないでしょうか。

4. 手軽さをアピールする

資料請求や会員登録のボタンの場合は、手軽さをアピールする方法があります。たとえば「3ステップで簡単登録」「無料で資料請求」などのフレーズをボタンに入れ込むことで、アクションのハードルを下げるようにしましょう。

「資料だけならお金はかからない」と分かりきっている場合でも、「無料」という言葉をあえて表示させることで、ユーザーに手軽さをアピールできる効果があります。

5. ロード中でも状況を知らせる

ユーザーのインターネット環境が必ずしも高速であるとは限りません。読み込みに時間がかかる場合に備えて、ロード中の状況を知らせることができるような設計にしておきましょう。

ボタンを押してすぐに反応がないと、ユーザーによってはボタンを連打したり、そのままあきらめたりするケースも少なくありません。矢印がくるくる回るアイコンを表示させるだけでも効果があるので、「何かが動いている」ことが分かるようにしておきましょう。

ユーザーの背中を後押しする役目

検索やリンクを通してわざわざページにたどり着いたユーザーは、すでに商品やサービスに対して何らかの興味を持っていることが少なくありません。その興味を後押しして、コンバージョンに繋げるのがボタンの役目と言えます。今回ご紹介した 5つのポイントを参考にして、ユーザーの背中を後押しできるボタンを作っていきましょう!

参考サイト:
Call To Action Buttons
Principles for Successful Button Design

 新規事業・UXデザインのことなら私たちにご相談ください。

私たちは事業戦略に応じたプロダクトデザイン戦略策定からUXデザイン、人間中心設計に基づいたデザイン手法を実行することで事業の立ち上がりから成長までの過程を支援します。サービス開発、UXデザインのことでお困りの方は、rootまで気軽にご相談ください。

root

公式アカウント

root

公式アカウント

「芯を問い、成長に貢献する」をミッションに事業戦略に応じたプロダクトデザイン戦略の立案からUXデザイン、人間中心設計に基づいたデザイン手法を実行することで事業の立ち上がりから成長までの過程を支援します。

SNSをフォローする

ストーリー&インタビュー

人気の記事

問い合わせ

プロジェクトに関するご相談やお見積依頼はこちらからご連絡ください。社内で検討されたい方のために事業紹介をまとめた資料をお送りすることも可能です。

採用情報

rootのカルチャーに興味があり一緒に働きたいとお考えの方はこちらをご覧ください。正社員、パートナー、インターン等雇用形態に限らず受け付けております。