Heliodor 2021/03/22 20:28

少しだけ詳しく水たまりプログラム説明 その2

疲れているときにお気に入りの曲を聴くと、やけにテンポが早く感じるような、遅く感じるような……。

きっと脳クロックがバグってます。ヘリオドールです(挨拶)。



前回(その1)ではステンシルで単純に水面画像を切り抜いて、不自然極まりないものが出来上がりました。そりゃハサミで切ったように切り抜いたらそうなりますよね。

……そうなんです。ステンシルの境界面はαマスクのようなグラデーションが使えません。

そこでどうにかしてフチの部分をもう少しマシなものにできないものかと考えた結果、異なるサイズのステンシルで切り抜いた水面を重ねたらどうだろう?と思いつきました。

大きめのステンシルで切り抜いた水面を半透明で描画し、次に小さめのステンシルで切り抜いた水面を半透明で重ねて描画、さらに小さめの水面を……とやっていき、エッジの部分が数段階グラデしているように見せるわけです。
(と、言葉で説明しても分かりにくいので画像を用意しました)



まず、大きめのステンシルで切り抜いた水面を半透明で配置します。


次に、ひと回り小さいステンシルで切り抜いたものを重ねます。

最後に不透明の水面を重ねて出来上がり。




これでフチがグラデーションっぽく……

ないですね。orz

なんかPS1時代の海の波打ち際の無理やりな表現というか、ドット絵ゲーム機時代にパレットアニメで波打ち際を表現していた時みたいというか、そんな風にあからさまに色の段階が見えますね。

これは3枚しか重ねていないので、さらに10枚、20枚重ねればもっと滑らかにグラデーションできると思いますが、ちょっとそれは努力の方向が違うような……。というか重過ぎる。


方針転換

これまでは、背景画像の上に、適当に切り抜いた水面を置いていました。
そこでフッと思ったんです。これ、逆にすればどうかな?と。


まず、一番最初に作ったただの長方形の水面を配置します。

そして水面の形に切り抜いておいた画像を用意し……。

水面に重ねて配置する!

お、これは行けるのでは……?ステンシルとは何だったのか。


動くとこんな感じに

このままだと水面があまりにものっぺりしすぎているので、試しに適当なテクスチャ画像をもってきて、適当にアニメーションさせて表示してみます。
(ちなみに "texture milk" をキーワードにして画像検索しました)


うむ!今までと比べるとそれっぽい!


補足
この水面のアニメ(プレイヤーが発生させた波ではなく、水面全体の模様がゆっくりゆらうら動いているヤツ)は、ただメッシュの各頂点のテクスチャ座標を動かしているだけで、メッシュの頂点自体が動いているわけではありません。



	// xindex 横方向の頂点番号
	// zindex 縦方向の頂点番号
	// xcount 横方向の頂点数
	// zindex 縦方向の頂点数
	Vec2 getTexCoord(int xindex, int zindex, int xcount, int zcount) {
		float tx = 0.02f * cosf(xindex*0.2f + zindex*0.2f + m_Time * 0.04f); // m_Time はアニメ用のフレーム番号
		float tz = 0.02f * sinf(xindex*0.2f + zindex*0.2f + m_Time * 0.04f);
		return Vec2(
			(float)xindex / (xcount - 1) + tx,
			(float)zindex / (zcount - 1) + tz
		);
	}

こんな感じで、頂点ごとに少しずつ位相をずらした円を描くように、テクスチャ座標を移動させているだけです。

これで一応、一番最初に目標としていたモノは出来上がったことになります。
水面の形とか、フチの部分のぼやけ具合とかはペイントツールでいくらでも調整できます。




だがしかし

ここで、ある問題が発覚します。
「これではイカン」となったわけです。



つづく









おまけ

愛用のドンキPCがTwitterでトレンドになってて「何事!?」と思ったらこんな記事が。
https://news.livedoor.com/article/detail/19892240/

CPUがCeleron N4100という以外、私が去年買ったドンキPC(19,800円)とほぼ同じスペックで49,800円!?マジか



で、そのCPU性能をPassMark(戦闘力みたいなもの)で比較してみると……。

私が愛用しているドンキノートのCPU(MUGA3)
Celeron N3550 →1164

今回新発売のノートPCのCPU
Celeron N4100 →2461

私が愛用している十年ぐらい前のデスクトップPCのCPU
Core i7 2600 →5308


結論:Sandy Bridgeはまだ戦える
(※あやかし紅白戦はドンキノートのスペックでも動きます)


まあ大したことやらんし、GPU内蔵のi5あたりで適当に作っちゃってもいいんですが、それならまだ今のままでもいいかなぁって……。

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

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

記事のタグから探す

月別アーカイブ

限定特典から探す

記事を検索