Title Screen Himawari | タイトルを立ち絵アニメ化するプラグイン 【ツクールMV プラグイン解説】

RPGツクールでは、様々なタイトル用の画像が入っていますが、利用者が多いこともあり、どうしても『似たタイトル画面』に見えてしまうと思います。また、落ち着いた絵柄のタイトル画像素材が多いため、明るい雰囲気の作品を制作する場合には、少し落ち着いた印象を与えすぎてしまうこともあると思います。

p-titlehimawari022
▲ライトノベルっぽいタイトルの作品などを作ろうと思うと、硬い雰囲気が与えてしまう可能性もある

一般的な対処方法としては、タイトル画面用に描き下ろしのオリジナルイラストを採用する方法が多いです。

ですが、新規でイラストを作成する予算や技術がない場合、オープニングの一瞬のために画像を作成するぐらいならば本編内のイラストを充実させたいと考える人もいるでしょう。

そんな「タイトル画面」にあまりエネルギーを掛けられない人は、本編中の立ち絵画像などを活用してタイトル画像を彩る機能を追加できる「Title Screen Himawari」という海外製のプラグインが役立つかもしれません。

Title Screen Himawariとは?


RMV – Title Screen Himawariはタイトル画面で指定された画像をアニメーションのように自動的に動かすシステムを搭載することができる海外製のプラグインです。

■プラグイン配布サイトで掲載されているサンプル動画

ツクールシリーズ向けのプラグインを多数公開されているMoghunter氏のサイトよりダウンロードすることができるプラグインです。

参照:RMV – Title Screen Himawari(Moghunterさんのサイト)

ポルトガル語がメインのサイトになっておりますが、利用規約については英語でも記載されています。

参照:About – Atelier Rgss(Moghunterさんのサイト)

元々は海外版ツクールMVであるRPGMaker MV向けに制作されているプラグインですが、日本語版のRPGツクールMVでも互換性があることを確認しています。

Title Screen Himawari導入に必要なもの


Title Screen Himawariプラグインを導入するために必要な物は以下の通りです。

  • プラグイン本体(公開ページ先でDLできるMOG_TitleHimawari.js)
  • アニメーション用画像1(Char_番号.png)×1枚以上
  • アニメーション用画像(Flower.png)
  • アニメーション用画像(Background_1.png)
  • アニメーション用画像(Background_2.png)

Moghunterさんのサイトでは、複数のプラグインデータがサンプルゲームという形でパッケージングされているため、サンプルゲームをダウンロードしてサンプルゲームから該当するプラグインをコピーしていきます。(詳細は後述)

また、アニメーション用に「Char_1.png」「Char_2.png」といった「Char_番号.png」という名前の画像ファイルを任意数、「Flower.png」「Background_1.png」「Background_2.png」と言う名前の画像がそれぞれ1枚ずつ(合計3枚)必要となります。

なお、初期設定のままでは「Char_番号.png」の画像が「Char_1.png」「Char_2.png」「Char_3.png」「Char_4.png」の1~4まで必要になります。3枚用意しないと、エラーが出てしまいます。本記事中盤にサンプル用の画像も用意しておりますので、まず初めて動かす場合はサンプル画像も利用してChar_4.pngまでの3枚以上を搭載して動かしてみることを推奨します。(初期設定の変更方法などもこの記事では紹介していますので、ご安心下さい)

Title Screen Himawariの使い方


Title Screen Himawariはプラグイン管理より機能を有効化し、指定されたファイル名でアニメーションさせる画像を指定されたフォルダに入れるだけで、簡易的なアニメーションが表示されます。

Title Screen Himawariを有効化しよう


Title Screen Himawariのプラグインを利用するためには、Moghunterさんのサイトで公開されているプラグインのサンプルパッケージデータより、該当するスクリプトをコピーし、自分の制作しているゲームのプロジェクトの「plugins」に入れてあげる必要があります。

