OPTPiX SpriteStudio で作るユニークな試合演出 …『ビーナスイレブンびびっど!』における導入事例 | GameBusiness.jp

OPTPiX SpriteStudio で作るユニークな試合演出 …『ビーナスイレブンびびっど!』における導入事例

『ビーナスイレブンびびっど!』のサッカーという枠ではとらえきれない時もあるユニークな演出の数々が「OPTPiX SpriteStudio」でどのように生み出されているのか、アメージングの皆さんにお話を伺いました。

ゲーム開発 ミドルウェア
OPTPiX SpriteStudio で作るユニークな試合演出 …『ビーナスイレブンびびっど!』における導入事例
  • OPTPiX SpriteStudio で作るユニークな試合演出 …『ビーナスイレブンびびっど!』における導入事例
  • OPTPiX SpriteStudio で作るユニークな試合演出 …『ビーナスイレブンびびっど!』における導入事例
  • OPTPiX SpriteStudio で作るユニークな試合演出 …『ビーナスイレブンびびっど!』における導入事例
  • OPTPiX SpriteStudio で作るユニークな試合演出 …『ビーナスイレブンびびっど!』における導入事例
  • OPTPiX SpriteStudio で作るユニークな試合演出 …『ビーナスイレブンびびっど!』における導入事例
  • OPTPiX SpriteStudio で作るユニークな試合演出 …『ビーナスイレブンびびっど!』における導入事例
  • OPTPiX SpriteStudio で作るユニークな試合演出 …『ビーナスイレブンびびっど!』における導入事例
  • OPTPiX SpriteStudio で作るユニークな試合演出 …『ビーナスイレブンびびっど!』における導入事例
今年でサービス開始から4年目を迎える美少女サッカー育成ゲーム、『ビーナスイレブンびびっど!』は株式会社アメージングから配信され、開発当初からウェブテクノロジ社のアニメーションツール「OPTPiX SpriteStudio」を使用しています。

サッカーという枠ではとらえきれない時もあるユニークな演出の数々がどのように生み出されているのか、アメージングの皆さんにお話を伺いました。

【インタビュー・ライティング:HATA】

ーー最初に自己紹介をお願いします。


村本氏村本です。アメージング創業当初からのメンバーで、元々開発もしていましたが、今は営業や広報などを担当しています。


両川氏両川です。企画開発部グラフィックデザイン課でデザインを担当しています。


金田氏金田です。同じく、企画開発部グラフィックデザイン課でデザインを担当しています。

ーー早速ですが、アメージングとはどんな会社なんでしょうか。

村本氏2002年創業の会社で、家庭用ゲームの受託からスタートしました。i-modeアプリや携帯ゲーム機の受託開発など、その時々の時流に沿った開発を行ってきました。自社でも2009年あたりからモバイルソーシャルに進出し、今はスマートフォンアプリの開発と運営を主戦場にしています。

スマートフォンでのゲーム開発は、それまでに培った家庭用ゲーム開発のノウハウやi-mode時代の容量圧縮ノウハウなどが活きています。

開発メンバーは10年来のベテランもいれば、この2~3年入社のメンバーもいるので年齢層も幅広いですね。


『ビーナスイレブンびびっど!』とは
プレイヤーは、美少女サッカークラブのオーナーとして試合の監督、選手育成、クラブの経営と、いろいろな要素を通じて最強のクラブチームを目指していきます。
登場する美少女選手は400名以上で、すべての選手に専用シナリオと専用ボイスが実装されています。それだけキャラクターが登場し、サッカーの試合に臨むのですが、この試合のモーションや演出を『OPTPiX SpriteStudio(以下、SpriteStudio)』が担っています。

ーー『ビーナスイレブンびびっど!(以下、『びびび』)』では、どういう経緯で SpriteStudio を導入するに至ったのでしょうか


村本氏『びびび』開発以前から存在は知っていました。というのは、受託開発を行っていたころに、 『OPTPiX imesta』 を使用していたことがきっかけです。

