How to PaperZD その1-導入からFlipbook作成まで-【UE5.2使用】

PaperZD?

ここにたどり着いたということは少なくともUnrealEngineで2Dゲームを作りたい、そしてPaperZDというワードを聞いたことのあるという方でしょうか?

公式の説明を雑にGoogleさんに日本語訳してもらうと


PaperZD は、Unreal Engine に 2D プロジェクトのアニメーション サポートがないことに対する決定的な答えであり、複雑な 2D プロジェクトと単純な 2D プロジェクトを同様に管理するために必要なすべての機能を備えた独自のアニメーション ブループリントを簡単に作成できます。
プラグインを使用すると、次のことが可能になります。

  • 独自のアニメーション キャラクターやオブジェクトを作成し、使いやすく強力なアニメーション グラフでアニメーションを駆動します。

  • シーケンスにアニメーション通知を追加すると、自分で管理する手間をかけずに、非常に特定のフレームでイベントをトリガーできるようになります。

  • 独自の通知ロジックを C++、ブループリントで実装するか、独自のアニメーション ブループリントでカスタム通知として実装することもできます。

  • トップダウン、アイソメトリック、またはその他の「指向性」2D ゲームを簡単に作成し、使用するレンダリング角度を設定して選択できます。

  • 「シーケンサー」で独自のアニメーション シーケンスを作成し、キャラクターにすでに設定されているすべての通知と設定をトリガーします。

  • Paper2D 以外のアニメーション ソースを使用しながら、ツールのすべての機能を最大限に活用します。

  • ニーズに合わせてプラグインを簡単に拡張できます。

このプラグインは非依存的な方法でコード化されており、Paper2D のフリップブックだけでなく、2D 骨格アニメーションを含む他のアニメーション ソースでも使用できるように拡張できます。PaperZD にはブレンディング サポートが付属しており、可能な場合はスケルトン アニメーションを最大限に活用できるようになります。

PaperZD を使用すると、驚くべきアニメーション プロジェクトを実現するために必要なツールが得られ、非常に簡単かつ直感的な方法でプロジェクトを管理できます。


なんのこっちゃって気がしますが、自分的にちょっと触ってみて思ったのは
2Dでも3Dキャラゲーム製作で行うような
AnimGraphでステートマシンを使った動作の遷移や
アニメーションシーケンスへのイベント通知

ができるようになるコードプラグイン。みたいにざっくり捉えました。(間違ってたらすみません。)

そんなUnrealEngineで2Dゲームを作るなら必須なんじゃないかと思われるPaperZD。自分もちょっとやってみようと思って手を出そうとしたところ、見た感じ日本語でのチュートリアルがないような……?
ちょっと色々なHowto動画もみてやってみたのですが全部英語だったりでやはり掴みにくい部分はありまして……(と入ってもハンズオン動画が大半なので言葉は分からなくとも普通に乗り切れるはず。)

というわけで、ひとまず2Dアクションプラットフォーマー(有名どこでロックマンとか)のようなゲームのプレイヤーキャラを参考に、導入からキャラを動かせるようになるまでをちょっと備忘録的に書いておこうかなと思いました。

執筆当時の環境は UnrealEngine5.2.0 となっております。

導入……の前に。

2Dアクションゲームを作ろうとしている方ならこちらのUE5 2Dとか さんのYoutubeの動画リストのチュートリアルをやっておくのがいいかもしれません。
というよりテクスチャのインポート、EnhancedInputその他諸々の細かい説明はしないので、そこらへんが何言ってるんだ?って方もですが、プロジェクトの作り方からも全くわからんよ!って人も一度すぐ下のUE5向けの再生リストを一通りやって一度学んでください。
(もう別に2Dゲームはわかってるぜって方は飛ばしてください)

このシリーズはUE5にてゼロからテンプレートを作ることで、アンリアルエンジンの基礎を知るチュートリアル。小分けになっていてとても見やすくわかりやすい。
そして

こちらのシリーズは時系列は前後しますがUE4にてテンプレートから、ブループリントに慣れるチュートリアル。とのことです。

今から作り始めようと考えている方はUE5出始める方が大半だと思いますので上→下の動画リストの順番で最低1回は通しでやっておくといいと思います!ホントに。まず最低でも上だけはやらないとPaperZDの説明までたどり着けません。

