FIGMA
ILLUSTRATOR
PHOTOSHOP
MY WORKS
Portfolio

CASE 08

← Back to home
おすすめEV診断
CASE 08

おすすめEV診断 — EV PLUSのEV選びサポートコンテンツ


期間

約2週間

チーム構成

デザイナー1(自身)
ディレクター1
エンジニア1

Live サイトを見る ↗
DETAILS

背景・課題

EVへの関心が高まる一方で、「車種が多くて、自分に合うEVがわからない」という声も少なくありません。そこでEV PLUSのコンテンツとして、6つの質問に答えるだけで暮らしに合ったEVを提案する診断コンテンツを制作しました。

目的・KPI

  • どのEVを選べばよいか迷うユーザーに、自分に合うEVを気軽に見つけてもらう
  • 診断結果からサイト内のEV紹介記事へ誘導する
  • EVの購入検討・購入につなげる

担当範囲

  • 診断フロー(トップ・質問・ローディング・結果)のUIデザイン(SP / PC)
  • 診断結果のイラスト
  • OGP・記事導線バナーのデザイン

アプローチ・工夫点

1. 迷わず答えられる1画面1問の構成
1画面に質問を1つだけ置き、選択肢をタップするだけで次へ進む構成に。画面下部の進捗バーで残りの質問数がわかるようにし、最後まで気軽に答えられるようにしました。

2. 結果が楽しみになるイラスト
トップや結果ページには、EVのある暮らしを描いたやわらかいトーンのイラストを使用。診断タイプごとにイラストを用意し、結果を見るワクワク感を演出しました。

3. 記事から診断へつなぐ導線
「かんたん1分!」「EV選び、迷っていませんか?」といったコピーのOGPとバナーを制作し、SNSや記事から診断へ自然に流入できる導線を設計しました。

キーワード

  • 親しみやすい
  • 気軽・かんたん
  • ワクワク感

メインカラー

#C60D31
#02BCC5
#141414
#F6F6F6

使用ツール・技術

Figma(UIデザイン)
Illustrator・Photoshop(イラスト)

成果

EV PLUSの常設コンテンツとして公開。サイトのフッターや記事内バナーから診断に入れる導線を整え、EV選びに迷うユーザーの入口となり、診断結果からEV紹介記事への回遊にもつなげています。

診断の質問画面

住まい・充電スタイル・車のタイプ・利用シーン・乗車人数・車に求めることの6問で構成。どの質問も2〜5個の選択肢から選ぶだけで、迷わず進めます。

OGPと記事導線バナー

SNSシェア用のOGPと、記事内に置く導線バナー。診断トップと同じイラストとトーンでそろえ、どこから入っても同じ世界観で診断を始められるようにしました。

THE DESIGN — おすすめEV診断
Call me maybe
CONTACT ME
How to find me

お気軽にご連絡ください。

これまでの制作実績を詳しくご紹介いたします。ご連絡は下記のメール、またはLinkedInアカウントまでお願いいたします。ありがとうございます。

KAI USUI
© Kai Usui — UI/UX Designer