イオン保険サービス 保険比較サイト

ホワイトレーベル導入を見据えたTOPページリニューアル

イオン保険サービス株式会社が運営する「保険比較サイト」のTOPページリニューアルを担当しました。コのほけん！ホワイトレーベルの導入を見据えつつ、ナショナルクライアント特有のブランド制約と、クライアント自身の「既存デザインへの忌避感」という相反する状況に対し、最適な着地点を導き出しました。

背景と課題

リニューアルにあたり、「コのほけん！」をベンチマークとしつつ、イオンらしさの表現方法が課題となりました。

• ベンチマークの踏襲：保険比較サイト「コのほけん！」を参考にしたいという強い要望がありました。
• 既存配色への拒絶：イオンの他サービスで多用される「マゼンタ×ネイビー」「マゼンタ×グレー」の組み合わせに対し、クライアントから「デザイン的に好みではない」「保険サイトには馴染まない」という率直なフィードバックがありました。
• 信頼と温もりの両立：ユーザーが安心して一生涯の選択を託せる「温かみ」のあるトーン＆マナーを希望されていました。

体験設計

「コのほけん！と同じ設計にする」というオーダーに対し、先行事例の弱点を補完する「改善」を提案しました。

• ランキングの一覧性を確保：先行事例ではランキング3位までの商品情報が1画面に収まっておらず、1画面で複数商品を比較できないという課題がありました。1〜3位までの商品情報を1画面に収めることで、比較体験の質を向上させました。
• 発見性を高める視覚的アフォーダンス：左右のカードをあえて「はみ出させて」配置し、矢印ナビゲーションを併設しました。直感的に横スクロールを促す設計により、ページ全体の占有率を抑えつつ、下部コンテンツへの到達率を改善しました。

デザインコンセプト

マゼンタを「点」で使い、ピンクを「面」で敷くことで、ブランドカラーを「維持」しながらも、クライアントが抱く「配色への抵抗感」を解消するカラーを選定しました。

• イオンらしいを表現する色の選定：競合との差別化が難しい保険比較サイトでは「イオン」というブランドが大きな差別化につながると考え、イオンらしさが伝わる配色を検討しました。クライアントが希望する「優しい雰囲気」から、淡いピンクを基調としたカラーパレットを採用しました。
• 対立の解消：忌避されていたマゼンタを、CVボタンや重要アイコンなどの「意思決定を促すポイント」に限定して使用しました。背景にピンクを広面積で敷くことで、ブランドのDNAを継承しながらも、マゼンタの強さを中和させ、クライアントの要望とブランドらしさを両立する着地点を見出しました。