OPTPiX imesta を作っている会社が SpriteStudio というツールを作るらしい。というのをGTMFなどのカンファレンスで聞き、社内で検討しました。もともと、どうせ使うなら、コンシューマゲームの受託開発時代に使っていたツールに近いツールを使いたい、という考えがあって。当時、これは流れてしまったのですが、Cocos2d-xでの環境で開発していたタイトルで実地検証をしていました。その後にに改めて『びびび』チームでも検討し、現在に至ります。

1.5日で1アニメーションの制作ペース


ーーでは、『びびび』での具体的な制作の流れを教えてください。

村本氏『びびび』では、各選手の衣装ごとにスキルが付与されているので、その衣装のイメージに合わせたスキルを考えて制作しています。

衣装のデザインはイラストレータが担当するのですが、衣装ごとのスキルについては、若手中心のアニメーションチームが担当しています。コラボ企画などもあり、様々な演出を作成しています。

金田氏イベントの立ち絵と各キャラの衣装スキルを、絵コンテで起こしてからSpriteStudioでアニメーション制作しています。

オウムの衣装をまとって...スライディング?

ヘリ、そしてミニガン。これでもスライディングという...!

両川氏まずどういうスキルを持っているのかを決めてから絵コンテを起こしてアニメーション制作にとりかかります。絵コンテがあると、ビーナスイレブンのチーム内で情報共有できるので制作速度も上がり、演出の構成要素を共通化することもできました。

村本氏1つのイベントで10キャラ前後と衣装があるのでイベントごとに制作をしています。先程、若手中心とお話しましたが、このコンテのように、メカ的な演出があるときは30代の男性スタッフによるものです。これまでのアニメーションを合計すると、1,000本くらい作成しています。 キャラクターの数 × 衣装の数なので。その積み重ねの結果が、演出のバリエーションであり、『びびび』の魅力と言えます。

ーー1,000本! すごい数ですね。 ということは制作ペースも...

金田氏今は1.5日に1本作るペースで進めていますね。その分、アイデア出しの段階で「そのネタは前にも見た」という指摘が出るくらい、アイデア出しでは苦労しています。

両川氏アニメの中で作る部分を共通化できたことも、このペースを維持できる要因ですね。

村本氏過去の積み重ねたリソースの応用や最適化が進んだ結果なのかなと。

1,000本のアニメーション、そのデータの中身


ーー1,000本のアニメーションデータがアプリに格納されるとなると、そのデータの作り方も気になります。

金田氏やはり、容量の問題もあるので、衣装については、256*256の3枚の容量に落とし込んでアニメーションを制作しています。



『#オウムと#ダンス(はぁと)』用セルマップ。256x256の3枚のテクスチャに分解されている

ーーセルマップを見た感じだと、キャラクター自体のデータは別で管理されているんですね。

金田氏キャラクターの動きは個別で作っておいて、その上に衣装のセルが重なるイメージです。

両川氏走るアニメーションとかシュートについては共通部品としてインスタンスにしています。また、過去に登場したスキルのアニメーションもライブラリ化しているんです。もちろん、それらも全て SpriteStudio のインスタンスになっています。


セルマップ中央下の顔と吹き出しは、動画配信を表している...と気づくのに数秒かかりました

自撮りしてるけど、この後スライディングに向かうという...

コッポラの名作『地獄の黙示録』のパロディ。渋いチョイス!


かと思うと可愛さに全フリしたバレンタイン演出。かき混ざるチョコの頂点変形に、リリカルな背景アニメーションが見どころ

ーーこう見ていくと、テンポの良いアニメーションばかりですね。

村本氏ヌルヌルと動くより、キレのある動きにしようとしていますね。面白い動きを重視しているというか

金田氏最近は、ちゃんとボールを蹴ってシュートしているアニメーションがないですね。

村本氏車でボールをはねてシュートとかね(笑)

SpriteStudio は、「かんたん」


ーーアニメーションの制作自体は、共通化でテンポよく作られているとのことですが、SpriteStudioの習得難易度は、いかがでしょうか。

村本氏私は3Dツールの経験あったのですが、『びびび』チームには他のツールを使用した経験が無い子も多かったので...

