3分で読めます
ルーレットの色を8区画それぞれ個別に決めるときの、順番と注意点
この記事は 時点の管理画面(/campaigns/[id]/appearance)を確認して書いています。
アプリの更新により画面が変わっている場合があります。
テーマを選ぶと配色が一括で決まりますが、そこから個別に変えられます。設定できる箇所は多く、細かく作り込めます。
変えられる箇所
まず全体の要素です。
- 背景
- フォームボタン
- ポインター
- ルーレットの枠線
- 中央
- 中央円の枠線
- 閉じるアイコン
- 文字色
さらに、ルーレットの8区画それぞれに、区画の色と文字色を設定できます。合計するとかなりの数になります。
先に決めるのは3つ
すべてを最初から調整すると迷います。効果が大きい順に3つだけ決めてください。
1. 背景。 ルーレット全体の印象を決めます。ショップの雰囲気に合う色にします。
2. ポインター。 どこに止まったかを示す部品です。背景や区画と同系色だと見えなくなります。背景とも区画とも違う色にしてください。
3. 区画の文字色。 ここが読めないと、何が当たったのか分かりません。
残りはテーマの初期値のままでも成立します。
区画の色は交互に
8区画は当たりとハズレが交互に並びます。隣り合う区画が似た色だと、境目が分からなくなります。
濃い色と薄い色を交互に置くのが基本です。同系色でも明度を変えれば区別できます。
区画ごとに文字色も設定できるので、濃い区画には白、薄い区画には濃い文字色を割り当ててください。すべて白文字にすると、薄い区画で読めなくなります。
当たりを目立たせすぎない
大きい特典の区画だけ派手にしたくなりますが、おすすめしません。
止まる前から「あそこが大当たり」と分かると、そこに止まらなかったときの落差が大きくなります。どの区画も同じくらいの存在感にしておくほうが、結果を受け入れてもらいやすくなります。
ルーレットの位置
色とは別に、ルーレットを画面のどこに出すかも設定できます。
パネルを開くボタンと同じ側に寄せると重なります。ボタンの位置を確認してから決めてください。
テーマを変えると上書きされます
ここが注意点です。テーマを切り替えると、色の設定はそのテーマの配色に置き換わります。
季節ごとにテーマを変える運用にしていると、そのたびに調整し直すことになります。細かく色を作り込むなら、テーマは固定してください。
逆に、テーマを季節で回すなら、色の微調整は最小限にしておくほうが手間が少なくなります。
実際の店舗で確認する
設定画面のプレビューは、ルーレット単体の表示です。ショップの背景の上に重なった状態ではありません。
背景色が薄いテーマを使っているショップでは、ルーレットの背景と店舗の背景が近い色になり、輪郭が曖昧になることがあります。保存したら実際の店舗で開いて確認してください。 スマホでも一度見ておくと安心です。
まとめ
背景・ポインター・区画の文字色の3つを決めれば、見た目はひととおり整います。
区画は濃淡を交互にし、文字色は区画ごとに合わせてください。テーマを変えると色設定は上書きされるので、作り込むならテーマは固定するのが前提です。