ホワイトレーベル導入を見据えたTOPページリニューアル
イオン保険サービス株式会社が運営する「保険比較サイト」のTOPページリニューアルを担当しました。コのほけん！ホワイトレーベルの導入を見据えつつ、ナショナルクライアント特有のブランド制約と、クライアント自身の「既存デザインへの忌避感」という相反する状況に対し、最適な着地点を導き出しました。
背景と課題
リニューアルにあたり、「コのほけん！」をベンチマークとしつつ、イオンらしさの表現方法が課題となりました。
保険比較サイト「コのほけん！」を参考にしたいという強い要望がありました。
イオンの他サービスで多用される「マゼンタ×ネイビー」「マゼンタ×グレー」の組み合わせに対し、クライアントから「デザイン的に好みではない」「保険サイトには馴染まない」という率直なフィードバックがありました。
ユーザーが安心して一生涯の選択を託せる「温かみ」のあるトーン＆マナーを希望されていました。
体験設計
「コのほけん！と同じ設計にする」というオーダーに対し、先行事例の弱点を補完する「改善」を提案しました。
保険検討ユーザーの多くは特定の保険種目を絞って探しており、種目間の回遊よりも「同種目内での比較」を優先する傾向があります。先行事例では種目リストを縦に並べる構造上、ランキング3位までの情報を1画面で俯瞰できず、比較時に左右のスクロールを強いる課題がありました。本設計ではカードをコンパクト化し、1〜3位の主要情報を1画面内に収めることで、比較体験の質を向上させました。
左右のカードをあえて「はみ出させて」配置し、矢印ナビゲーションを併設しました。直感的に横スクロールを促す設計により、ページ全体の占有率を抑えつつ、下部コンテンツへの到達率を改善しました。
デザインコンセプト
マゼンタを「点」で使い、ピンクを「面」で敷くことで、ブランドカラーを「維持」しながらも、クライアントが抱く「配色への抵抗感」を解消するカラーを選定しました。
競合との差別化が難しい保険比較サイトでは「イオン」というブランドが大きな差別化につながると考え、イオンらしさが伝わる配色を検討しました。クライアントが希望する「優しい雰囲気」から、淡いピンクを基調としたカラーパレットを採用しました。
忌避されていたマゼンタを、CVボタンや重要アイコンなどの「意思決定を促すポイント」に限定して使用しました。背景にピンクを広面積で敷くことで、ブランドのDNAを継承しながらも、マゼンタの強さを中和させ、クライアントの要望とブランドらしさを両立する着地点を見出しました。
