入力フォームのデザインは、ちょっとした変更で操作性に大きく差が生まれます。

本記事では、入力フォーム最適化(EFO)を行い、申込み完了率を2倍にアップさせた事例についてご紹介します。

【事例対象】
事例ホームページ:結婚式場の情報ポータル
目的:結婚式場を紹介し提案やマッチングをするサービス

改善結果

【ビフォー】申し込み完了率 7%
【アフター】申し込み完了率 16% CVRは2倍以上

デザイン
【改善ポイント1】ファーストビューに体験をイメージさせる画像を挿入
【改善ポイント2】送信ボタンのデザインを統一

テキスト
【改善ポイント3】フォームタイトルの変更、登録時間の記載
【改善ポイント4】「最短30分で提案」という強みをアピール

ユーザビリティ
【改善ポイント5】必須項目と任意項目を明確化

申し込み完了

STEP1 課題~メルマガ内リンクのクリック率が低い!

入力フォームは本当にシンプルがいいのか

LPのデザイン

こちらは、以前運営していたブライダル系サービスのLP(ランディングページ)で、結婚を考えているユーザーと、結婚式場のマッチング(お問い合わせ)を目的としたLPです。LP全体のデザインは、主にピンクを基調とし、結婚式・結婚式場、実際のスタッフの写真を掲載することで、具体的なイメージのしやすいデザインに留意していました。

いっぽうで、LPの先にある入力フォームは「ホームページで既に使っていた見出しを変えたシンプルな作り」となっていました。

入力フォームのデザイン

しかし、入力フォームに訪れた人のうち、約7%しか完了していないことが分かりました。ほとんどの人がページを進んでいなかったのです。

STEP2 改善~タイトルを工夫してクリック率を検証

フォームのデザインギャップに着目

このページ遷移率の少なさを、次のように考えました。

・LPとのデザインにギャップがありユーザーの意欲を下げている。
・心理的なハードルが高く、入力に至らない。
・ユーザビリティ(使い勝手)に欠けている。

そこで、入力フォーム直前のページと、入力フォームのデザインに統一感を出すよう改善を試みました。とくに、人物画像の設置や、送信ボタンのデザイン、送信ボタン内の文言なども細かく見直しました。

入力フォームデザイン変更

改善(1)画像

入力フォーム上部に人物写真(オファー画像)を設置しました。人物写真(オファー画像)から、ゴール(式場が見つかって理想の結婚が出来た)をイメージできる工夫しました。

オファー画像

また、送信ボタンを、より立体感のあるデザインに変更(大きさ・ツヤ・形・色)しました。LPでも使われています丸みのあるボタンに統一しました。

ボタンのデザイン変更

改善(2)テキスト部

フォームタイトル文を変えました。また、どれくらの登録時間がかかるのかを記載しました。心理的ハードルをとにかく下げようとしました。ことばも「お申し込みフォーム」から「ご希望オーダーシート」にを変更。「登録はたったの60秒」と書き、わずかな時間で気軽にできることを強調しました。

文言変更
強みの強調

また、ユーザーにとって、希望の結婚式場を最短30分で提案するといった強みやのメリットを強調しました。

入力フォーム比較

改善(3)ユーザビリティ(使い勝手)

必須項目と任意項目を明確にしました。入力で迷わないよう、配慮しました。

入力項目の改善

STEP3 考察~完了率が2倍向上

施策後、1ヶ月後にふたたび計測しました。すると、入力フォームの完了率が、7%から16%に向上していました。2倍という数字にスタッフ一同盛り上がりました。入力フォームの改善はこのような細やかな気遣いが重要なのだと学びました。

デザイン部分の違和感をなくしたり、ユーザーのモチベーションを持続させたりと、集客にばかり目が向いていましたが、できることはあるのだと感じました。