[美术] 用 shader 画真实风格的火焰的步骤

楼主: YoshiCasa (Yoshi Casa)   2022-03-07 17:56:55
https://www.youtube.com/watch?v=nonpwfnGiNQ
这是我画真实风格的火焰的步骤,
成品是 2D,但是可以让物件永远面向摄影机来变 3D。
用图片说话,从左上开始。
[火焰颜色]
左上一:
先做一个简单的 fbm texture,
并让它从下往上移动。
如果不知道 fbm 是什么,
需要先把这本书读完。
https://thebookofshaders.com/
左上二:
从黑白变橘红色
n = fbm( uv );
color = vec3( 1.5n, 1.5n, n );
至于变蓝变绿,只是 rgb 变 grb 或 gbr 的把戏而已。
左上三:
火焰下方要暗一点,可以用
color = color * ( 1.0 - uv.y );
火焰中心要亮一点,可以用
uv.x = uv.x - 0.5;
color = color * ( 1.0 - abs( uv.x ));
让火焰上下方亮度不同,
增加真实感。
[火焰型状]
左下一:
n = fbm( uv )
调对比 n = pow( n, contrast )
调亮度 n = whiteness * n
消除浅色区块 n = n - dnoise;
合起来是
color = vec4( vec3( whiteness * max( 0, pow( n, contrast ) - dnoise )), 1.0 );
左下二:
用左上一的参数,
加上 uv.y 调整,
让越上面的区块越稀疏,
越下面越浓密,
调整成火焰的外型。
左下三:
用 alpha = length( uv ); 的技巧,
可以做出椭圆形的渐层,
修改一下 uv 比例可以调整为蜡烛状。
左下四:
利用左下二和三当 mask,
套用左上三的颜色,
就能做出各种风格的大火或是烛光。
左下五:
也能做有趣的火焰钻头。
作者: sargent (Conditional)   2022-03-07 18:08:00
哇 真的很像火燄欸 很有看游戏机画面的感觉 谢谢分享
作者: strangechu (電冰箱)   2022-03-08 13:11:00
Github是不是没有公开 看不到
作者: wel0789321 (在意你就输了)   2022-03-12 13:18:00
感谢分享

Links booklink

Contact Us: admin [ a t ] ucptt.com