ヘヴィゲーマーの俺がソーシャルアプリ開発に挑戦してみた|後編

前回のエントリーとあわせてドゾ。
ヘヴィゲーマーの俺がソーシャルアプリ制作に挑戦してみた|前編

さて、前編に書いた感じで大層な目標を掲げたので、もちろん中身もそれに伴うようじっくりコトコト考えまくりました。
RPGといえばやはり前述の通り、バトルや成長システム、ストーリーがメインの楽しみとなるはずですが、ソーシャルアプリの中でもRPGとカテゴライズされるものは、成長システムは基本的にレベルアップで得られるポイントを割り振るような感じで、バトルなんかは実行した瞬間に「勝利」「敗北」が決定され、その演出が流れるだけのものがほとんどでした。ストーリーも「シナリオ」というよりはゲームの世界観を表すあらすじとバックグラウンドが用意されている程度のものがほとんどでしょう。


やはり、RPGの華はバトルだ!ということで、最も力を入れる部分としてターゲットしました。
最初に企画書として打ち出した内容を紹介します。(サーバー処理や計算式等の詳細部分は省略します)


プレイヤーキャラクター(アバター)と、仲間となるドラゴンがタッグで戦うというもので、攻撃はリアルタイムで行われる。攻撃を続けるとTPゲージが上昇し、満タンになったら任意のタイミングで必殺のブレス攻撃が放てる、といった具体だ。
戦闘は2on2のプレイヤー同士の対戦と、クエストなどでモンスターのみで戦う2on1。
従来の「戦闘が始まった瞬間に勝利/敗北演出が表示されておわり」というバトルがどうしても納得いかなかったので、リアルタイムで戦闘の過程が描かれるというものを表現したかった。
加えて、アバターは武器・盾・頭・胴・脚のそれぞれの装備によってグラフィックが変化し、さらにそのアバターとドラゴンはそれぞれ攻撃時にアニメーションする。
もはやこれだけでも無謀だ。なぜならフィーチャーフォン向けのリッチな表現はFlash Liteで行う。それだけならいいが、端末側のブラウザの仕様として、1ページあたり100kbまでしか表現できないのだ。
そんな中でこれだけの量のアバターパーツとアニメーション用のパーツ、さらにUI用画像、背景…。ぶっちゃけ自分で書いておいて気が遠くなるような感じだったが、これを実現できれば他のアプリと大きく差別化できると考えた。

そもそもこれくらいの仕様ならコンシューマやスマートフォンのゲームアプリあたりではありふれたものだ。
では何故他社はこれをやらないのか?という話になったが、実現不可能か、あるいはコストが見合わないから。またはその両方の可能性もあるので、もう少し実現性の高い仕様にしてはどうかという流れになったが、せめてビジュアル面だけでも実現したかったのでなんとか押し通した。

…と決まれば欲がでるもので、追加仕様で「装備したアイテム(回復・強化用)を任意のタイミングで一回だけ使用できる」というものを入れようと思ったのが上の画面イメージ。
ただ、様々なアイテムを用意するとして、その効果を実行する処理やエフェクトの事を考えると、ただでさえ低い実現度がさらに乱高下するので、制作に取り掛かる前に自分の判断で結局見送る事にした。

制作に取り掛かる前に、実際の動作イメージを伝えるため、画像素材を用意しFlashのフレームアニメーションでサンプルを作成したのが上の画像だ。
アバターの攻撃モーションは約10フレーム。ドラゴンは待機時に3枚の画像で息づかいをアニメーションし、攻撃時に専用の画像に切り替わる。
で、これを実機で再生してみたところ、かなり重い…。30FPSだったものが3〜4FPSくらいまでに低下している。
周りは「あー…」という感じの反応だったが、最終的には各パーツ画像をサーバから呼び出し、動作もActionScriptで実行するため、フレームアニメーションと本番用の処理ではまた違うので軽くなる可能性はある!ということでそのまま断行することにした。

次に、攻撃時のエフェクトを入れてみた。前のサンプルではエフェクトを省略していたのもあり、槍で「ちょん…ちょん…」と突っついている感じだったのに対し、今回は剣の軌跡と敵側に斬撃のエフェクトを入れることで派手さを出し、想定していた本来のアニメーションを表現した。前回のサンプルで意気消沈気味になった周りをちょっと盛り上げようという意図もあった。
ちなみにこの時点でドラゴンの待機アニメーションを省略した。グラフィックを描くのは自分だったので、手間を考えると目眩がしたのと、容量や処理の軽量化を考えるとまっ先に削れる部分だったからだ。

相変わらずフレームアニメーションのままだと激重だったが、パーツは埋め込みのままで試験的に動作をActionScriptに切り替えると若干、気持ち程度だが軽くなった気がした。
さらに、リアルタイムで敵味方の攻撃が入り乱れるというものを想定していたが、画面上に表示されている4体のキャラクターのうちどれかが攻撃処理を実行中の場合、他は待機状態となる処理を加えるとさらに軽くなった。とはいえまだ6〜7FPS程度だったのでまだまだ重苦しい感じなのだった。攻撃動作が複数キャラで同時に再生されると重くなるようだったが、リアルタイム感は維持したかったのでとりあえず待機処理は保留とした。(変更が効くようにパラメータで切り替え可能にしてもらった)


