UIデザインを比較！会員登録を促すダイアログUIを深掘りしてみた

指摘されるまで気づかない「UIデザイン」の落とし穴を、「良い例」と「悪い例」で比較しながら紹介していく連載記事、第16弾です。

今回のお題「会員登録を促すダイアログUI」

今回は会員制のアプリケーションで見られる「会員登録を促すダイアログUI」を題材に、UIデザインのお話をしていきます。

■本記事の登場人物

1. どちらが「良いUIデザイン」ですか？

2. タイトルと説明文でアプローチ

3. 分かりやすいボタン配置とカラーリング

UIデザイナーなら読んでおきたい良書

4. まとめ

• 具体的に会員登録することで得られるメリットを訴求すること。
• 訴求したいポイントは赤字や太字で強調すること。
• タイトルは、ワクワクするような呼びかけにし、ユーザーの期待感を高めるのがオススメ。
• 登録ボタン(CTAボタン)には、効果的なプライマリーカラーを使うことでタップされる確率を高める。
• 登録ボタン(CTAボタン)が薄グレーに黒字だと、印象としてはだいぶ弱い。
  (サービス全体の配色にも関係するが、CTAボタンは目立つことと緊急性が高く見えることが重要)
• スキップボタンはテキストリンクにすることで、CTAボタンとのメリハリが生まれ、会員登録など強く訴求したい場合に効果的
• テキストリンクには必ずアンダーラインを表示し、リンクであることをパッと見で分かるようにしておく。
• ボタンの配色として、薄グレーに白字だと視認性が悪く読みづらい。
• 画面内で優先度をつけメリハリを出すことは、UIデザインする上で常に意識しておくべきポイント。