参照:RMV – Title Screen Himawari(Moghunterさんのサイト)

上記のダウンロードページからダウンロードしたプラグインサンプルデータを解凍すると、下記のようなツクールのプロジェクト形式のファイルになっていると思います。

p-titlehimawari001

Moghunterさんのプラグインダウンロードデータは、他のプラグイン動作サンプルも含まれているため、プロジェクトデータをツクールで読み込み実行すると、今回利用する「Title Screen Himawari」以外のMoghunterさん制作プラグインのデモを見ることができます。

今回は「Title Screen Himawari」のみ利用しますので、解凍したサンプルデータの中から、「js」→「plugins」の順にフォルダを開いていき、「MOG_TitleHimawari.js」を自分のプロジェクトへコピーします。

p-titlehimawari002
▲サンプルデータにはサンプルとして搭載されているスクリプトがたくさん入っている。「Title Screen Himawari.js」のみコピーしよう

自分のプロジェクトデータ内のコピー場所も、同じく「js」→「plugins」内です。RPGツクールMVの画面より、編集中のゲームプロジェクトデータを開くことができるので、RPGツクールMVで自分のゲーム制作画面を開き、下記の画像を参考に「plugins」フォルダ内へ「MOG_TitleHimawari.js」をコピーして下さい。

pictbottom012
▲プロジェクトを開いた状態で、ツール→フォルダを開くで制作中ゲームのプロジェクトデータが開ける

pictbottom015
▲jsフォルダ内のPluginsに「MOG_TitleHimawari.js」を入れれば準備完了

「MOG_TitleHimawari.js」が正しくコピーできれば、RPGツクールMVよりプラグイン管理を選ぶと、今回使用するプラグインが有効化できるようになります。プラグインを選び、OKを押せばプラグインの有効化が行われます。

pictbottom006

p-titlehimawari003

Title Screen Himawari用に画像を用意しよう


Title Screen Himawariを使うためには、タイトル画面でアニメーションさせる画像を指定されたファイル名で「img」フォルダ内の「title1」フォルダ内に入れなければいけません。

p-titlehimawari006

画像ファイル名は以下の通りです。

  • アニメーション用画像1(Char_番号.png)×1枚以上
  • アニメーション用画像(Flower.png)
  • アニメーション用画像(Background_1.png)
  • アニメーション用画像(Background_2.png)

今回は初期設定に沿って「Char_1.png」「Char_2.png」「Char_3.png」「Char_4.png」「Flower.png」「Background_1.png」「Background_2.png」の7枚を用意して入れてみましょう。

画像が用意できない場合は、下記をお使い下さい。

■Char_1.png~Char_4.png
Char_1
Char_2
Char_3
Char_4

■Background_1・2.png
Background_1
Background_2

■Flower.png
Flower

Title Screen Himawariを動かしてみよう


Title Screen Himawariは画像と有効化し、画像さえ揃っていればプラグインをONにするだけで機能搭載が完了します。

p-titlehimawari003

プラグイン管理画面をONになっていることを確認し・・・

p-titlehimawari007

  • アニメーション用画像1(Char_1.png)
  • アニメーション用画像1(Char_2.png)
  • アニメーション用画像1(Char_3.png)
  • アニメーション用画像1(Char_4.png)
  • アニメーション用画像(Flower.png)
  • アニメーション用画像(Background_1.png)
  • アニメーション用画像(Background_2.png)

上記ファイル名の7枚が「title1」フォルダに入っていることを確認したら、ゲームをテストプレイしてみましょう。

p-titlehimawari008

p-titlehimawari009

当方が用意した画像を使用した場合は、上記のようにどんどんと動いていくタイトル画面に変わっているはずです。

Title Screen Himawariの動作設定を調整しよう


Title Screen Himawariはプラグイン設定の項目を調整することで、アニメーションの動作を一部調整することが可能です。最後にプラグイン設定それぞれの設定が何を示しており、どういう時に活用するのかを紹介していきたいと思います。

