要約
2015年9月30日、ツクールMVのサンプルゲームが公開されました。しかし英語のHTML5版。日本語情報が少ない状況ですので、せっかくなのでハックして知見を書き溜めようと思います。
01はじめに
このは研究目的を主題としており、誰かの権利や利害を侵害の意図はございません。当記事に掲載した情報の権利を保有する方から、申し出があり次第、速やかに対応いたします。お問い合わせはメールフォームよりお願いいたします。
02ツクールMV HTML5版サンプルゲーム 勝手に改造日本語化
軽率でしたので、公開は取りやめます。ご不快な思いをさせてしまった方、申し訳ありませんでした。
あとは皆さん、ツクールMVを購入して楽しみましょう。
2015/10/06 1:00追記
ご指摘元のツイートを削除致しました。ツイートの引用は謝意表明のつもりでしたが、意図せず晒すような形になってしまい、ご迷惑をおかけした事を申し訳なく思います。
03経緯
2015年9月30日、RPG MAKER MV(RPGツクールMVの英語版公式アカウント)より、サンプルゲームが公開されました。
http://t.co/8dwXcgkE1a #Preorder your copy of RPG Maker MV NOW and get 10% off and 2 free resource packs! #sale pic.twitter.com/XwKzJ6i6VB
— RPG Maker Web (@RPGmakerweb) 2015, 9月 30
海外ではRPG Maker MVの公式フォーラムがあるので、そこでツクールMVの開発者とユーザの交流が活発ですが、日本はあまり情報がありません。英語の情報にあたるか、公開されたサンプルゲームをハックするしかないというわけです。
英語版のフォーラムでは、ツクールMVの開発担当者が常駐しています。「守秘義務があるから、話せないよ」と断りつつも、ユーザの質問にかなり丁寧に答えています。
うーん、くやしい。日本版の情報公開が待たれますね……。なんて言うのは簡単ですが、せっかくサンプルゲームが公開されたとあらば、解剖してみるのがハッカーの魂なり。情報とは自分でつかみとるものです。
04改造した概要
わかった事
- 英語版のサイトはAmazon Web Services S3 北カリフォルニアサーバにファイルを置いている。直接URLをwgetすればダウンロード可能
- HTML5版はPixi.jsがベース
- Audio APIの都合で、一昔前のスマホ・タブレットやPS4、WiiUでは動かない
- でもハックすれば、レガシーなブラウザでも動く気もする。動作速度が落ちすぎてゲームにならないと思いますが
- Android/iOSはHTML5版も動くが、製品版ではapk/ipa書き出しにより正式対応されるはず
- すべての画像素材はVX Aceに比べて1.5倍に変更
- RGSS3の拡張版と言えるレベルで、構造が似ている。
- ゲーム開始時の読込順番
- マップ情報
- マップチップ
- キャラチップ
- 音楽
- 顔グラ素材や、戦闘時の敵キャラ素材は、イベント発生時にその都度読み込む
- JavaScriptは圧縮されているものの、読みやすくモダンな書き方
- M+1m Regularフォントを外部読込しているので、日本語読み書きも可能
- それどころが、中国語も韓国語もアラビア語も、おおよそ考え得る言語/文字は表示可能
- 外部フォント読込で、特殊文字や記号を会話に表示させる事も可能
- マップ情報・会話情報・イベント情報はMap00x.jsonに全て記述されている。
- jsonを書き換えれば、ステータス、アイテム、メニュー、会話などあらゆる情報を書き換え可能
- 戦闘システムは英語版サンプルゲームには実装されていないが、jsonから呼び出して、画像を用意すれば動く
- あらゆる命令がAPI化されており、JavaScriptを読む→jsonN呼び出しでかなりの事が実現できる
改造した部分(ver1.0)
- 日本サーバに置いただけで、速度が4.4倍高速化。7.34秒から1.66秒に
- 全会話文・メニューを日本語化翻訳が難しい、面倒くさくなってきたので、意訳とネタに走る
- oggファイルを変更。魔王魂さんから音楽をお借りしました
- 重たい画像ファイルの軽量化を行う(タイトル画面など)
- PLiCyからプリシーユちゃんとネコバをまぎれこませる
- Google Analyticsをゲームに埋め込む事も可能
- 戦闘システムのハックを坂本昌一郎さんから教えて貰い、実装
さらに改造した部分(ver1.1)
- さらに戦闘システムを改善し、サイドビュー戦闘を実現
- フォントを改造し、独自言語を表示
- ゲーム画面下部に広告の強制挿入
- 音楽をoggファイルに加えm4aファイルを追加
フォントはライセンスの問題でネット上にはアップしていません。権利関連をクリーンにしたら、後で追加します。Glyphsを用いてフォントを編集・追加しました。
ゲーム画面下部の広告も、あまりにウザいのでネット上にはアップしていません。
戦闘システムはver1.1で改善し、かなり動くようになりました。終了する為に[逃げる]を選択する必要がありますが、完全実装まであと一歩の状況です。バトラー素材はPLiCyさんとvibratoさん(P3X-774)からお借り致しました。この場を借りて御礼申し上げます。
広告機能も追加できました。とても邪魔ですね……。HTML部分に広告タグを追加して、JavaScriptで表示階層を制御します。実際のゲームに実装する時は、もう少しきめ細かく作り込む必要があります。たとえば、ゲームオーバーの時だけ表示するとか、表示部分が邪魔になりすぎないように(あるいは誤タップするように??)調整したりとか。広告サーバの構築も必要でしょう。とはいえ、簡便な内容であれば、手軽に追加する事ができる事がわかります。広告じゃなくとも、制作者からのお知らせとか、ゲームの更新情報を表示するなどにも使えそうです。
05あらゆる機能がAPI化されている
まず素晴らしい点が、あらゆる機能がJavaScript(rpg_core.jsなど)を通して、API化されている点です。jsonファイルから命令を呼び出すだけで、あらゆる事が可能です。
例えば
{“code”:101,”indent”:0,”parameters”:[“Package1”,0,0,2]},
{“code”:401,”indent”:0,”parameters”:[“コメント表示”]},
とすれば、キャラクターの顔グラフィックを呼び出しつつ、コメントを表示できます。
code:101が顔グラフィックとメッセージウィンドウの呼び出しで、code:401が文字表示を呼び出しています。
{“code”:102,”indent”:0,”parameters”:[[“いいね”,”やだよ”],1,0,1,0]},
code102は分岐命令です。
{“code”:129,”indent”:0,”parameters”:[2,0,true]},
code:129は仲間の追加です。この場合、id2のニーナが仲間に加わります。ニーナの情報は./data/Actors.jsonに保存されています。
画面上の効果(フェードアウトや雨を降らせる)とか、NPCキャラクターの移動、戦闘開始、マップ移動、ありとあらゆる命令がAPI化されており、簡潔明瞭。RGSS3に慣れたユーザなら、迷う事なく扱えるレベルで酷似しています。実は私はツクールVXとVX Aceでゲームを作った事がありません。RGSS初代の知識しかないのですが、それでも扱いは容易でした。
そもそも今回のハックではJavaScriptをほとんど記述していません。書き方さえ覚えれば、jsonファイルの上書きですべてが事足りてしまうのです。そのため、ハックの難易度は非常に簡単と言って良いレベルでして、非プログラマであっても改造可能です。
もちろん現時点では何の命令がどういう挙動なのか、rpg_core.jsなどを読み解く必要はありますが、ひととおりリスト化されてしまえば、RPGツクールMVを購入せずとも、誰でも簡単に、RPGツクールMV制ゲームが作れてしまうと言えます。
技術的視点に限って言うならば、RPGツクールMVフレームワークがOSSのJavaScriptゲームエンジンとして使えてしまいます。もちろん、RPGツクールMV制作チームからの公式発表・利用規約がないと、なんとも言えませんが、それだけに活用しやすいゲーム制作フレームワークと言えます。
06読み込みの最適化
次に注目したいのが、読み込みの最適化についてです。近年の開発情勢を知らないので私の知識不足かもしれませんがあらゆるゲームは、起動時に多くの画像/音楽などをダウンロードやキャッシュしておき、呼び出していると思います。しかしツクールMVでは、イベント開始時に必要なファイルをダウンロードし、呼び出しています。
ツクール公式英語版サンプルゲームをプレイすると、音楽やメッセージウィンドウの表示が遅い事に気がつきます。これはサーバから必要データを呼び出している為です。地理的に近いサーバにデータを置けば、速度問題は改善されます。私のサーバに置いた所、読み込み速度が4.4倍速くなり、もっさり感がなくなりました。
これはメリット、デメリットの両方がありまして。メリットはデータ分割によりゲーム起動時の読み込みが早い点。デメリットは低速回線者にとってはプレイ時の体感速度が下がってしまう点。それから海外プレイヤーにゲームを遊んで貰う為には、海外サーバやCDNを用意する必要がある事を意味します。
もしかしたら、RPGツクールMV側のオプションで、一括呼出も設定可能かもしれません。今後の発表に期待したいです。個人的には随時呼出機能が搭載されている低価格ゲーム制作ツールは初めて触れたので、新鮮に感じました。(Unityとかでも同じ事できるのかな? 私の知識不足です、ごめんなさい。ご存知の方がおりましたら、コメントください。)
072D描画エンジンはPixi.jsを採用
Pixi.jsは、いままで知りませんでした。しかし、調べてみるとたしかにRPGツクールMVにぴったりのフレームワークに思えます。大雑把ながら機能をまとめると
- マルチプラットフォーム
- 2D描画速度が高速
- 画像やフォントの扱いが簡便
- WebGLフィルターを搭載。エフェクト機能使える
- 画像ブレンドや画像スプライト機能搭載
- アセットローダー搭載
- マルチタッチ対応
- API構成はActionScript3ライク
- 最新ブラウザではWebGLを、旧世代ではCanvasに自動フォールバック
- MITライセンス
一言でまとめるなら描画に特化したグラフィックライブラリです。描画速度の高速さとAPI設計の美しさが特徴的です。RPGツクールMVがゲーム制作エンジンをつかさどり、Pixi.jsが描画部分を担うようです。
RPGツクールMVの標準機能で満足できなかったら、Pixi.jsのAPIを呼び出せば、あらゆるグラフィカル表現が可能となるでしょう。たとえば3D表示や、ゴリゴリにカスタマイズしたメニューなども実現可能と思われます。まあ、そこまでやるなら、ツクールMVじゃなくてUnity使った方が良いかもしれませんが……。
Pixi.jsの採用実例
Pixi.js公式サイトにて、採用実例を見る事ができます。そのどれもが高速・軽快に動作しており、ポテンシャルの高さを感じさせられます。
ソースコードと共に、様々な実装例を見る事ができます。
Pixi.js – Examples
わざわざソースコードの125行目に「Androidify のアニメーションを根底で支えているのが Pixi.js です。この高速で汎用性の高い 2D レンダリング エンジンは、WebGL と Canvas の両方で快適に動作します。」とコメントされています。
Androidify
Pixi.js開発元のgoodbody社公式のデモサイトです。3D表現・描画エフェクト・物理演算をゴリゴリ使いつつも、高速に動作している事が分かります。
FUTURE, PRESENT, PAST
08セキュリティについて
おそらくここまで読んで、一番気になるのは「そんなに簡単にハックできてしまうなら、どんなゲームも解析さるのでは?」という懸念です。特に有料ゲームの制作を考える人にとっては、頭の痛い問題です。あらゆるHTML5/CSS/JavaScript製ゲームが抱える、共通の課題とも言えますが。
現在公開されているのはサンプルゲームですので、セキュリティについて確かな事は言えません。しかし改造難易度は極めて低く、不安が残る事は確かでしょう。
とはいえ、ここまでデータアクセスが容易だと、自作の防衛手段を噛ませる方式も想像できます。たとえば、特定プラットフォームに特化させて暗号化/複合化ソフトウェア追加実装したり、ゲーム起動時にライセンス認証を行うとか。あるいはHTML5版ではユーザ登録システムを用意し、ユーザIDをImageMagickで画像透かしとして埋め込んでしまうとか。Windowsプラットフォームでは既にひかるさんが挑戦しており、今後の展開が楽しみです。
#ツクールMV 、課金システムプラグインの仮実装に成功。 Project Store☆経由で PC: Paypal、Android: Playでのアイテム購入処理が可能に。 今のところセーブ機構弄ってないのでいくらでもアイテム増やせてしまう。
— ひかる|DG15 B-09a (@HikaruDY) 2015, 10月 4
残り遊び:
・パッドサポート
・F12リセット
・RGSSプラグインエミュレータ
・セーブクラウド化(d-Network+)
・まともで再配布可能な暗号exeクライアント
・まともなDLCシステム
・ライセンス認証
・Android APK化
・スクリプトコマンド拡張
— ひかる|DG15 B-09a (@HikaruDY) 2015, 10月 4
・UI拡張 (オプションやメニューに項目追加、ストア画面、他)
・スクリプト動的生成(クライアントサイド)
・スクリプト動的生成(サーバーサイド)
☆Flash連携
☆Win APIアクセス
☆=PCのみ
— ひかる|DG15 B-09a (@HikaruDY) 2015, 10月 4
私は、課金システム + ユーザ登録システム + ImageMagick連携で、画像透かしを搭載する方向に挑戦したいと思います。画像透かし(電子透かし、ステガノグラファーとも呼ばれる)とは、画像の中に、人間には見えない程度の文字を埋め込む技術です。映画や電子書籍の流出防止の技術として使われています。つまりゲームが外部流出した時に「誰がコピーしたのか」が分かるわけです。流出しないように暗号化するのではなく、流出した時すぐさま訴訟を起こせるタイプですね。
09海外の動向
既にRPG Maker MVの関係者による制作動画も公開されています……ぐぬぬ
実は海外のフォーラムは、あまり追えていないのです。今後、チェックしたいと思いますが、目の前のコードの方に気を取られてしまいますね……。しかも3分ゲーコンテストやツクール新聞レンタルサーバサービスβもあるので、すべての時間をツクールMVにかまけるわけにはいきません……。だれか英語が堪能な方、ぜひ海外情報を自身のブログに書いて頂けないでしょうか😢
10今後のハック予定
さて。まだまだ下記の疑問や挑戦ポイントが残っています。ハックするのは、私かな? それとも、この記事を読んだ、あなたでしょうか?
もし面白い成果があらわれたら、Twitterやコメントやメールフォームから教えて頂けると嬉しいです。
- 効果音を鳴らす遅延は起きないのか、同時発音数はいくつか疑問
- 巨大マップ時のパフォーマンス
- 戦闘の完全実装アニメーションやバトラーを作る必要がある
- プラグインシステムの挙動確認既にひかるさんが課金システム仮実装に成功とのこと
- Electronでラップして、Windows/Mac OSX/Linuxで動作するゲームにする
- apk化して、Androidで動かしてみる。実装手段はいくつかあると思います
- iOS対応させて、iPhoneで動かしてみる
- Windowsストアに対応ゲームにするAndroid/iOSより簡単な気がします
- ネットワーク対応機能(メッセージ送受信とか?)の実装
- ライセンス認証
- 課金システムとの連動
- 画像透かしによる流出対策
- 3Dゲームを作る
- セーブデータのクラウド化
時間の都合や、技術力の問題で、すべて実現できるとは思えませんが……。いやはや書き出してみると、色々夢が広がりますねー!! ツクールMVの発売(そもそも日本語版の情報発表)が楽しみでなりません。
ツクールMVは英語版の発売は確定しています。購入はSteamから。日本語非対応なので、今後の動向を見守るのも良いかもしれません。
11Twitterでの情報メモ
ツクールMVのハックに挑戦した方や、その感想のツイートを下記にメモしていましたが、だいぶページが重たくなってしまったので、あとで別にまとめます。
12おまけ
プログラムができなくてもゲームが作れるのがツクールなのに、そのプログラムを解析するとかきみたちは何か本末転倒ではないかね?(ドヤッ
— 礼門屋@ライター仕事募集中 (@leimonZ) 2015, 10月 1
まったくその通りである。
00コメント
間違いの指摘、タレコミ、感想、批判などなど。なんでも気軽に投稿してください(∩´∀`)∩
直接のご連絡は、メッセージフォームからどうぞ。
プレイさせていただきました。
ますます待ちきれなくなってしまった・・・
普段は、VB系統で社内アプリを作ってますので、JavaScriptとかHTML5
には縁が無いのですが、そのまま入門書で勉強してて良さそうな感じで
すかね?
なんか、変なやる気が出てきましたw
コメントありがとうございます。英語サンプルゲームだと、サーバの距離の問題や、言語の壁があって、やや遠く感じました。こうして日本語化・高速化してみると、かなりストレスのないゲームになる事が分かりますね。
お仕事でVB系の開発をしているのでしたら、JavaScriptを覚えるのも簡単だと思います。Visual StudioはJavaScriptを扱う場合もインテリセンスやデバッグ機能が活きてきます。
状況に応じて、Web Essentials for Visual Studioを入れれば、それだけで強力な開発環境になりえます。(あまり日本では有名じゃないんですけれどね、この拡張機能……なんでなんでしょう)
ゲームを作ったら、ぜひ教えてください。遊ばせて頂ければと思います😄。