こんにちは、「アプリゲームUIデザイン」のちょこきなこです。
今日はちょっとゆるめの話。
なめこ。
なんていうんでしょうね、
こういうイラストとUIを合致させようとするデザインジャンル。
拡張性に乏しく限定的なデザインになりがちなので、ソシャゲに用いるにはあまりオススメしないデザインだと思っています。
さて、このメニューの場合、
なめこフィギュア、おかいもの、ライセンスカード、設定、図鑑、その他、と色々なメニューがあるのですがやはり苦しいデザインになっています。
特に「設定」と「その他」です。
確かに設定のメニューは歯車アイコンになっていたり、スパナになっていることが多いです。
ですが、部屋にある物体として歯車があったら唐突すぎて違和感を感じてしまいます。
こうなるとデザインとして中途半端になってしまい、なぜこのデザインコンセプトにしたのか根底の部分から説明できなくなってしまいます。
確かに、その空間にあるものでメニューUIを構築するのは見た目にもにぎやかで、いかにもゲームらしいのですが、結果的にまとめることができないのであれば、考え直した方が良いと思います。
設定メニューの場合はおそらく後から追加になったのだと思いますが、そういった仕様変更にも柔軟に対応できるデザインを考慮しなければならないので、難易度的にはかなり難しい部類です。
次にその他のデザインが虫眼鏡になっている件ですが、これは「その他」がなぜ虫眼鏡になっているのか結び付けられません。
この時点では「その他」の項目の内容が不明ですし、一般的なその他メニューのアイコンは「・・・」と三点リーダーのようなデザインになりがちです。
発想としては虫眼鏡⇒詳細⇒深い階層を見る⇒このメニューの下位階層の遷移する⇒その他
とも取れなくもないですが、ユーザーはそこまで連想する以前に、シンプルに文字列だけ見て判断してしまいます。
そうなると虫眼鏡のグラフィックの役割はあるのだろうか、となり結果的に意味のないデザインになってしまいます。
じゃあ、どうすれば良いのかを考えるのですが、まずデザインありきなので、その制限を開発側に守ってもらう前提があります。
その前提の上でできることをやる、という話です。
いくつか紹介してみますね。
▲『戦国姫譚MURAMASA-雅-』
例えばこのようなショップデザインをしたとします。この場合、セールをしようとしたり、何か販売品を増やそうとした場合、単純なボタン追加では済まず、背景の素材を書き直す必要が生まれます。
また、画面内に配置できる要素の数には限りが生まれるので、その要素の優先順位もかなりシビアに判断する必要があります。
▲『デモンズゲート 帝都審神大戦 ~東京黙示録編~』
こちらも似たようなものです。背景と馴染みすぎてどこがボタンなのか一見して不明になりますが、それはそれとして、世界観にマッチさせてよくできていると思います。
ですが多少のレイアウト調整もままならないので、かなり運用しづらくなっていたと思います。
で、個人的に正解だと思うデザインを紹介します。
▲『がんばれゴエモン!からくり道中』
古っ!
ゴエモンシリーズの第1作目です。
いわゆるショップ画面ですが、
この「棚に商品が並んで、値札が貼られてる感!」
深く考えなくてもお店って分かる!
例が古くて申し訳ないのですが、結果的にはこういう感じにならざるを得なくなるんじゃないかな、と思います。
デザインを優先させすぎるとビジュアルは良いかもしれませんが、陳列数などの表示する情報には制限が生まれやすくなります。
その制限の中で上手に運用をしてもらうデザインを目指すことになります。
さて、なめこに戻りますが
画面のデザインをするにあたっては「研究室の中にその他があるのはどういう意味なのか?」「それは現実の研修室にあるものなのか?」などきちんと話し合って決める必要があります。
当然ですが「研究室にないメニューはこの画面には入れられません」となるので、それが実行できる環境はかなり限られます。
仮に一つの画面で実行できたとしても、全体で見たときにちぐはぐなデザインになっては意味がありません。
なので、手法としては面白いのですが、短期スパンで運用し続けるソーシャルゲームの土壌にはなかなか難しいんじゃないかな、と思います。