こんにちは!ちょこです!
今回は「ソード&ブレイド」のアドベンチャーパートを事例に、選択肢が表示される位置について紹介します。
アドベンチャーパートのデザインを検討する際に参考になれば幸いです。
こちらが「ソード&ブレイド」のアドベンチャーパートの画面です。
選択肢はこの位置ですね。
画面右下に配置されていることが分かるかと思います。
この配置のメリットとしては…
- 選択肢が押しやすい
- 次に進むようなデザインになっている
- メッセージの流れに沿っているので、視線に止まりやすい
- キャラクターのグラフィックと選択肢が被らない
などでしょうか。少し補足します。
1:選択肢が押しやすい
選択肢が押しやすいと考えた理由ですが、選択肢が画面中央に表示されているデザインと比較しての感想です。
画面中央に選択肢が表示されるデザインのメリットはどちらの指でも押せることです。
それ故にどちらの指からも遠くなってしまいます。
画面右下に選択肢があることによって、右手で押しやすい配置になっています。
▲例えば「サクラ革命」では画面中央に選択肢が配置されています
逆に「左手から押しづらくなっているのでは?」と思うかもしれませんが、実は選択肢以外の場所をタップしてもストーリーは進行します。
ですので、左手で画面上の適当な位置をタップしても特に問題ありません。(ユーザーの誤解を招きそうなデザインかもしれませんが…)
▲どこをタップしても選択肢を選んだことになり、物語は進行します
2:次に進むようなデザインになっている
選択肢が右にあることによって、次の画面に進むような印象を持つ件については、iOSのガイドラインにも基づくものですね。
右側に肯定的なボタンを配置する、という話です。
3:メッセージの流れに沿っているので、視線に止まりやすい
メッセージを読む流れに沿って選択肢が目に入る配置になっていることも重要です。
目に入りやすい位置にすることによってユーザーの認知コストも抑えられます。
4:キャラクターのグラフィックと選択肢が被らない
選択肢とキャラクターのグラフィックが被らないことも良い点かな、と考えます。
選択肢がキャラクターの顔などと被ってしまうと、没入感の阻害に繋がりかねません。
顔が隠れることについて、詳細な表情が見れなくなってしまう恐れがあります。
選択肢を見せたい場面ではあるのですが、コンシューマのレイアウトのままでもあるため、スマホに最適化されていないデザインとも言えます。
▲例えば「ヒプノシスマイク -A.R.B-」では選択肢とキャラクターのグラフィックが被ることがある
▲「サクラ革命」でも選択肢とキャラクターのグラフィックが被ることがある
以上です。
「ソード&ブレイド」のアドベンチャーパートは横画面のデザインです。
横画面だと画面の左右に余白が生まれやすくなります。
また、余白があるからと言ってキャラクターが横に並ぶ構図もありません。
正面に一人だけ表示するデザインです。
したがって、選択肢が画面横に配置されていても、キャラクターと選択肢が被ることはありません。
選択肢を選ぶことに対して、強く訴求したい場合、目に留まりやすい画面中央付近に配置することが多かったかと思います。
ただ、コンシューマと比較すると、ソシャゲの場合はシナリオ分岐などもないため、選択肢の重要度はさほど高くありません。
そうなると相対的にキャラクターのグラフィックの優先度が高まり、選択肢は画面端に配置する、という考えになるのかもしれません。
ちなみに、同じような思想のデザインは「アッシュアームズ」でも見られました。
選択肢よりもキャラクターの表示を優先している様子がうかがえます。
▲「アッシュアームズ」ではキャラクターを避けるように左右に選択肢が表示されます
今までのメンタルモデルとは異なったデザインで戸惑うかもしれませんが、当たり前を見直すことによって新しいデザインが開拓できるのかもしれません。
斬新なアドベンチャーパートのデザインを検討する際の参考になれば幸いです。