ゲームアプリのUIデザイン

プレイしたゲームアプリのUIデザインに関して書き残します。毎日頑張って更新!

「ソード&ブレイド」はやくゲームを開始してもらいたいので、アバター作成画面では選択肢を絞るデザイン

こんにちは!ちょこです!

このブログでは「ゲームのUIを見てみましょう」というテーマでゲームを紹介しています。

 

今回は5xgamesからリリースされている「ソード&ブレイド」のアバター作成機能を紹介します。

 

「ソード&ブレイド」はジャンル的にはMMORPGに該当します。
MMORPGらしく、ゲームを開始する前に自身のアバターを作成する画面があります。

 

ゲームによってはキャラクターの体系を細かく設定できたり、ボイスを設定できるものがあったりしますが、「ソード&ブレイド」では顔回りに対して細かい設定が行えるのが特徴的だと感じました。

 

早速見ていきましょう。該当の画面はこちらです。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

 

アバター作成画面では以下の6つのカテゴリに分けられていました。

 

 

1:プリセット選択

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

あらかじめ決めておいたキャラクターのセットが用意されています。
これを元に各パーツを編集する感じですね。

ユーザー全員がアバターをカスタムすることに興味があるわけではありません。

また、カスタムするのが好きなユーザーであっても、ゼロからアバターを組んでいくのは手間に感じます。

あらかじめ組まれたセットが用意されていることによって、ユーザーの認知コストや学習コストが軽減されるのではないかと考えます。

 

 

2:髪型

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

選択する門派にもよるのかもですが、この門派のキャラクターの場合は髪型が9種類、髪色が4系統、明度差の差分が15種類ありました。

 

それぞれどのような設定ができたのか動画で紹介します。

髪型はこんな感じですね。 
短い髪、長い髪、結びなど、多様なバリエーションがあります。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

 

髪の色はこんな感じですね。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

 

これを見て「え?選べる色少なくない?」と思う方もいると思うので補足します。
ゲームを始めてしばらくすると髪の色は詳細に決めることができます。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆
 

開発者の意図は図りかねますが、ゲームを始める前に詳細にアバターが設定できてしまうとキャラクリエイトに時間をかけてしまい、ゲームを始められないユーザーがいるかもしれません。

なので、ゲームを開始前のアバター作成画面では、ある程度選択肢を絞っているのかな、と推測します。

 

3:顔

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

 

続いて顔パーツです。
顔パーツは6パターンあります。
化粧も込みで色んなパターンがありますね。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

 

表情も6パターン確認できます。
無表情と喜怒哀楽、あとは驚く、で6パターンですね。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

 

 

4:瞳孔

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

 

瞳孔の設定もできます。
「ソード&ブレイド」でのアバター作成画面でこの設定が特徴的だと感じました。

瞳の色だけではなく瞳孔の形状がデザインできます。
「ソード&ブレイド」ではカラコンに近いデザインが選べようになっています。

瞳孔のデザインは全部で9種類ありました。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

 

色のバリエーションも豊富です。
2色が1セットになっており、8セット用意されています。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

 

しかも瞳孔のデザインによって、色の組み合わせも変わります。
例えばこの宝石のような瞳孔の色のバリエーションは以下です。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

 

その隣の瞳孔のデザインの場合は、また違った色のバリエーションが用意されています。
◆◆◆◆◆◆◆◆◆◆◆◆◆◆

 

 

瞳孔のバリエーションをアニメーションで紹介します。
瞳孔のデザインだけでキャラクターの印象がガラッと変わるかと思います。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

 

いくつかの瞳孔で色のバリエーションも紹介します。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

 

 

 

蛇のような瞳孔の色バリエーションはこのようになっています。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

 

白目が黒になる瞳孔デザインは強力なインパクトがありますね。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

 

 

 

5:衣装

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

衣装はプリセットで見られたものですね。
シルエットに大きな変化はありませんが、袖の長さ、帯のデザインなどに違いが見られます。 

 

6:衣装試着

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

 

更に衣装に差分がありました。
なぜか先ほどの衣装の設定と分かれています。こちらの方がデザインのバリエーションとしては豊富です。

 

以下は衣装を切り替えたときのアニメーションです。
衣装のシルエットや色など、大きくデザインパターンが異なる衣装が4種類あります。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆




以上、「ソード&ブレイド」のアバター作成画面の紹介でした。

 

この画面では確かにアバターを作成ことが目的ですが、ゲームを開始することも重要な目的です。
「ソード&ブレイド」ではゲーム開始前のアバターの作成時には髪の色などの選択肢の幅をあえて絞り、ゲーム開始を優先するデザインに感じました。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

どうぶつの森シリーズのように世界観やキャラクターに愛着を持つなり、進行に合わせて自由度を増していくと、ゲームを進めるモチベーションにも繋がるかもしれません。

 

ただ、ゲームを開始する前に「ゲーム内でカスタマイズの自由度が高まる」という情報は伝えづらいので、もしかしたら最初の画面だけでアバターをカスタマイズする自由度を判断するユーザーがいるかもしれないな、と感じました。

 

多くの情報を不特定に伝える中で、何を優先して情報を組み立てるかは難しいところですが、目的が分かりやすいデザインでだと感じました。

 

アバター作成画面をデザインする際のデザインの参考になれば幸いです。