【游戏开发实战】教你在Unity中实现模型消融化为灰烬飘散的效果(ShaderGraph | 消融 | 粒子系统 | 特效)
文章目录
- 一、前言
- 二、ShaderGraph环境准备
- 三、模型准备:原神角色模型
- 四、实现思路
- 1、效果一的实现思路
- 2、效果二的实现思路
- 五、ShaderGraph具体实现
- 1、效果一
- 1.1、创建Unlit Shader Graph
- 1.2、获取顶点坐标的y轴坐标
- 1.3、滑块控制
- 1.4、边缘噪声
- 1.5、AlhpaClip控制
- 1.6、边缘渐变色
- 1.7、输出基础色
- 1.8、顶点坐标扰动
- 1.9、插值计算顶点坐标
- 1.10、完整节点图
- 2、效果二
- 2.1、创建Unlit Shader Graph
- 2.2、双噪声叠加扰动
- 2.2、计算AlphaClip
- 2.3、计算描边
- 2.4、基础色
- 2.5、完整节点图
- 2.6、粒子的节点图
- 六、材质球设置
- 七、粒子系统设置
- 八、C#代码控制材质球属性
- 九、最终运行效果
- 十、工程源码
- 十一、完毕
一、前言
嗨,大家好,我是新发。
有小伙伴在提问区给我提了这个问题,想要做一个模型消融化作灰烬飘散的效果,
我之前写过一篇ShaderGraph
的教程:《ShaderGraph使用教程与各种特效案例》
里面实现了多种常见的特效效果,也包括消融的效果,不过没有实现灰烬飘散的效果,今天,我就尝试使用ShaderGraph
来实现这个效果吧~
本文我实现了两种效果,最终如下:
话不多说,我们开始吧~
二、ShaderGraph环境准备
因为本文我使用的是Unity
的ShaderGraph
来实现上面的效果的,需要先安装ShaderGraph
相关插件,并做一些基础设置。
可以查看我之前这篇博客《ShaderGraph使用教程与各种特效案例》的环境准备部分,这里我就不赘述具体操作了。
三、模型准备:原神角色模型
本文我使用的是原神的角色模型,我之前写过一篇文章讲如何从原神官网下载角色模型并制作成FBX
格式导入Unity
的教程,感兴趣的同学可以看下:《【游戏开发实战】下载原神模型,PMX转FBX,导入到Unity中,卡通渲染,绑定人形动画(附Demo工程)》
四、实现思路
在讲具体操作之前,我先说一下实现思路,本文我实现了两种效果,这里分别讲一下。
1、效果一的实现思路
效果一
思路:使用Alpha Clip
对模型进行裁切,切口处做一层随机噪声来控制Alpha Clip
,并使用随机噪声对消融的顶点做坐标扰动,最后混合一个颜色即可。
画个思维图,
2、效果二的实现思路
效果二
思路:依然是使用Alpha Clip
对模型进行消融控制,在此基础上,再添加一个粒子效果,粒子的喷射Shape
使用角色的网格,粒子加一些噪声扰动,达到风吹的效果,再根据滑块的值分别控制消融进度和粒子的喷射属性即可。
注:这个效果并不是那些消融的碎片作为灰烬飘散,而是粒子单独去喷射一个灰烬的效果,其实有点障眼法,这是我想到的一个取巧的办法,如果你有更好更逼真的办法,欢迎交流。
画个思维图,分两个,一个是模型的,如下
还有一个是粒子的,粒子的稍微简单一点,就是贴图采样,然后混合顶点颜色,再使用贴图采用的Alhpa
通道来控制Alpha
,
五、ShaderGraph具体实现
1、效果一
1.1、创建Unlit Shader Graph
这里我不考虑光照效果,所以创建Unlit
的Shader
,在Project
窗口右键点击菜单Create / Shader / Universal Render Pipeline / Unlit Shader Graph
,如下
双击创建的文件即可打开Shader Graph
编辑器。
1.2、获取顶点坐标的y轴坐标
我们先通过Position
节点拿到顶点坐标(注意我这里取的是Object
空间下的坐标),再通过Split
拿到G
分量,也就是顶点坐标的y
坐标,
1.3、滑块控制
创建一个float
节点,命名为disolve
,并转为属性,类型选择Slider
(即滑块),用它与刚刚的顶点坐标的y
分量做一次平滑阶跃,得到的这个输出可以作为后面颜色混合和顶点扰动的输入,
1.4、边缘噪声
接着我们创建一个噪声节点Simple Noise
,通过定时器控制UV
偏移,如下,这个噪声用于对边缘进行扰动,
1.5、AlhpaClip控制
我们把噪声与滑块值相加,再与定点坐标的y
分量做一个Step
阶跃,得到颗粒感的边界,最后反一下,作为AlphaClip
的输入,
需要注意Alpha
与Alpha Clip
的关系:当Alpha Clip
的值比Alpha
大的时候,像素颜色就会被丢弃,一般我会把Alpha
设置为0.5
,
1.6、边缘渐变色
把步骤1.3
的输出拿过来,与一个颜色混合,再进行加强,得到一个边缘渐变色,
1.7、输出基础色
对贴图进行采样,与边缘渐变色混合,作为基础色输出到片元着色器的Base Color
,
1.8、顶点坐标扰动
我想要消融的地方的顶点有一个坐标扰动的效果,我构造了一个坐标扰动的噪声,如下,这里的扰动规则可自行发挥,我是采用Simple Noise
对x
、y
轴进行扰动,使用Gradient Noise
对y
轴进行扰动,
1.9、插值计算顶点坐标
我们把噪声与顶点坐标相加,再通过滑块控制线性插值,得到最终顶点坐标,输出给顶点着色器的Position
,
1.10、完整节点图
最终完整的节点图如下,肯定看不清,只是给大家看下整体结构,想要看细节的同学可下载本文的工程源码进行查看,
2、效果二
2.1、创建Unlit Shader Graph
同理是先创建一个Unlit Shader Graph
,双击打开。
2.2、双噪声叠加扰动
消融效果需要一个噪声,我这里采用了双噪声叠加的方式,分别对噪声一噪声二的UV
的V
分量做相反反向的偏移,最终混合出一个双噪声混合的效果,
2.2、计算AlphaClip
我们创建一个float
节点,作为滑块,与刚刚的噪声做一个阶跃,输出结果作为AlphaClip
,
片元着色器的Alpha
设置为0.5
,
2.3、计算描边
滑块与噪声做一个阶跃,再与刚刚计算的AlphaClip
相减,就可以得到噪声的描边了,再混合一个颜色即可,
2.4、基础色
对贴图进行采样,然后与描边色混合,最终输出到片元着色器的Base Color
,
2.5、完整节点图
最终完整的节点图如下,肯定看不清,只是给大家看下整体结构,想要看细节的同学可下载本文的工程源码进行查看,
2.6、粒子的节点图
粒子的ShaderGraph
比较简单,主要控制在粒子系统的参数本身,Shader Graph
节点图如下,
六、材质球设置
本文的角色的材质球分了多个,比如头发、衣服、表情等,
我们分别给每个材质球设置对应的shader
,设置贴图等,
因为消融的时候要统一控制disolve
属性,下文我们就是用C#
代码来对齐进行统一控制好了。
七、粒子系统设置
效果二需要一个粒子效果,贴图我自己画了一个,作为灰烬的贴图,如下
粒子的设置关键的一步就是设置Shape
,是用角色的网格作为Mesh
,如下,
这样粒子喷射的时候就是以网格的形状来喷射了,
还有就是粒子的噪声扰动,可以对粒子运动轨迹、旋转、大小进行扰动,
另外是一些生命周期内的属性控制,比如作用力、颜色、大小等,
关于粒子系统的教程,我之前写过几篇文章,感兴趣的同学可以看下:
《【游戏开发实战】Unity使用ParticleSystem粒子系统模拟药水在血管中流动(粒子碰撞)》
《【游戏开发实战】手把手教你使用Unity制作一个飞机喷射火焰尾气的粒子效果》
《【学Unity的猫】第十五章:Unity粒子系统ParticleSystem,下雪啦下雪啦》
《【游戏开发实战】Unity使用ShaderGraph配合粒子系统,制作子弹拖尾特效(Fate/stay night金闪闪的大招效果)》
《【游戏开发实战】Unity ShaderGraph溶解效果运用到粒子系统中(利用顶点色的alpha通道控制)》
《【游戏开发实战】权游红袍女在火中看到了什么,我看到了…(Unity | 粒子系统 | 火焰特效 | ParticleSystem | 手把手制作)》
八、C#代码控制材质球属性
我们做一下简单的UI
界面,弄一个Slider
滑块,如下,
创建一个PlayerMaterialCtrler.cs
脚本,用于控制角色材质球属性,
代码很简单,如下
using UnityEngine;
using UnityEngine.UI;public class PlayerMaterialCtrler : MonoBehaviour
{[SerializeField]private Slider disolveSlider;private Material[] materials;private int disolveId;void Start(){var renderer = gameObject.GetComponentInChildren<Renderer>();materials = renderer.materials;disolveId = Shader.PropertyToID("disolve");disolveSlider.onValueChanged.AddListener((v) =>{for (int i = 0, len = materials.Length; i < len; ++i){materials[i].SetFloat(disolveId, v);}});}
}
我们再创建一个ParticleSystem.cs
脚本,用于控制粒子的喷射,代码如下,
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;public class ParticleCtrler : MonoBehaviour
{[SerializeField]private Slider slider;[SerializeField]private ParticleSystem ptc;void Start(){var emission = ptc.emission;var ptcMain = ptc.main;emission.rateOverTime = 0;slider.onValueChanged.AddListener((v) =>{if (v > 0.7f){emission.rateOverTime = 0;}else if (v < 0.35f){emission.rateOverTime = (int)(v * 1000);ptcMain.startSize = 0.07f * v;}else{emission.rateOverTime = (int)((0.7f - v) * 2000);ptcMain.startSize = 0.07f * v;}});}
}
把PlayerMaterialCtrler.cs
脚本挂到角色根节点上,并赋值Slider
对象,
把SparkParticle.cs
脚本挂到粒子节点上,并赋值成员对象,如下
九、最终运行效果
运行Unity
,最终效果如下,
十、工程源码
本文工程源码我已上传到GitCode
,感兴趣的同学可自行下载学习。
地址:https://codechina.csdn.net/linxinfa/UnityDissolveAshEffect
注意:我使用的Unity
版本是2021.1.7f1c1
,使用的ShaderGraph
版本是11.0.0
,如果你使用的版本与我不同,可能会有兼容问题。
十一、完毕
好啦,就到这里吧~
我是林新发:https://blog.csdn.net/linxinfa
原创不易,若转载请注明出处,感谢大家~
喜欢我的可以点赞、关注、收藏,如果有什么技术上的疑问,欢迎留言或私信~
【游戏开发实战】教你在Unity中实现模型消融化为灰烬飘散的效果(ShaderGraph | 消融 | 粒子系统 | 特效)相关推荐
- 三维游戏开发实战--狙击僵尸(unity开发)
1.需求分析 地形设计,对游戏地形进行设计比如挖坑造河等. 场景设计,种树.种草.摆放房屋建筑等. 第一人称视角实现,WASD前后左右移动,空格键进行跳跃,按左Shift进行加速. 敌人的简单制作,敌 ...
- 【游戏开发实战】Unity手游第一人称视角,双摇杆控制,FPS射击游戏Demo(教程 | 含Demo工程源码)
文章目录 一.前言 二.实现方案 1.无主之地,第一人称视角 2.我之前做的摇杆控制 3.第一人称视角 + 摇杆控制 三.开始实战 1.资源获取:Unity AssetStore 2.Low Poly ...
- 【游戏开发实战】用Go语言写一个服务器,实现与Unity客户端通信(Golang | Unity | Socket | 通信 | 教程 | 附工程源码)
文章目录 一.前言 二.Go开发环境搭建(Windows系统) 1.安装Go命令行工具 2.创建GoWorkspace目录 3.配置GOPATH环境变量 4.配置GOPROXY代理 5.安装VSCod ...
- 《Unity 5.x游戏开发实战》一1.9 添加一个水平面
本节书摘来异步社区<Unity 5.x游戏开发实战>一书中的第1章,第1.9节,作者: Alan Thorn 译者: 李华峰 责编: 胡俊英,更多章节内容可以访问云栖社区"异步社 ...
- 【Unity】动作游戏开发实战详细分析-07-连续技与组合技功能设计
[Unity]动作游戏开发实战详细分析-07-连续技与组合技功能设计 基本思路 在一些动作游戏中,存在着连续技这一功能,具体来说就是连续按下规定的按键会触发能力的功能,或者是长按触发等等. 实现解析 ...
- 《Unity 2D与3D手机游戏开发实战》简介
#好书推荐##好书奇遇季#<Unity 2D与3D手机游戏开发实战>,京东当当天猫都有发售.彩色印制,定价89元,网店打折销售更便宜.本书配套源码.PPT课件,适合Unity游戏开发初学者 ...
- 【Unity】动作游戏开发实战详细分析-16-敌人AI设计
[Unity]动作游戏开发实战详细分析-16-敌人AI设计 基本思想 本文来实现简单的敌人AI,使用协程来开发AI.如果想要使用行为树插件可自行学习使用. 代码实现 敌人的目标信息结构 用于存储所有的 ...
- 【游戏开发实战】Unity从零开发多人视频聊天功能,无聊了就和自己视频聊天(附源码 | Mirror | 多人视频 | 详细教程)
文章目录 一.前言 二.思考问题与解决方案 1.思考问题 2.解决方案 2.1.Unity中如何开启摄像头并对图像进行采样 2.2.图像如何中转给其他客户端 2.3.如何实现清晰度切换 2.4.客户端 ...
- 【Unity】动作游戏开发实战详细分析-06-技能系统设计
[Unity]动作游戏开发实战详细分析-06-技能系统设计 基本思想 不同的技能可以设计为技能模版,当角色释放技能时,会通过模版ID将它进行实例化,这个实例技能类可以是一个挂载的MonoBehavio ...
最新文章
- pip 将 某包指定到某目录 批量安装
- 如何使用TensorCores优化卷积
- linux修改vim配色,更改vim配色的具体操作 更改vim配色的图文教程
- css3自适应布局单位vw,vh你知道多少?
- Netty工作笔记0037---主从Reactor多线程
- android的多行文本框的值,Swift - 多行文本输入框(UITextView)
- Ubuntu16.04版安装VMwareTools的步骤和没法挂载目录问题的解决
- 计算机命令关闭445端口,关闭445端口命令是什么?设置关闭445端口的步骤教程
- 常用计算机维修方法有哪些,计算机常见硬件故障的诊断及其处理分析
- 微信小程序:王者荣耀吃鸡气泡等等头像框DIY在线生成N种风格
- Git 之 多人协同开发工作流
- 说唱天王 Eminem 自传《The Way I am》2
- 三子棋?玩我自己的!
- 很好看的Mac Terminal配色
- 计算机毕业论文进展情况说明,研究生学位论文进展情况 毕业论文的进度和计划安排怎么写~~请详细些~~...
- cocos2dx之Chipmunk
- 单位增益缓冲器的反馈路径中电阻的作用是什么?
- 一点点对WebResource.axd的配置及使用[原创]
- torch.nn.MaxPool2d详解
- HTML5新特性之标签使用:header、nav、aside、main、footer......
热门文章
- Python 调用Vpython编写三体运动模型(不含碰撞)
- deepin开启远程桌面后鼠标右键不能复制
- 人工智能翻译能否取代人工翻译
- 当你收到大厂面试通知后,如下的准备可以大大提升面试成功率
- 信息检索导论-干货速览
- 2023年天津农学院专升本招生计划及专业报考范围
- 【单片机毕业设计】【mcuclub-217】空气质量检测(甲醛、甲苯) | 环境检测 | 气体检测 | 室内有害气体检测
- C# 代码规范和质量检查工具 StyleCop.Analyzers
- 谷歌源码输入法修改版(支持拖动,放大缩小)
- 自然科学如何可能---读《三体》第一部第一节---科学边界