Char Numberで画像枚数を決める


初期設定ではキャラクター画像が4枚になっていますが、キャラクターを多くしたい場合・少なくしたい場合は初期設定を変更しないとエラーが出てしまうことがあります。4枚以外のキャラクター画像を利用するときはプラグイン管理画面よりMOG_TittleHimawariを選択し、『Char Number』の数値を変更していきます。

p-titlehimawari013

『Char Number』は「Char_数字.png」の画像を何枚使うかを設定します。ここで記載した分だけがアニメーションで使用されます。ですので、2枚しか立ち絵を使わない場合は『Char Number』の数値を2にした上で、「Char_1.png」「Char_2.png」のみを「title1」フォルダに入れれば問題なく稼働します。

アニメーションさせる画像を増やしたい場合は、『Char Number』の数値を増やした上で、「title1」フォルダに「Char_数字.png」を『Char Number』の数値分、「title1」フォルダに入れておけば勝手にアニメーションしてくれます。

p-titlehimawari003
▲初期設定では『Char Number』が4になっているので、Char_1.png~Char_4.pngまで4枚のChar画像が必要となっている。

p-titlehimawari015
▲『Char Number』の数値は半角数字で入れること

画像の初期座標を決めて変化を出す


初期設定では、端の方から画像がアニメーションで出てくるような設定になっています。

p-titlehimawari010

Title Screen Himawariでは、画像の初期位置を設定することもでき、設定位置を変えることで画像のアニメーションを少し変化させることができます。

p-titlehimawari014

画像の初期位置はX座標(横軸)・Y座標(縦軸)で定められており、『Char X-Axis』『Char Y-Axis』『Flower X-Axis』『Flower Y-Axis』の4つの箇所の数値を変えることで、初期座標を決めていきます。

Charは『Char_数値.png』などChar画像すべてを管理しているという意味。FlowerはFlower.pngを管理しています。X-AxisはX軸、Y-AxisはY軸のことです。

ですので、『Flower X-Axis』には「Flower.pngのスタート位置をX座標のどこにするか設定」というような意味になります。

試しに、『Char X-Axis』をいじってみましょう。

p-titlehimawari011

初期値は0でしたが、-200にしてみました。X座標は右に行けば行くほど数値が増え、左に行くとマイナスになります。

p-titlehimawari017
▲Char X-Axisを-200にした時の起動画面

実行してみると、Char_1.pngが0の時よりも左側になっていると思います。

p-titlehimawari010
▲Char X-Axisが0の時は矢印のように一番右端からアニメーションがスタートした

『Title Screen Himawari』では、細いアニメ動作の設定はできません。ですが、立ち絵の初期位置を定めることができるので、初期位置を調整することで、多少の見せ方変化ができますので、立ち絵の大きさや背景・タイトル文字とのバランスが悪い時などは、X-Axis・Y-Axisの数値を調整してあげましょう。

回転・拡大縮小動作を制御する


『Title Screen Himawari』を初期設定のまま使用すると、しばらく画面をおいておくと以下のように画像が回転したり画像が勝手に拡大・縮小していきます。

p-titlehimawari018
▲真っ直ぐだった青い画像が斜めになる

拡大・縮小・回転の動きにより、ランダム感を出すことができる仕様になっています。この画像の回転・拡大・縮小の動作を管理するのが『Rotation』『Rotation Time』の2項目です。

p-titlehimawari016

『Rotation』は拡大・縮小・回転の動きを有効化するかどうかを設定します。この項目に半角で『true』と書かれていた場合は、拡大・縮小・回転の動きを自動的に行なってくれます。回転などの動きをしてほしくない場合はtrue以外の文字(一般的には『false』?)を入力しておきましょう。

『Rotation Time』は回転がどれくらいの頻度で発生するか時間を設定します。数値を小さくすれば回転などの動作を行う間隔が短くなり、頻繁に回転や拡大縮小の動作を行うようになります。

