Ocarina of Timeのタイトル画面のように「フレーミング」効果を作成するにはどうすればよいですか？

102

以下に示すN64ゲーム「ゼルダの伝説：時のオカリナ」のタイトル画面のロゴのような炎のような効果を再現したいと思います。

ROMで使用されるテクスチャをざっと見てみると、エフェクトに似た単一の32x32テクスチャが提供されますが、そのイメージ（正しいイメージであると仮定）がロゴに表示されるエフェクトにどのように変換されるかわかりません。

同様の何かを実装するにはどうすればよいですか？

graphic-effects

— ネイサンバーン
ソース

他のゲームが特定の結果をどのように実装したかを質問することをトピックと見なさないため、同様の効果を達成する方法を尋ねるためにあなたの質問をわずかに調整しました。

— ジョシュ

手続き型のテクニックを要求していますか、それとも簡単な既成のエフェクトで十分ですか？

— バリント

私は完全な答えを書く時間と知識がありませんが、多分それはカラーサイクリングを介して行うことができます。

— アレクサンドル・ベイランクール

@JoshPetrieありがとう、それは私が本当に

— 望んでい

私がこのテクニックを覚えていることから、難しいのは、色そのものではなく、適切なパレットを使用してピクセルで画像を作成することです。サイクリングは、色のサブセットのコードで行われます。

— アレクサンドル・ベイランクール

回答:

248

まず、ロゴ/テキストの黒地に白のマスクを作成し、ぼかします。

次に、繰り返し（タイル化可能）ソリッドノイズテクスチャを作成します（ここではGIMPを使用します）

Map-> Tile ...フィルターを使用して、次のステップで3x3のタイルパターン（この例では128x128 x 3 = 384x384）を作成し、テクスチャがまだ再現可能であることを確認します-中心部分のみを保持します。

Blur-> Motion Blur ...を使用して、テクスチャを上方向にぼかし、中央のみを1/3に保ちます（128x128に戻します）

GPUで両方のテクスチャを乗算し、不透明度に使用します。

次に、パターンテクスチャをマスクテクスチャの上に移動してアニメーション化します。

アニメーション部分は完了です。

次に、グラデーションマップ（黒->赤->黄->白）を適用して、火の色を付けることができます。

他の色を使用して、ひどく青い火、明るい黄色のオーラフィールド、よりスモーキーな効果などを作成できます。

これをロゴと3Dレンダリングに加法として組み合わせると、目的の効果が得られます。

+ + =

マスクおよび/またはパターンの明るさ、および/または頂点の色、および/またはグラデーションカラーマップを設計されたレベルに調整することにより、効果を暗くすることができます。

異なる速度と方向で2つのテクスチャパターン（マスク*発射パターン*発射パターン）を一緒に使用して、より複雑な発射効果を作成することもできます。

技術的には、N64では、テクスチャに関するN64のハードウェアの制限により、マスクテクスチャの代わりに三角形メッシュと頂点カラーを使用して、マスクの近似値が作成されている場合がありますが、最終結果は同じです（（頂点カラー*パターンテクスチャ）vs（マスクテクスチャ*パターンテクスチャ））。

頂点カラーを引き続き使用できますが、20年後、生活を楽にし、2つ以上のテクスチャを使用することができます。今日のモバイルGPUでも、問題なく256x128のグレーテクスチャを追加処理できます。

— ステファン・ホッケンハル
ソース

私たちには勝者がいると思います-@StephaneHockenhullに感謝、これはまさに私が探していた種類のテクニックです

— -nathanburns

聖なる牛これは良い答えです！

— ジョンゴードン

「ひどく」または「幽霊」？

— CJデニス

また、「見た目が悪い」という意味もあります。「そのネクタイを着用しないでください;それは恐ろしいです」。私はあなたの文章を「他の色は本当に悪いまたは煙の効果を与える可能性がある」と解釈しました。「ゴーストリー」は、あなたが望むほど強くなくても明確です。

— CJデニス

私はあなたに非常に真剣な馬の抽選のための2番目の賛成票を与えることができたらいいのにと思います。

— 認識

いくつかの方法がありますが、私の頭の上では、

1）炎+ロゴをすべて1つの画像にまとめ、本質的にスプライトシートでアニメーション化します。

2）UIレイヤーでロゴをレンダリングし、UIレイヤーの粒子効果をその周りに配置します。

その画像の外観から、3層の盾と剣、炎、テキスト（背面から前面に並べられている）があるように見えます。

同様の効果を得るには多くの方法がありますが、選択する方法は、開発中のエンジンと実装可能なものに依存します。

— 不明
ソース

ROMに小さな炎のテクスチャが含まれている場合、これは何らかの粒子効果で行われていると思います。

これは、最初にタイトルとロゴのスプライトを画面に配置することによって行われます。次に、タイトルスプライトの背後に炎の効果を作成する多数のパーティクルエミッタを配置します。つまり、Z /画面の奥行きは、タイトルの背後にレンダリングされるほどです。

GameMakerのパーティクルエフェクトを使用して、このアプローチの可能性について考えさせるフレームを作成する例を次に示します...

http://martincrownover.com/gamemaker-examples-tutorials/particles-fire/

— ティム・ホルト
ソース

提案をありがとう-テクスチャがリンクしたチュートリアルのテクスチャとは異なり、代わりに透明度なしで32x32スペースを埋めると仮定すると、粒子でこれを行う明らかな方法はありますか？

— ネイサンバーンズ

オリジナルに透明度がない場合は、パーティクル用に独自のフレームテクスチャを作成します。ここでの私の仮定は、元のタイトルが完全なアニメーションスプライト（フレームエフェクトを含む）で行われない限り、おそらくパーティクルエフェクトであるということです。

— ティム・ホルト

@TimHoltニンテンドー64のハードウェア機能を過大評価している可能性があります。この方法で「ソリッド」に見える炎効果を生成するには、ハードウェアがレンダリングできるよりもはるかに多くのパーティクルが必要でした。

— 夕暮れ

@duskwuff-true。しかし、ユーザーがこれを古いハードウェアに実装しているとは思わない。答えはまともな（現代の）システムにとって有効なものです。

— ティム・ホルト

@duskwuff質問は、今それをどのように実装するかです。他のゲームがどのようにしたかについての質問（および回答）はここでは話題外です。N64のハードウェア機能はここでは無関係です。（ジョシュペトリーズの質問へのコメントを参照）