震災後、一ヶ月ほどプロジェクトは中止しており、4月に再開した時点でもまだ戦闘が実現可能かどうか怪しい状態だった。Flashとサーバ間でのパラメータの受け渡しや画像の切り替えはどうにか可能になりつつあった(これもpythonとGoogleAppEngineを使用していたため相当苦労した)が、重さ自体はどうにも解決の糸口が見つからなかった。
そこで、改めて他のアプリを触ったり色々調べたりしたところ、どうやら他のアプリは処理落ち前提でアニメーションを組んでいるらしい。それと、同時期になにかの記事でみたアニメの技術で、少ない枚数で躍動感のある動きを表現する技術のことを思い出した。そうだ、限界までフレーム数少なくすればいいんじゃね?と思い早速実行してみた。
そのサンプルがこれ。


さらに、ゲーム上での必要性に疑問があり、検討を続けていた装備部位としての「脚」を削除し、胴と一体化してレイヤー数、容量削減を図った。それに加えてアバターのドラゴンの「影」も削除した。半透明のパーツはただでさえ重いのだが、これを透過なしにしようかとも思ったが見栄え的に微妙だったので一思いに削除したのだった。
これによってFPSは9〜11程度まででるようになり、アニメ枚数を減らしたことにより体感的にも自然な感じになった。
その後、ブレスエフェクトや最終版の背景の仕様を決めたりし、考えうる全てのパターン(装備パーツ・ドラゴン・背景の表示組み合わせ)を検証した結果、なんとかある程度の余裕をもって94〜97kb程度に収めることに成功した。

 
左:初期サンプル  右:エフェクトを入れてみた頃のサンプル


最終版モーション(片手剣)

戦闘開始から戦闘終了までの流れが実行できるようになり、その後はGAE側での画像切替処理をなんとか固め、細かい調整を繰り返しリリース直前にバトル部分がFIXとなった次第です。
(Flashの画像切り替えはphpだと比較的楽なんだそうですが、GAEはかなり大変だったようです…ありがとうございました)

かくして頭の中で描いていた、携帯ソーシャルアプリにあるまじきリアルタイムバトルは完成したのでした。
今回は主にビジュアル部分について書いていますが、内部処理に関しても色々変更を入れてました。
最終的に与ダメージ被ダメージはもちろんとして、自分と敵での属性相性によるダメージ補正とクリティカル補正、装備部位ごとの耐久度計算、武器種・アバター性別ごとの攻撃モーションの切り替え、経過時間…他、などなど、コンシューマ並の処理をぶち込んでいて、他のアプリにはないすごく奥深いバトルシステムを作れたと思っています。バランス調整はその分難航しましたが…。


 
 
最終的な戦闘画面(実際には画面下部にメッセージウインドウがあります)

他にも、長編ストーリーの表現方法やクエストの仕組み、課金導線なども熟考に熟考を重ねた結果、想定していたよりもかなり大規模な内容になってしまいました。風呂敷を広げまくるのは自分の悪い癖なので、今回はリリースに漕ぎ着けたからいいものの、今後はミニマムで尖ったものを作っていきたいと考えています。


ちなみにFlash部分は(個人的に)カリスマFlasherと名高い青春Bの多口カタンさんに制作して頂きました。実は去年から二人でiPhoneアプリを制作していたのですが、ドラグーンをやることになり忙しくなりiPhoneアプリの方の開発が手付かずになってしまったので、Flashなら!ということでお誘いして協力して頂きました。こちらが至らない部分をプログラマーのクリエイティビティを発揮しまくり、逆に提案しまくって頂けて非常に助かりました。

サーバ関連等、開発は株式会社アドバンスネットワーク様に担当して頂きました。仙台に会社があるのでもちろん被災したのですが、社屋を移してまで業務を継続し、大変なスケジュールの中で見事ものにして頂けました。


スタイリッシュ土下座ぁぁっ!!ということで今回沢山勉強させていただいたので、今後もゲーム制作にチャレンジしていきたいところです。
そういえば震災の時、3月16日になってようやく自宅に戻ってから単身引っ越すまで2週間ほど水も電気もない生活を送りましたが、ぶっ壊れまくった自室から買ったばかりのニンテンドー3DSを発見して電池が切れるまでリッジレーサーで遊んだ時、色々な不安で頭がいっぱいになって頭が重苦しかったのがゲームで遊んでいる時だけすごく軽くなったのを強く覚えています。
サバイバル生活の中でも、やはり娯楽は必要なんだ!と改めて感動し、助けられたので今後も人が楽しんでくれるようなものを作り続けていきたいですね。


と、綺麗に締めてみました。
では!

Posted in . Bookmark the permalink. RSS feed for this post.
TRYCHEST. Powered by Blogger.

Pages - Menu

Search

Swedish Greys - a WordPress theme from Nordic Themepark. Converted by LiteThemes.com.