イラストやゲームの雰囲気によって拡大・縮小・回転の動きを採用するべきか、また採用する場合はどのような感覚で実施していくか決めていきましょう。『Rotation Time』を減らして頻繁に拡大・縮小・回転をするようにすると大きな動きが増えるため、アグレッシブな印象になりますがごちゃごちゃした感じにも見えます。例えばホラーゲームや恋愛ゲームなど落ち着いた雰囲気を出したい場合は回転の間隔を広げてゆったりした雰囲気を出してみたりすると良いのではないかと思います。

Title Screen Himawariで困った時


海外製のプラグインですので、エラーが出てしまったり、上手く動かないと不安に思う方も多いと思います。最後に、起こりそうな問題やよく発生しそうな設定ミスなどの解消方法などを紹介していきます。

起動すると『Failed to load: img/title1/Char_数値.png』というエラー表示が出る


Char_数値.pngという画像がimgフォルダ内のtitle1フォルダに入っていないよというエラーになります。上記「Char Numberで画像枚数を決める」項目で記載の通り、『Title Screen Himawari』では、使用するキャラ画像の枚数をプラグイン管理の「Char Number」で定めなければいけません。ここで設定した数が搭載予定の枚数を下回っていたり、画像の名前が異なっていたりすると、『Char Numberで記載された番号までの画像がなくて困ってる!』とプラグインが判断してしまい、エラーが出てしまいます。

一例をあげると、『Failed to load: img/title1/Char_4.png』であれば『Char_4.png』というファイルが無いと判断されているので「title1」フォルダに『Char_4.png』という画像を入れてあげましょう。4枚も使わないという場合には、プラグイン管理画面より「Char Number」を『3以下の仕様予定枚数の値』に変更してあげましょう。

起動すると『Failed to load: img/title1/◯◯.png』というエラー表示が出る


Failed to loadはファイルが見つかりませんというデータです。load:以降はプロジェクトデータ内のフォルダの場所を示しています。
『Failed to load: img/title1/◯◯.png』であれば、プロジェクトデータ内のimgフォルダ内、title1フォルダ内の『◯◯.png』というデータがない可能性が高いので、title1フォルダ内に『◯◯.png』という名前で画像データを入れてあげましょう。

起動すると『TypeError』というエラー表示が出る


プラグイン管理画面の設定で、数値を全角で入力していませんか?

p-titlehimawari021

TypeErrorは入力ミス時に表示されるエラーですので、入力内容を確認してみましょう。

「Rotation」を設定しても回転などの動きがうまく働かない


「Rotation」に半角英字で「true」と入力していますか?
全角で「ture」と入力していたり、「True」「TRUE」「OK」などと
記載している場合は回転しないと判断されてしまいます。

日本製のプラグイン設定でよく使われる『OK』ではなく、プログラミング処理でよく使われる『true』という記述になりますので、注意しましょう。

まとめ


『Title Screen Himawari』は細かい設定こそ出来ませんが、立ち絵などゲーム内で使用している画像を特定ファイル名にして指定フォルダに入れるだけで簡単に装飾されたタイトル画面を創ることができることが大きな強みです。

採用するイラストを調整するだけで、アドベンチャーゲームのPVのようなタイトル画面を作ることができます。

簡単設定でタイトル画面を装飾したい場合に検討してみてはどうでしょうか?

*本記事は『MessageWindowPopup.js Version1.2.0を元に作成しております』
*プラグインの利用は各自の責任のもとご利用下さい。(プラグイン導入で問題が起きた場合は責任を負えません。バックアップしてからテスト導入をしてご利用下さい。)
*作成画像はRPGツクールMVを利用し作成しております。
 RPGツクールMV→(c)2015 KADOKAWA CORPORATION./YOJI OJIMA

RGC オリジナルゲーム制作支援記事 一覧

スポンサードリンク

コメントをどうぞ

メールアドレスが公開されることはありません。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください