こんにちは！ちょこです！
タイトルに毎回出てくる「アカウント連携のお願い」のダイアログのボタンを見てて、訴求するボタンについて書いてみようと思いました。
汎用的なUIパーツを作るのは得意だけど、ルールから外れるボタンを作るのは怖い！
というデザイナーさんに向けて書いてみます。
「アカウント連携のお願い」のダイアログのボタンのデザインは以下のデザインです。
左側は汎用ボタンに文字が表示されているだけです。
右側は色が付いたり、ロゴが付いたりしてとても豪華で目立ちます。
ゲームアプリの場合、このように汎用ボタンではなく、訴求を高めたいボタンが用意されることがあります。
具体的には課金系の導線に多いです。
訴求させたいボタンと汎用的なボタンデザインとで違う要素は以下の３つです。
- ボタンの色を変える
- ボタンの中にアイコンなどのグラフィックを含める
- ボタンのサイズが大きくする
それぞれ補足します。
1：ボタンの色が違う
「汎用的なUIパーツを作るのは得意だけど、ルールから外れるボタンを作るのは怖い！」といっても色差分を作ることは比較的ハードルが低いはず。
基本的には訴求したい方の色を強く目立たせれば良いです。
「キャラバンストーリーズ」の場合、汎用ボタンは背景とボタンとが同じ色です。
それに対して目立たせたいボタンは黄色くデザインになっています。
単純に黄色にするのが良い、というわけではありません。
目立つかどうかは背景色との比較です。
あくまで「キャラバンストーリーズ」の場合は黄色で強調していた、という認識でいると良いかと思います。
2：ボタンの中にアイコンなどのグラフィックが含まれている
汎用ボタンと異なる点の一つとして、ボタンの中にグラフィックの要素の有無があります。
このようにして「読ませる」から「ぱっと見のビジュアルで視線を誘導する」という手法を取っています。
おそらくこれはシステム１を利用して先に脳の処理をそっちに持っていくように誘導しているようにうかがえます。
また、このように色数を多くしたり、キラキラした質感でコンテンツの価値を高めようとしているデザインもあります。
▲キラキラしてて価値があるように見せている
3:ボタンのサイズが大きい
３つめはサイズによる訴求です。
汎用サイズよりも少し大きくするなどして目立たせるデザインです。
大きくする際は基準サイズの150％や200％など、きれいな割合を用いることが多いです。
本当にユニークな素材であればもっと自由にデザインすることもあります。
しかしあまり特殊ルールがまかり通るとそれはそれで運用時に困ることになるので、サイズのバリエーションを作る際は慎重になった方が良いかと思います。
以上です。
まとめると
- 訴求を高めたい箇所では汎用的なボタンと差別化するデザインが用いられます
汎用的なボタンデザインと異なる要素は以下の3つです。
- ボタンの色を変える
- ボタンの中にアイコンなどのグラフィックを含める
- ボタンのサイズが大きくする
日本のソシャゲのＵＩの設計思想は訴求がベースにありました。
そのため、訴求したいボタンをデザインすることに対しては、webと比較してグラフィカル要素が強かったり、大胆な手法を取ることに発展してきました。
汎用ボタン以外のボタンのバリエーションを作ることに対して慎重になる傾向がある方の参考になればと思います。
