【JavaScript】スプライトアニメーション

ゲームエンジンを使わずに、手軽に 2D ゲームを作る環境を調べているのですが、その過程で JavaScript を使った方法を調査したので得られた知見を共有したいと思います。

本稿で扱う内容

やり方としては、スタイルシートの要素を使う方法と、canvas を使う方法のふたつあります。
本稿ではスタイルシートの要素を使う方法について共有します。

てっとり早く確認したい場合
PC でご覧の方なら、この Web ページの左上に 8-bit ゲームっぽいキャラ※が見えると思いますが、これは GIF アニメや PNG アニメを使っていません。
スマホやタブレットでご覧の方は、右上の ≡ をタップすることで表示されます。

※キャラ名は「シモーネ/シモーヌ/Simone」です。

このキャラは JavaScript でテクスチャアトラス(複数のスプライトを一枚の画像にまとめたもの)を使ってスプライトアニメしています。
このウェブページのソースを見れば、スタイルシートと JavaScript のコードも確認できます。

続きを読む 【JavaScript】スプライトアニメーション

【UE5.6】Mass Framework で大量の NPC を制御する。導入編【C++】

City サンプルで使われている群衆制御フレームワーク(Mass Framework) の知見を共有したいと思います。
情報量が膨大なので記事を分割し、本稿では Mass Framework のセットアップや簡単なサンプルの作成方法のみを扱います。

動作環境
Unreal Engine 5.4 / 5.5 / 5.6
Visual Studio 2022
※MSVC v143 – VS 2022 C++ x64/x86 ビルドツール v14.38-17.8
Windows 11 Home

続きを読む 【UE5.6】Mass Framework で大量の NPC を制御する。導入編【C++】

【UE5】AnimGraph をいちから読み解く【初心者向け】

本稿では、Unreal Engine(以下 UE) 5 のサードパーソンテンプレートに含まれているアニメーションブループリント(ABP_Manny)の内容を詳しく読み解いていきます。
アニメーションブループリントは、AnimGraph とイベントグラフのふたつの機能を持っていますが、本稿では AnimGraph のみ扱います。

環境は以下。

Unreal Engine 5.3.1 および 5.4.2
Windows 11 Home
Visual Studio 2022

続きを読む 【UE5】AnimGraph をいちから読み解く【初心者向け】

【オブリビオン・リマスタード】もう MOD 使える【おやつ】

良い子のおっさんのみんな!

オブリビオン・リマスタードが発売から、たったの 4 日で MOD 対応されました。
更に、そこから 2 日で Nexus Mods での一週間の過去最高のダウンロード数を達成したそうです。

MOD を遊び倒していないならこんな記事は見ないし、Nexus Mods を知らないおっさんはいない前提で話を進めます。

続きを読む 【オブリビオン・リマスタード】もう MOD 使える【おやつ】

【C++】ソケット通信のプログラムを最新の環境に合わせておさらい【asio】

オンラインゲームやアドホック通信の通信処理は、どのようなプログラムで動いているんでしょうか?

私は 15 年前くらいに、WinSock を使ってソケット通信のプログラムを組んだことがありますが、あれからもうずいぶんと長い年月が経ってしまいました。
IT の技術は 5 年もすれば化石になるので、思いついたついでに学び直すことにしました。

本稿では、私が学び直したことを、C++ 初心者だったころの自分が理解できるように説明する…というていで進めようと思います。
筆者はゲーム開発特化型なので、ゲームプログラミングの観点で読み解きます。

動作環境
Windows 11 Home
Visual Studio 2022
C++20

更新履歴
25/04/20 記事を公開

続きを読む 【C++】ソケット通信のプログラムを最新の環境に合わせておさらい【asio】

【UE5】全てのプラグインを無効にしたらどうなるの?【おやつ】

UE にはインストールしたままの状態で 200 個近くのプラグインが有効になっています。
プラグインはそもそもが、元のアプリに機能を追加するためのものなので、プラグインを全て無効化してもエディタは問題なく動作するはずです。

動くよね…?

不安になってきたので、試してみました。

動作確認した環境

UE 5.5.3
Windows 11 Home
Visual Studio 2022

続きを読む 【UE5】全てのプラグインを無効にしたらどうなるの?【おやつ】

【UE5】ボーンインデックスってどこで見れるの?【C++】

スケルタルメッシュやスケルトンの編集画面を開くと、ボーンの名前と階層構造は確認できるのですが、ボーンインデックスは確認できません。
見つからないので Editor Utility Widget(以下、EUW) でボーンインデックスビュワーを作りました。

動作環境
Unreal Engine 5.5 Preview, 5.5
Visual Studio 2022
Windows 11 Home

続きを読む 【UE5】ボーンインデックスってどこで見れるの?【C++】

【UE5】詳細で良く見るアセットの種類にクラスでフィルターをかけてコンボボックスから候補一覧を選択するとそのサムネイルも表示してくれるウィジェットを EditorUtilityWidget で使う方法【C++】

Unreal Engine のエディタでスケルタルメッシュやマテリアルなどを選択するときに使うウィジェットがあります。
アイキャッチ画像で示した通りですが、マテリアルやスケルトンなんかを選択するときも、このウィジェットが使われています。

これ、よく見るウィジェットなので、Editor Utility Widget(以下、EUW)でも簡単に使えるだろう…と思い、EUW のデザイナー画面で「パレット」にないか探してみるのですが見つかりません。

実はこれ、ウィジェット(UWidget)ではなく、スレート(Slate)です。
スレートについて細かい説明は割愛しますが、このままでは、Editor Utility Button ウィジェットなどのように、デザイナー画面でキャンバスパネルなどに配置することができません。

本稿では、このスレートをウィジェットとして使えるようにする方法を共有します。
C++ を使う必要があるため、EUW の実装に詳しいテクニカルアーティストやエンジニアが対象となります。

動作環境
Unreal Engine 5.4.4, 5.5 Preview
Windows 11 Home
Visual Studio 2022

続きを読む 【UE5】詳細で良く見るアセットの種類にクラスでフィルターをかけてコンボボックスから候補一覧を選択するとそのサムネイルも表示してくれるウィジェットを EditorUtilityWidget で使う方法【C++】

【UE5.4.4】AnimToTexture の使い方まとめ【最新】

アイキャッチ画像のマネキンはスケルタルメッシュを使っていません。
アニメーションする「スタティック」メッシュです。

公式の City サンプルで使われている AnimToTexture は、VAT(Vertex Animation Texture) によってスタティックメッシュ化したキャラクターにアニメーションさせることができるプラグインです。

本稿では、このプラグインを使って、スケルタルメッシュをアニメーション付きスタティックメッシュに変換する手順と、VAT を使う上で必要になる補足情報について共有します。

動作環境
Unreal Engine 5.4.3 および 5.4.4
Windows 11 Home

続きを読む 【UE5.4.4】AnimToTexture の使い方まとめ【最新】