『ドラゴンボール ゼノバース2』の画面で説明しますが特に意味はありません。説明に使えそうな画面を探しただけです。

 

 

よくUI画面を作成する時、テキストはこのような感じで作ると思います。全て最大文字数、最大桁数。

これでプログラマーに渡すとプログラマーは困ってしまいます。

何が困るか。

その文字は左揃えですか? 右揃えですか? それとも中央揃えですか? 購入不可の時はどうなりますか? 購入不可のアイテムを押したらどうなりますか? スクロールバーがいらない場合はその分リストの位置を右にずらしますか?

プログラマーから嵐のような質問が飛んできてしまいます。

 

もちろんUI指示書を書くと思います。この画像を貼って色々指示を書き加えていく。しかしそれは優しくありません。

小説のように文字だけのものならしっかり文字を読みますが、人は画像があると画像を9割、説明テキストを1割くらいで読みます(個人的感覚)。どんなに説明テキストを書き込んでもサッとしか読まれません。

なので私はUI指示書は画像で分かるようにしています。最大文字数、最大桁数を一つ用意したら、他を、通常プレイで表示されるであろう文言に変更して画面を作成しています。

 

 

右揃えか左揃えか中央揃えか分かりやすくなったかと思います。

アイテムの説明文などは一行と一文字減らしただけで上左揃えということが分かります(中左揃えの場合もあるので)。

※テキストを入れる時、アイテム名や値段などは仮で構いませんが、必ずUI的に矛盾が無いようにした方が良いです。例えば所持金が不足しているのに購入可能になっている、などはNG。混乱します。

 

UI指示書にはまず上の画像を貼って、完成イメージを見られるようにします。そして次に補足説明を付け足した画像を貼ります。

 

 

全てをこの1枚で説明するのではなく、ゴチャゴチャしてきたら見やすいように分けて説明します。

 

とにかくプログラマーに喜ばれるUI指示書を。

理想は画像を9割、説明テキストを1割。

目指したいです。