UE5のEnhancedInputも説明されているので先に上からやるのがおすすめ。その後下。こちらは純粋に2Dゲームの学習もですが、ブループリントの勉強にもなりました。
こんな良い長時間の動画が無料だなんて……ありがたいことです。回し者みたいになってますが……

ホントは2~3周したいところだけどなかなか……ね。

導入準備

PaperZDを使いたいと思ってる方がここでつまずくわけ無い、かもう終わってるはずなのでざっくりと手短に一応書いておきます。
UE5でプロジェクトの作り方もわからないよ~って人がいたら、何度も言いますが上の丁寧に語ってくれてるチュートリアルなど他の素晴らしいチュートリアルをやってから挑んでください。

マケプレでPaperZDを検索。

もう購入済みなので出ていませんが購入して

その後エンジンにインストール。使いたいエンジンのバージョンを選択。5.2です。(またこちらはインストール済みなので4.23しか出ていない。)

でインストールすれば後はこっちのもの。
プロジェクトファイルを開きます。

新規でも既存のでも。

導入

左上からEdit→Plugins

検索欄にPaperZDと入力。出てきたらチェックボックスにチェックを入れる。すると右下にRestartNowと出るので素直に従って再起動。

今回の記事を書いていてどうもPaperZDを使うところまでたどり着かなかったので、フリップブックの用意までできる方は、ここからいずれ書くHow to PaperZD その2まで待っていてください……

素材の用意

キャラ素材インポート

素材は用意してますか?自前で用意してない方は、ありがたく無料のキャラ素材を使わせていただきましょう。

自分は他の解説動画でもたまに見かけるこの子にしました。

リンク先に飛んだら左上のDownload Nowからこの画面へ。
感謝のお金を送ってサポートするもしないも自由ですが、とりあえず
No thanks, just take me to the downloadsを押せばすぐ落とせます。
落としたフォルダは任意の場所へ保存。

落としたフォルダを漁って、自分はWarrior_SheetnoEffectをUE5にインポートしました。
右クリックからApplyPaper2DTextureSettingsを押す。なお、上のチュートリアルをやった方なら、これだけじゃないとはわかってると思いますが……
まあとりあえず。

Sprite作成

再び右クリックからSpriteActions→ExtractSpritesでスプライトを作っていきます。

画像を落としたページでは作者の方が一コマ69x44 pxと書いてあったので素直に従って画像のような設定にしてExtract。

テクスチャが入っていたフォルダにブワッとスプライトたちが出来上がりました。

邪魔なので別のフォルダに移動しましょう。
自分はTexturesフォルダにテクスチャ、
Spritesフォルダに今回出来上がったスプライトたちを入れ、
後で作るフリップブックのためにFlipbooksフォルダも作っておきます。

Flipbook作成

待機時用のフリップブックを作ります。

0~5番を選択し右クリックでCreateFlipbook。

スプライトと同じフォルダにフリップブックが出来上がるので名前をFB_Warrior_00_idleに変えておきます。
で、Flipbooksフォルダに移動。

中を開くとこんな感じ。右上のFramesPerSecondの数値を変えて自分の好きな動きのスピードに変えます。(自分は8くらい)

他には今回の記事通りの画像でやる方は以下の番号のスプライトを使ってフリップブックを作っておいてください。自前の画像の場合は、下記のモーションをそれっぽく作っておいてください。
(もしかしたら使わないのも混じってるかも)
走り→FB_Warrior_01_Run(Spriteは6~13番。~枚目ではないので注意)
ジャンプ→FB_Warrior_02_Jump(41~43)
ジャンプの頂点くらいから落下への移行→FB_Warrior_03_JumpTrandition(44~45)
落下→FB_Warrior_04_Fall(46~47)
着地→FB_Warrior_05_Land(好みにもよるが自分は64番だけにした)


……なんだかPaperZDに辿り着く前に、
チュートリアル見てもらってたらできるやろ~って思ってた部分も書いちゃった……
無駄に長くなってしまいました。

というわけで今回の記事はFlipbookの作成までという初歩の初歩みたいなところで終わってしまうという形で……そのうちその2を書きます。
やっとPaperZDを使い始めます。

ではまた。

この記事が気に入ったらサポートをしてみませんか?