両川氏最初の頃こそ、SpriteStudio に慣れていないスタッフが、パーツ同士の親子付けをしていていなかったり、腕などの回転時に必要な座標設定を忘れてしまったままアニメーションを作り始めて事故になるケースがありました(笑) SpriteStudio 自体は、かんたんなツールだとは思いますが、ノウハウの共有は必要でしたね。

ーー OPTPIX ヘルプセンターや、「SpriteStudio ビギナーズ」は、お役に立ちましたか?

金田氏ビギナーズガイドは、社内で回覧しています(笑)

両川氏私のほうでもビギナーズガイドを読んで、教える係としてフォローしています。他にも、SpriteStudio 内の「?」マークを押すと説明をしてくれて理解できるようになっていますから助かりますね。

マニュアルのような体裁だと、身構えてしまう人もいますし、そもそもマニュアルは読まない人もいるので...その点、ビギナーズガイドは分かりやすかった

金田氏わたしたちのスキル制作メンバーに映像制作の経験者が少なかったのですが、直感的に使うことができるアニメーションツールだったのはよかったですね。

村本氏強いて言うなら、「逆引き」コンテンツを充実してほしい。

ーー動画コンテンツのようなものではなく?

両川氏動画での機能紹介だと、どうしても視聴自体に時間がかかってしまうので...

ーー参考になります!

『びびび』を未来永劫続くコンテンツにするために!


ーーさて、そんな『びびび』ですが... お使いの SpriteStudio のバージョンは?

村本氏確か...Ver.5.5ですね(笑)

ーーなんと、Ver.5系の最終版 Ver.5.8.3 ですら無いと!

村本氏何しろ開発開始から5年も経っているのもあって...あ、開発の人間を召喚しましょう(ここで、企画開発部の高見氏が登場)

ーー高見さん改めてよろしくお願いします。『びびび』で使われている SpriteStudio のバージョンが古い件です

高見氏内部のRuntimeを移行するのにコストが掛かりそう、長期運営中のタイトルなので触りたくないというのが本音です(笑)

でも、SpriteStudio の Unity用Runtime(*) のバージョンも上がっているそうなので、『びびび』開発中に発生して、アメージングの中で修正した問題も全て解決しているわけですね。
(*) Unity用Runtime:SS6Player for Unity のこと。GitHubで公開中!

金田氏デザイナー陣としても、SpriteStudio Ver.6 の「ボーン」や「メッシュ」を使いたいんですけど...

村本氏ゲームエンジンとして採用している、Unityのバージョンと一緒に移行する必要もあるし...実は、『びびび』自体は、この4年間の間に7回も大掛かりなアップデートをしていて、かなり手は入れています、未来永劫続くコンテンツにするために! ですので、今は難しいですが...

ーーでは、次回の大掛かりなアップデートの際にでも!

村本氏次回作には導入したいですね。『ビーナスイレブン2020』みたいな(笑)

ーー今日はどうもありがとうございました。

Unity用Runtime、SS6PlayerForUnityをgithubで公開中!


最新の SpriteStudio である、OPTPiX SpriteStudio Ver.6.2 に対応した Unity用Runtimeを公開しています。以下のURLも、ぜひチェックしてみてください。

■OPTPiX SpriteStudio : https://www.webtech.co.jp/spritestudio/
■SpriteStudio GitHub : https://github.com/SpriteStudio
■株式会社ウェブテクノロジ : https://www.webtech.co.jp/

株式会社ウェブテクノロジでは、『クリエイターを笑顔に』をモットーに、開発メンバーを募集しています。お気軽にご応募ください。

■株式会社ウェブテクノロジ キャリア採用 : 
https://www.webtech.co.jp/company/career.html

好評につき期間延長!OPTPiX SpriteStudio 10%OFFセール実施中!


Ver.6.3のリリース記念、プロフェッショナルライセンス新規購入10%OFFキャンペーンを9/30まで延長いたします。プロフェッショナルライセンス 12か月サブスクリプションの新規・追加購入限定です。詳しくは公式サイトにてご確認ください。

《HATA》

関連ニュース

特集

人気ニュースランキングや特集をお届け…メルマガ会員はこちら