A/Bテスト事例のご紹介、他

目次

1. 自己紹介2. A/Bテスト事例ご紹介3. A/Bテストをし続けるには？

自己紹介職種

• デザイナー

やりたいこと

• 実際に使えるものを作る• 作り手と使い手のギャップをなくす

やってること

• 使い手の立場からデザインを考えて、 A/Bテストで効果を検証

• 1年弱で約 50テスト実施・監修

@marippe_

山口磨理子

A/Bテスト事例ご紹介コントラスト比の改善テスト

A/Bテストとは

コントラストとは

色と色の差。コントラストが高いほどクッキリ見えます。

コントラスト比が高いとより多くの人が見える

○見える

×見えない

×見えない

○見える

○見える

○見える

見える人にとっても、より見やすくなる

○見えづらい

◎見やすい

見えるけど

コントラスト比の基準は？

WCAGが定めている基準があります。

最低限のコントラスト より十分なコントラスト

3 : 1 4.5 : 1

※文字のサイズが大きい場合

本当に効果があるのかをテスト

ボタンのコントラスト比を上げることでクリックされやすくなるか。

オリジナル コントラスト比変更

結果

クリックされやすくなりました。

36.0%

35.2%

コントラスト比変更

オリジナル

別のサイトのボタンでも同様のテスト

オリジナル コントラスト比変更

結果

こちらもクリックされやすくなりました。

43.5%

41.7%

コントラスト比変更

オリジナル

さらに地図でもテスト

オリジナル コントラスト比変更

結果

またまたクリックされやすくなりました。

63.3%

62.5%

コントラスト比変更

オリジナル

ということは…

コントラスト比の改善でCTR改善が期待できる！

厳密には

どちらの効果なのかはわかりません。

どちらにせよ、コントラスト比改善はユーザーにとって使いやすくするための 1つの手法であると思います。

見えなかった人が見えるようになった（アクセシビリティ）

見えてた人がより見やすくなった（ユーザビリティ）

A/B テストをし続けるには？

真の目的はコントラストではない

ユーザビリティやアクセシビリティの重要性を証明するための 1テストです。

人間中心設計の重要性の証明大目的

小目的アクセシビリティ・ユーザビリティの重要性の証明

コントラスト比のテスト

大きな目的を持ちましょう

大きな目的がないと、失敗した時・反対された時にやめてしまう。

目的がある

目的がない

例えば

•ユーザーに愛されるサイトにしたいので、テストをし続けてユーザーアクションや満足度を上げ続ける

•デザイン /デザイナーの重要性をアピールしたいので、デザインによって CTRや CVRや収益が変わることを訴え続ける

•指示された内容をこなすんじゃなくて自分でデザインしたいので、指示された版と自分版をテストし続けて信頼を得る

ありがとうございました