97年のゲームボーイ版に始まり、98年のワンダースワン版、00年代をゲームボーイカラー、10年代をニンテンドーDS・3DSと、長年続くロボットバトルRPG『メダロット』シリーズ。そのメダロットシリーズの最新作である『メダロットS』で、OPTPiX SpriteStudioが大活用されていると聞きまして、今回は同作の開発を手掛ける、SoWhatの皆さんにお話を伺いました。
■インタビュイー
●馬場一明氏
SoWhat 代表取締役。2015年に、イマジニアのグループ会社として同社を創業。代表取締役でありながら現役プログラマー。
●黒岩知己氏
『メダロットS』では、デザイナー。コンシューマゲームメーカーで某有名レースゲームのデバッグから入り3Dのデザイナーを勤めた後、ハンゲームでは2Dデザイナーに。退職後はSoWhat社の創業メンバーとして参画。
●松田賢氏
『メダロットS』では、プログラマー。SoWhat社では在籍4年目。もともとはゲーム業界以外のプログラマーだったそう。
ラベルと、ユーザーデータを駆使
――本日は、よろしくお願い致します。まずはじめに、OPTPiX SpriteStudio（以下、SpriteStudio）を採用しようと思った経緯を教えてください。
黒岩知己氏（以下、黒岩）自分自身は、Adobe Flashの経験があったので、まずFlashに似た操作性が馴染みやすかったこと、それに、日本語のチュートリアルが充実していたことが最初のきっかけです。「試しに作ってみよう」から「こんなこともできるかな」の繰り返しで、気がつけば、メダロットSのほぼすべてのシーンで、SpriteStudioを使っています。
――すべてのシーンで！
黒岩ええ、画面上で動いているものはすべて。あ、もちろんバトルシーンの3Dモデルは違うんですが、当初はこれも2Dで行こうと思っていたくらいなんです。残念ながら、早い段階で3Dで制作することになりましたが（笑）
メダロットたちも、SpriteStudioで制作する予定もあったとか。それはそれで見たかった…。
――デザイナーさん主導で、SpriteStudioの導入が決まったんですね。
松田賢氏（以下、松田）プログラマー側としても、SpriteStudioの出力データ形式に拡張性があった点で歓迎しましたよ。
――拡張性ですか、具体的には？
松田“ユーザーデータ”と、フレームコントロールの“ラベル”ですね。プログラム側では、プレイヤーの操作に応じて、アニメーションの特定フレームへのジャンプに、フレームコントロールの“ラベル”を活用しています。例えば、『タップ操作したらこのフレームにジャンプ』のような。タップして画面が転換のような、スクリプトとも連携させています。
黒岩先程もお話しました通り、メダロットSでは、ほぼすべてのシーンでのユーザーインターフェースとレイアウト、画面の演出や切り替えなどに活用していますが、UIに関して細かいところの話をすると、デザイナー側で、ユーザーデータにフォントの情報を詳細に記入することで、プログラマーの手間を大きく減らせました。
フォントの指定だけなく、フォントの「影」の指定も。
黒岩アニメーション上では、フォントの配置場所には、Nullパーツを置いておいて、実際のゲーム中でのフォントサイズの調整には、ユーザーデータの中に埋め込んだ“Fontsize”を参照するようにルール付けしています。これにより、プログラマー側ではユーザーデータの解釈だけ行うだけになりますので、デザイナーだけで完結できるようになっています。
先頭に“normal”、5フレーム目に“tap”、最終フレームに“disable”が設定されている。
上中下段のインスタンスと、その仕様書
――随分スッキリしている、このメニュー画面についてもご説明いただけますでしょうか。
黒岩メニュー画面は、上・中・下段と大きく3つに別れていて、それぞれのウインドウが、“インスタンス”になっています。上段のインスタンスである“Header”と、下段の“Footer”については、プログラム側で常に画面の上端と下端にフィットするようにコントロールしていますが、中段に表示されるウィンドウ群、“メダロット情報インスタンス”や“パーツ情報インスタンス”などについては、表示座標を“ユーザーデータ”に記入して制御しています。
動的な情報エリアには、“NULLパーツ”を配置しながら、
プログラム側からはパーツの名前を参照、値を表示している。
――しっかりした仕様書ですね。とはいえ、このインタビュー用にご用意いただいたのでは？（笑）
黒岩いいえ、この仕様書に沿って開発しています（笑） 画面の要素やコンセプトは、試作の段階から殆ど変わってないですね。仕様書自体の体裁を整えてはいますが。
松田繰り返しになりますが、プログラマー側は、かなり楽ができました（笑）
馬場一明氏（以下、馬場）自分も試しにこの仕様書を使って何画面か作ってみたんですが、すんなり作ることができました。たまに、”このボタンの名前が気に食わないなー”とかはあったんですが。
松田それは（笑） でも、この仕様書に準拠してさえおけば、画面が追加になったりした場合にも柔軟に作れるようになっています。
馬場そうそう、手戻りもほとんどなかったんじゃないかな。
黒岩この画面仕様書は作ってよかったね。
SpriteStudioらしい使い方も
――UIばっかりに話題がいってしまったのですが、ADVモードでのSpriteStudioの使い方を教えてください。
黒岩本来のSpriteStudioらしい使い方なんでしょうか、キャラクターの表情もパーツ分けしています。
松田ストーリーの進行自体はスクリプトで管理しています。そのスクリプトから、画面遷移やキャラクターの表情替えをコントロールしている格好です。このあたりは、アニメーションだけ用意してもらって、プログラマー側がメインでコントロールしています。
――ところで、画面タップした時に、タップ位置に表示されるアニメーションが格好いいですね。
黒岩ありがとうございます。あれは、メダロットのアイコンがモチーフになっています。
馬場これは仕様書には無かったような…。
黒岩つい動かしてみたくなるところが（SpriteStudioの）良さだとは思いますよ。このアニメーション、タップした瞬間に六角形が「くるん」って回るんですけど、タップしてる自分の指で見えなくなるのが残念です…。
――それはたしかに残念…。
――デザイナーさんにとって、「ここは頑張った！」というようなアニメーションはありますか？
黒岩バトルシーンの最初の演出ですね。この背景は、大きいパーツを“エフェクト機能”で動かしてます。
――これはエフェクト機能の良い使い方ですね、すごく参考になりそうな表現です。
――最後になりましたが、SoWhatさんという会社について、教えてください。
馬場2015年に創業した、イマジニアグループで唯一、ゲームの企画制作をしている会社です。私自身も、現役のプログラマーなので、技術者に対して特に理解がある会社だと思います。『メダロットS』は、2020年1月のサービス開始から、お陰様でご好評いただいています。 現在の社員数は20名くらいですが、事業拡大に伴い、一緒にゲームを作っていくメンバーを募集中です。ちょっと他の会社と違うのは、募集定員は特に設けておらず、広く、全ての職種で募集しています。新卒はもちろん、中途採用も絶賛募集中です。
――どういった方に来てもらいたいんでしょうか。
馬場『メダロットS』は、Cocos2d-xで開発しているのですが、今後は他のゲームエンジンでの開発も視野に入れています。今、会社にとって最良の選択をする上で、新しいことにチャレンジできる人、したい人は、どしどし門を叩いてもらいたいですね。
――本日はありがとうございました！
■メダロットSについて
今回、SpriteStudio採用事例インタビューにお答えくださいました、株式会社SoWhatさんが贈る『メダロットS』の公式サイトはこちらから！
●メダロットS公式サイト
https://medarotsha.jp/ms/
●株式会社SoWhat
https://www.sowhat-inc.com/
ウェブテクノロジについて
SpriteStudioというとキャラクターアニメーションを連想される方も多いと思いますが、UI（ユーザーインターフェース）部品のアニメーションの他、演出で活用されることも少なくありません。今回の『メダロットS』では、すべてのシーンでSpriteStudioを使ったアニメーション部品が動くという、とても嬉しい事例になりました。改めて、SoWhatさんに御礼申し上げます。●OPTPiX SpriteStudio
https://www.webtech.co.jp/spritestudio/
●株式会社ウェブテクノロジ
https://www.webtech.co.jp/
●OPTPiX SpriteStudioアニメーションコンテスト 特設ページ
「OPTPiX SpriteStudioクリエイター創作支援プロジェクト」としてアニメーションコンテストを実施中！コンテストの参加資格は“どなたでも”。この機会にぜひ参加してしてみてください。
コンテストへの参加はこちら！
