2 万回の A / B テストからわかった支持される Web デザイン事例集

テストで実際に成果の出た事例だから本当にユーザーの求めているデザインがわかる。クレディセゾン、SBI 証券、ヤフー、大東建託、九州旅客鉄道、ヤマハミュージックジャパン、日本ピザハット、ブックオフオンライン…厳選 35 事例掲載。

Web ページのどこを直せば申込みや購入が増えるのかを、制作者の勘ではなく実施済みの A/B テストの結果で示す事例集が『2 万回の A/B テストからわかった支持される Web デザイン事例集』 (鬼石真裕、KAIZEN TEAM 著、技術評論社、2018 年 7 月刊) です。版元は、2 万回という大量の実例から厳選した A/B テストの実例をもとに、どのような Web デザインがユーザーから支持されるのかを解説する書籍と案内し、紹介する事例はすべて実際にテストで行われたものだと明記しています。書店掲載の書誌 (出版社提供) では、支持された案と支持されなかった案を比較し、その内容を検証しながら進む形式と説明されています。判型は B5 判です。

全 2 章の構成、改善の 3 ステップと業種別 35 事例

構成は全 2 章です。第 1 章「なぜ A/B テストが必要なのか」では、A/B テストとは何か、もっとも有名な A/B テストの事例、なぜ継続的改善は必要なのかを押さえたうえで、改善 STEP1「ビジネスモデルを整理し、KPI を設定する」、改善 STEP2「どこを改善するのか?」、改善 STEP3「何を改善するのか?」の 3 ステップで改善プロセスを整理し、ランディングページ (LP)、一覧ページ、詳細ページ、フォームページ、コピーというページ種別ごとの見方を示します。第 2 章「AB テスト事例集」が本書の主体で、金融編、リード獲得編、サブスクリプション編、EC 編の 4 つの業種別に事例を並べます。各事例は「言いたいこと詰め込んじゃってる問題」「アクション導線が埋もれてしまっている問題」「途中で入力諦められる問題」のように課題を「〜問題」と名づけた見出しと、クレディセゾンのセゾンゴールド・アメリカン・エキスプレス・カード申込ページ、SBI 証券のサービス案内ページ、ヤフーの Yahoo! しごと検索 検索結果一覧ページ、大東建託のいい部屋ネット 物件一覧ページ、HJ ホールディングスの hulu 無料会員獲得ランディングページ、日本ピザハットのピザハット 商品詳細ページ、ブックオフオンラインの申し込みページ (PC とスマホ) といった実在の企業 / サービスの対象ページで構成されます。書店向けの紹介文では厳選 35 事例と案内され、公開目次に並ぶ事例の数もこれと一致します。

A/B テストがデザイン論争を実測に変える仕組みと、事例集の読み方

A/B テスト は、同じページの 2 つの案をユーザーにランダムに振り分けて表示し、申込みや購入といった成果の差を比較する手法です。デザインの良し悪しは制作者の好みや決定権者の一言で決まりがちですが、A/B テストではどちらが支持されたかがユーザーの行動として数字に残るため、議論の根拠が主観から実測へ移ります。もっとも、1 回のテストで分かるのはそのページ / その時期のユーザーに対する結果であって、他のサイトへそのまま移植できる法則ではありません。だからこそ、勝った案の見た目を暗記するより、なぜその案が支持されたのかという課題の構造を理解する読み方が重要になります。本書の目次が「情報に優先順位がついてない問題」「フォームにきてもまだ不安問題」のように課題そのものを事例名にしているのは、この構造に目を向けさせる作りです。第 1 章が KPI 設定、どこを改善するのか、何を改善するのか、の順で改善プロセスを置いているのも、テストを単発の当て物にせず継続的改善の一部に組み込むためで、事例を読むときも ユーザーインターフェース の細部より、その事例がどの種類のページのどの課題に対する検証だったのかを自サイトに引き当てて読むと効き目が大きくなります。

Web 担当者とマーケター向きの事例集で、統計や実装の教科書ではない

版元が「こんな方にオススメ」に挙げるのは、実例に基づいたユーザから支持される Web デザインについて知りたい人、成果の出せる Web デザインの傾向 / 事例を知りたい人、A/B テストやサイト改善に興味がある人の 3 者です。A/B テストの概要や実態を知りたい読者にも勧めていることから、テストの実務経験が無くても読める入門的な位置づけです。一方で、公開目次には統計的な判定方法やテストツールの操作手順、HTML や CSS の実装を扱う章は無く、そうした技術面を体系的に学びたい人の教科書ではありません。事例の対象ページは 2018 年の刊行時点のものなので、個々の画面をそのまま参考にするより課題の型として読む前提も必要です。著者の鬼石真裕は、版元プロフィール (刊行時点) によれば Kaizen Platform フェローで、リクルート、ビズリーチ、グリーで企画、営業、プロダクト、事業責任者などを歴任し、Kaizen Platform ではカスタマーサクセス組織の立上げを経て、300 社の大企業のコンサルティングを含めた営業 / マーケティング責任者に就任、2018 年 7 月よりフェローとして全般の事業支援に携わると紹介されています。共著者名の KAIZEN TEAM は版元公式の表記で、openBD と NDL の登録では Kaizen Platform の名で記録されています。

本書を読み終えた人が得るのは、自社サイトのランディングページや一覧ページ、フォームを見て、どの課題の型に当たるのかを言い当て、改善案を A/B テストの企画として起案できる目です。申込率や購入率を担当していて改善提案の根拠を求められている Web 担当者やマーケター、クライアントへの提案に実測の裏づけが欲しい制作会社のデザイナーやディレクターにとって、実務の判断材料として元が取りやすい一冊です。HTML や CSS、デザインツールから学び始める段階の人は、まず Web デザイン本の選び方 で基礎を固める本を選び、その次の実務段階で本書を手に取ると事例の読み方が深まります。感覚の議論を実測の議論へ変えたい現場の最初の一歩として、堅実な選択です。