投稿記事

2022年 05月の記事 (3)

[進捗]天候システム

こんにちは。

https://twitter.com/thiropGames/status/1529775554374774784

……心が折れたので、久しぶりに「眠れる勇者のRPG」の雑進捗でも。


今年に入ってネットワーク周りの見えない部分の処理をずっとやってましたが、ようやく土台の部分が一段落し、今はゲーム部分の制作に戻りつつあります。

https://twitter.com/thiropGames/status/1529804069623123969

半ソシャゲなゲームなので、月替りのイベントダンジョン的なコンテンツを用意するのですが、量を用意するのはしんどいのでランダムな要素・ギミックで補う計画です。


天候システムもその一環で試作したものですが、さらにランダム要素をもたせてローグライトっぽいシステムに修正する予定です。

  • フロアを進むごとに天候・敵バフ・味方デバフ・探索効果のどれかがランダムに増えていく
  • 天球儀でどれか1つを選んで消去できる

昨年アツマールで出したローグライトモードで好評だったアーティファクトシステムもゆるく組み込むつもりです。

ただ、あまりランダム要素が強すぎるとキャラ育成の意義が薄くなってしまうので、

  • ランダム要素をほぼ廃したガチフロア
  • ゆるく遊べるランダム要素多めのカジュアルフロア
  • 道中で仲間をピックしていくローグライトフロア

の3タイプ用意し、「素材集めに周回するときはカジュアルフロアかローグライトフロア」といった感じにプレイヤーが選べるスタンスにする予定です。


やっぱり、ゲーム部分の制作は楽しいですね(´・ω・`)

ネットワーク周りは新しい知識・技術の勉強になってそれはそれで面白かったのですが、ずっとプレツク等のタグにも参加できなかったので……

また面白そうな進捗が出てきましたら、記事にしようと思います。
それではまたノシ

この記事が良かったらチップを贈って支援しましょう!

チップを贈るにはユーザー登録が必要です。チップについてはこちら

[講座]ギロチン振り子トラップの作り方【TRP_MoveRouteEx】


こんにちは。

突然ですが、1月に有償プランで配布した移動ルート拡張プラグイン「TRP_MoveRouteEx」を活用したギロチン振り子トラップの作り方をご紹介します!

未購入の方も、本記事で気になったら是非バックナンバーの購入をば!


(あと1つ売れればCi-en収益化できるんです……!一生収益化できる気がしなそうだったので、頑張って記事書きました🤸‍♂️)



ギロチン振り子トラップの作り方

TRP_MoveRouteExの使い方は、過去3回の記事で解説してるのでそちらを参考に。

とはいえ、久しぶりの記事なので使い方の解説も多少加えていきます。


振り子の画像を用意

振り子用の画像がないので、デフォ素材の武器画像Weapon1.png内の斧の画像を加工して用意しました。

RPGツクールMZをお持ちの方は、ツクール素材の利用規約に則ってご利用可能です。

……ドット絵を回転させてきれいに修正する技術がないので、斜め45度のままです!

(自分で画像を用意するときは、普通に下向きで作るのが良いと思います)


方向・パターンなしのキャラ画像に設定

上の振り子画像、通常であれば縦と横に余白をとって
「上下左右の方向」「3つの歩行パターン」を用意する必要があります。

ただ、ものすごい画像サイズになってメモリをどか食いしてしまうので、方向・パターンなしの画像を設定するプラグインを用意しました。

NoPatternCharacter.js (1.82kB)

ダウンロード

プラグインを導入して画像を設定したら、イベントのメモ欄に「<noPattern>」と記述すればOKです!

プライオリティは「通常キャラの上」にします。
(「通常キャラと同じ」だと、位置によっては不自然な重なり順に見えます…)


振り子の移動ルート設定

移動ルート拡張プラグインは、移動ルートのスクリプト欄に独自形式のコマンドを使って操作を行うプラグインです。

便利機能として、自律移動の内容をイベントページの1行目にスクリプトコマンド(MVは注釈コマンド)を入れて、その中に記述することができます。

自律移動のタイプをカスタムにしておくのを忘れずに!

スクリプトの1行目には「@route custom repeat freq:max」と記述します。


それぞれ、次の意味↓

  • @route:これから移動ルートを記述
  • custom:自律移動の設定
  • repeat:動作を繰り返す
  • freq:max:頻度最大

移動ルートのコマンド内容は次の通り↓

@route custom repeat freq:max
//初期角度を20度(実際は45+20=65度)に設定
cmd angle 20 anchor:0 d:0 @
//イベントトリガーを無効化
cmd trigger none @
//繰り返しの開始位置をここに設定
cmd repeat

//120フレームで70度(実際は+45で115度)まで回転
cmd angle 70 anchor:0 d:120 cubicInOut
//真下を通る60フレーム後まで待機
cmd wait 60
//距離が0.5以下なら、スイッチ1をOFF&イベントを実行
cmd if dist 0.5; cmd switch 1 off; cmd start @
cmd wait 60;
//反対方向に回転
cmd angle 20 anchor:0 d:120 cubicInOut
cmd wait 60
//距離が0.5以下なら、スイッチ1をON&イベントを実行
cmd if dist 0.5; cmd switch 1 true; cmd start @
cmd wait 60

角度の設定

順に見ていきましょう!

//初期角度を20度(実際は45+20=65度)に設定
cmd angle 20 anchor:0 d:0 @

角度の初期化してます。

今回は振り子の振れる角度を50°とします。(お好みでOK)


真下の状態が90度で、そこから半分の25°を引いた65°に初期角を設定したいのですが…

画像の振り子がすでに45°傾いてるので、65°-45°で角度を20°に設定しています。


その他のパラメータは↓

  • d:所要フレーム数。0として一瞬で角度を設定
  • anchor:回転の中心。振り子の棒の端っこ(上端)を中心に回転するので0
  • @:1フレーム待たずに即座に次のコマンドを実行する記号

トリガーの無効化

//イベントトリガーを無効化
cmd trigger none @

決定キーや触れたときにイベントが実行されないように、トリガーをnoneとして無効化。


繰り返し位置の設定

//繰り返しの開始位置をここに設定
cmd repeat

移動ルートの繰り返しは通常、一番最初の行に戻ります。

ここまでに行った初期化用のコマンドは繰り返して実行する必要がないので「repeat」コマンドで繰り返しの開始位置をこの行以降に設定します。


回転アニメーション

//120フレームで70度(実際は+45で115度)まで回転
cmd angle 70 anchor:0 d:120 cubicInOut

基本的なパラメータは初期角度を20°に設定したときと同じです。

所要フレームが120フレーム(2秒)になっているのと、

イージング(動作の緩急)を「cubicInOut」を指定して動きの最初と最後を遅くしてます。


(角度は、一番下の90°の状態から25°回転した115°……から画像の傾きの45°を引いた70°に設定してます。)



衝突判定

//真下を通る60フレーム後まで待機
cmd wait 60
//距離が0.5以下なら、スイッチ1をOFF&イベントを実行
cmd if dist 0.5; cmd switch 1 off; cmd start @

120フレームで角度をアニメーションさせてるので、真下を通るのは60フレーム後です。

60フレーム待ってから「if dist」コマンドで衝突判定を行います。


if dist 距離」で指定した距離以下の場合に同じ行のそれ以降の処理を行います。


今回はスイッチ番号1をOFFにしてからイベントを実行させています。

ちなみに、スイッチ番号1は「振り子が左から衝突」を意味するフラグです。


右からぶつかっているのでOFFとし、イベント内でプレイヤーを左に吹き飛ばします。


呼び出すイベント内容は、コモンイベントを呼び出すのみです。


コモンイベントの内容は後ほど解説します。

(※「cmd commonEvent」コマンドでそのままコモンイベントを呼び出すこともできますが、呼び出し元のイベントが分からなくなってしまうので一度イベント自身のイベントページを起動させています。)



その後は残りの角度アニメーションを待ってから、同じように反対方向へ角度アニメーションを行います。

cmd wait 60;
//反対方向に回転
cmd angle 20 anchor:0 d:120 cubicInOut
cmd wait 60
//距離が0.5以下なら、スイッチ1をON&イベントを実行
cmd if dist 0.5; cmd switch 1 true; cmd start @
cmd wait 60

スイッチ操作コマンドは「振り子が左から衝突」をONとしてます。



衝突時のイベント

衝突時に呼び出すコモンイベントは次の通り↓

上の3行は「フラッシュ」「シェイク」「SE」で衝突時のエフェクト。

次の「HPの増減」でダメージ処理。

その後の長めの「スクリプト」で吹き飛ばしの移動処理。

最後にスクリプトでの移動完了を待って「移動ルート」で向き固定をOFFに戻してます。



さて、スクリプトで行ってる吹き飛ばし処理は、移動ルートのジャンプで代用することも可能ですが…



プレイヤーの移動が完了してから移動ルートの次の行が実行されるという仕様のため、

移動中に振り子に衝突しても、プレイヤーが歩き終わって次のマスに到着してからジャンプで吹き飛ぶ動作となってしまいます。


そのため、スクリプトを使って衝突タイミングで強○的にジャンプ移動させてます。

スクリプトの解説はコメント行(//)を参照ください。

var event = this.character(); //コモンイベントを呼び出したイベント

var dx = 2; //x方向に吹き飛ぶ距離
var dy = 2; //y方向に落ちる距離

//スイッチ「左から衝突」がONならx方向の向きは反対
if($gameSwitches.value(1)===false)dx*=-1;

//吹き飛び先を固定するため、一度プレイヤーの実体位置を振り子イベントの位置に設定
//(見た目上の位置である_realXではなく、衝突判定など行う実体座標である_x)
$gamePlayer._x = event._x;
$gamePlayer._y = event._y;

//向きを固定してジャンプで吹き飛ばす
$gamePlayer._directionFix = true;
$gamePlayer.jump(dx,dy);

(※途中、吹き飛び先の座標がずれてバグったりしないように、プレイヤーの実体座標を補正してます)


以上で、基本的な動作ができました!

振り子の動きに合わせて左右に吹き飛びます!


自律移動の設定をコモンイベントに移す

振り子をたくさん配置し、ウェイトを使ってタイミングをずらすのですが、その前に自律移動の移動ルートをコモンイベント化して整理します。


イベントの1行目に設定していた移動ルートのスクリプトを新しいコモンイベントにペーストします。


そして、イベントの1行目を次のように置き換えます。

これで、コモンイベント「ギロチンルート」に移植した移動ルート設定を自律移動に設定できます。


複数のイベントを配置してから移動ルートの修正が必要になっても、コモンイベントの修正のみですみます!


複数の振り子を配置

さて、振り子イベントをコピペして好きなだけ配置しましょう!

そのままではすべて同じタイミングで振り子が振れます。


cmd repeat」コマンドより上の初期化処理の中に、イベントごとに異なる値のウェイトを挟んでタイミングをずらしたいのですが、自律移動の設定をコモンイベントに移してしまっています…


そこで、イベントのメモ欄のメタ設定を使ってウェイトの値をイベントごとに変えます。

ここでは、パラメータ名「w」を使って「<w:初期ウェイト値>」と設定します。


(※本記事では、イベントごとに0, 30, 60, 90, 120に設定)

コモンイベント「ギロチンルート」内の設定を修正↓



↓のコマンドでメタパラメータwの値だけウェイトさせてます。

cmd wait \MT[w@0]

@0」は、メモ欄に設定していない場合のデフォルト値を0とすることを意味します。



これで、タイミングを自由にずらすことができました!


ただ、振り始めるまで不自然に固まって見えてますね……

振り子ごとに初期角度等を設定するのはしんどそうです……


マップ侵入位置からギロチンゾーンをある程度離し、ギロチンが止まっている瞬間を見えないようにさせる方針にしましょう!


とはいえ、イベントは画面外だと自律移動がストップするという仕様が邪魔します……
(ついでに、振り子のタイミングもずれてしまう…)


以前の「落石ギミック」の記事では「cmd repeat リピートサイクル」を使って同期させましたが、今回はこの方法だとちょっとうまくいかないので、素直にプラグインを用意しました!

SelfMovementOutsideTheScreen.js (1.01kB)

ダウンロード

シンプルなプラグインです。

メモ欄に「<moveOut>」と設定しておくと、画面外でも自律移動がストップしません!


以上でギロチン振り子トラップ完成です!

お疲れさまでした!

未購入で気になった方は、バックナンバーの方をよろしくです!

1件のチップが贈られています

チップを贈るにはユーザー登録が必要です。チップについてはこちら

[講座]『天候:メテオ』の作り方【TRP_ParticleMZ】



こんにちは。

GW真っ最中、いかがお過ごしでしょうか?

各所でGWセールが賑わっておりますが、シロップ印の各種プラグインも20%オフのセール中(~5/8<日>まで)です!




気になるプラグインがありましたら、ぜひショップページへお越しくださいませ!



さて、今回の記事ではRPGツクールMZ向けパーティクルプラグイン「TRP_ParticleMZ」を使って空からメテオが降ってくる天候エフェクトの制作方法をご紹介します!


上級者向けのグループエディタやサブエミッターを活用した高度なエフェクトとなります。

各種スタートアップ記事を読みこんで操作に慣れていないと難しい内容ですが、購入したばかりの方も「こんなエフェクトが作れるのか〜」と気軽に流し読みしてもらえると幸いです。



□スタートアップ記事
導入とパーティクル表示【TRP_ParticleMZ】
基本の使い方②〜エディタ編【TRP_Particle】
グループ機能【TRP_ParticleMZ】
サブエミッター機能【TRP_ParticleMZ】



天候「メテオ」の作り方

さて、新たにパーティクルエフェクトを自作しようとするとき、どのプラグインコマンドを使ってるいでしょうか?

「TRP_ParticleMZ」プラグインのset/playコマンドを使う方が多いかと思います。


ただ、ある程度プラグインの操作に慣れた方であれば、
「TRP_ParticleMZ_Group」プラグインのsetコマンドを使うのが断然おすすめです!



編集を始める際は、どんなエフェクトを作るかある程度想定しているでしょう。

しかし、いざエフェクトを作り進めていくと「見栄えをよくするために、もう1つエフェクトを重ねたい」と思うことが多々出てきます。


そんなときにグループコマンドのエディタであれば、テストプレイを続けながら複数のエミッターを交互に編集して見栄えを整えることができます。

エフェクトを作り始めるときは、おもむろにグループコマンドのsetを_EditMode=trueで呼び出しましょう!


今回は管理ID(設定名)「meteor」、対象を「weather」として天候エフェクトを制作していきます。




隕石本体の動きを作ろう

さて、グループエディタを呼び出して最初にすることは9割9分、決まってます。

「command1」の行にカーソルを合わせ、「edit」と打ち込んでEnterです



今回は、隕石本体をメインエミッターとして発生させ、複数のサブエミッターで細かな演出や動きを作っていきます。

  • サブエミッター1:隕石の動きに合わせて「周りに燃える炎」
  • サブエミッター2:「衝突後の炎」
  • サブエミッター3:「衝突後の炎の煙」

では、隕石本体の動きを設定していきましょう!


隕石画像の読み込み

まずはパーティクルの画像を設定しましょう

今回はツクールMVのアニメーション画像「Earth3」の画像を使います。


「Ctrl+A」でMV形式のアニメーション画像をパーティクルとして読み込めるので、MVを所持してる方はぜひアニメーション画像をプロジェクトに取り込んでおきましょう!

ツクールMVの新規プロジェクトからimg/animationsフォルダをコピペすればOKです。


(※MVを持ってない人は任意の画像を用意して「img/particles」フォルダに入れましょう。「Ctrl+I」での画像選択時に表示されます。
ちょうどよい画像が無い方は、キャラ画像「!Others1」の岩の画像を切りとってひとまずの代用とすると良いでしょう。)


隕石の動きを設定

最終的には画面上のランダムな位置から複数発生させたいですが、まずは編集しやすいように隕石1つを定位置に発生させましょう。

□パラメータ設定例

  • [blendMode]は0で通常
  • [lifetime]は幅を持たせず4秒で固定。固定にすることで、消滅のタイミングに合わせてシェイクやSE再生といった演出をさせることができます。

「Ctrl+S」で保存→「Ctrl+W」でいったん隕石本体のエミッター設定を終わります。


隕石の周りの炎の設定

燃え盛る隕石を表現するためにサブエミッターを設定します。

「opt+↓」を押して「command1」の行の下にコマンドを追加し、

「sub」と打ち込んでEnterを押してサブエミッターを設定します。


炎のエフェクトとしてプリセットデータの「fire_c」をベースに編集していきます。

「Ctrl+P」でプリセット一覧から「fire_c」を選んで読み込みましょう。


読み込んだ数値のままだと少し問題があるので調整していきます。


位置の調整

まずは、炎が隕石のまわりにまとわるように発生位置を調整しましょう。

現在は長方形の範囲に発生させる「rect」となってます。


円形に発生させる「circle」に変更し、半径「r」をちょうどよい値に設定しましょう。(ここでは24)

発生量と見栄えの調整

次に、frequencyの値を大きくしてパーティクル発生量・負荷を抑えます。(ここでは0.01)

また、発生時の大きさを大きくし、量が減ってスカスカになった分の見栄えを補います。


方向の調整

炎が真上に立ち上がってますが、隕石の動きに合わせて[startRotation]を左上(-120度)に変更します。


□サブエミッター1のパラメータ



これで、1つ目のサブエミッターの設定完了です!

「Ctrl+S」→「Ctrl+W」でサブエミッターの設定を保存&終了します。



着弾後の炎と煙

次に、隕石の着弾後に残る炎のエフェクトを新しいサブエミッターとして設定していきます。

さきほどと同じように「Ctrl+↓」でCommand2の下に新しい行を挿入し、
「sub」と打ち込んでからEnterでサブエミッターの設定を行います。

着弾後の炎にもプリセットデータ「fire_c」をベースに使います。

「Ctrl+P」でプリセット一覧を表示して「fire_c」を選びます。


このままでは隕石の周りに炎が表示されているだけです。

隕石消滅後に表示されるようにサブエミッター設定の「sub」パラメータを調整します。

まず、開始タイミングを設定する「st」を1としてサブエミッターを有効化するタイミングを隕石消滅直後とします。

「emitterLifetime」が-1で永続のままではすぐに消滅する仕様なので、炎の表示時間を適当な秒数に設定します。

(※長すぎると隕石が降ってくるたびに炎が残って負荷が大きくなるので注意)


また、負荷を抑えるために「frequency」を少し大きめにして発生数を抑えましょう。

ついでにスカスカになった分、発生範囲rectの幅と高さを小さくして表示範囲を小さくすると良いでしょう。


□サブエミッター2のパラメータ


煙の設定

全く同じ手順で炎の煙をサブエミッターとして設定します。

プリセットデータで読み込むデータとして「smoke_c2」を使います。

読み込んだあとに、

  • 「sub」パラメータの発生タイミング
  • 「emitterLifetime」で炎の継続時間
  • 「frequency」と「rect」で発生量と発生範囲

など調整しましょう。


□サブエミッター3のパラメータ



お疲れさまです!

これで、隕石エフェクトの基本設定が終わりました!


「Ctrl+S」→「Ctrl+W」でサブエミッターの設定を保存してから

もう1度「Ctrl+S」→「Ctrl+W」でグループの設定を保存して終了します。

(※グループ設定の保存を忘れずに!)



画面演出の設定

演出として隕石の着弾に合わせて「シェイク」「フラッシュ」「SE」を設定します。

パーティクルグループコマンドの「_editMode」をOFFにして、着弾タイミングの4秒(240フレーム)後にそれぞれのコマンドを実行させましょう。


3つのコマンド「シェイク」「フラッシュ」「SE」の好みの設定が見つかったら、パラメータをメモしておきましょう。


実は、上記の演出はパーティクルのグループコマンドからそれぞれ「shake」「flash」「se」コマンドとして実行させることができます

(※グループコマンドに演出を組み込むことで、パーティクルグループコマンドを実行すれば、あとはタイミングを図らずに「シェイク」などを自動で行うことができます。)



再びグループsetコマンドの「_editMode」をONにしてテストプレイでグループエディタを開きます。

「Ctrl+↓」でコマンドを挿入して、

  • 指定フレーム待機:「wait フレーム数
  • SEの再生:「se SE名 ボリューム ピッチ パン
  • フラッシュ:「flash 赤 緑 青 強さ 所要時間
  • 画面のシェイク:「shake 強さ 速さ 所要時間

をそれぞれ設定しましょう。

(※残念ながら、グループエディタ画面ではフラッシュやシェイクの動作を確認できないので先程イベントコマンドで設定した値をそのまま使いましょう)



画面上にランダムに発生させる

さて、もろもろの下準備は終わりました。

画面上にランダムに隕石を発生させましょう!


まずは、隕石本体のエミッターを編集して発生位置を画面上のランダムなrectに設定しましょう。

[Command1]の行を選んで「Alt+E」で編集モードに入ります。



「screen」と打ち込むと発生位置が画面全体の範囲のrectに設定されます。

隕石を画面の上側から発生させ、着弾地点を画面内に収めるために微調整します。


いったん[emitterLifetime]を-1としてエミッター寿命を永遠にして[frequency]も調整し、画面上に大量に隕石を発生させます。(パソコンのスペックに注意)

この状態で[rect]の値を調整すると範囲を調整しやすいでしょう。


調整作業が終わったら、[emitterLifetime][frequency]をもとに戻してパーティクルが1つだけ発生させる状態に戻しましょう。

(※通常の天候エフェクトは[emitterLifetime]を-1として永続的に発生させればよいのですが、パーティクル発生ごとにSEや画面シェイクを合わせたいのでここでは1つのみ発生させます。逆に、割り切ってSEやシェイクをランダムなタイミングで発生させるのであればエミッターで永続的に発生させてOKです)


最後に、イベントコマンドで複数の隕石パーティクルの再生を管理させます。


イベントで隕石エフェクトを制御

ループコマンドを使って一定間隔で隕石を発生させます。

60フレームに1回の頻度で発生させます。



さて、このままでは隕石は画面上に1つしか表示されません。

パーティクルプラグインに使い慣れてきた方ならば原因は分かると思います。


「管理IDが同じエフェクトは1つしか表示できません。」


グループコマンドを呼び出すたびに管理IDを変える必要があります。

ここでは、変数を使って管理IDを制御してみましょう。



グループコマンドの管理IDとデータ名は次の通りです。

  • 管理ID:meteor\V[変数番号]
  • データ名:meteor

とします。管理IDには制御文字で変数の値を組み込んでおり、ループごとに「meteor1」「meteor2」と変わっていきます。

(※ver1.21にてグループコマンドの制御文字が反映されない不具合を修正しているのでアップデートをお願いします)




以上で「天候:メテオ」エフェクトが完成しました!


あとは、画面の色調を少し赤くすると雰囲気もそれっぽくなるでしょう。


今回のエフェクトはグループエディタを使ったものの中でも、かなり複雑なものです。

単体のエミッターよりも複雑でリッチなエフェクトを手軽に作れるので、ぜひグループエディタも活用してみてください!



そして、プラグインのセールもお忘れなく!

それでは!




おまけ:さらに調整

ランダムな間隔で発生させる

1秒(60フレーム)ごとに隕石を発生させてますが、シェイクやSEも1秒ごときっかりだと少し機械的な感じが強いです。

ループ間隔を1/3の20フレームに縮めて、その代わりに33%の確率でグループコマンドを実行させるように変更させます。

(※変数を使って乱数を生み出してもいいですが、マップイベントのリロード処理が走ってしまうため、ここでは条件分岐のスクリプトを使用しています。)


画面ループさせる

画面内が隕石で埋まっていても、上下左右にスクロールさせるとパーティクルが途切れます。

「loop」コマンドを使い、上下左右でパーティクルを使いまわしてループさせましょう。


光らせる

隕石の画像が少し浮いてしまうため、完成動画では隕石を中心として発光させています。

画像「flare」[speed]=0でその場でチカチカ表示させるだけで手軽に発光させて雰囲気を馴染ませられるので試してみると良いでしょう。

1件のチップが贈られています

チップを贈るにはユーザー登録が必要です。チップについてはこちら

月別アーカイブ

記事を検索