|使用Unity制作简单水面涟漪效果

|使用Unity制作简单水面涟漪效果

文章图片

|使用Unity制作简单水面涟漪效果

文章图片

|使用Unity制作简单水面涟漪效果

文章图片

|使用Unity制作简单水面涟漪效果

文章图片

|使用Unity制作简单水面涟漪效果

文章图片


使用Unity制作简单水面涟漪效果
这次给小伙伴们带来了一个很简单的水面涟漪做法 , 这个方法有好处也有坏处 , 好处就是实现简单 , 坏处就是动画不够自然 , 我们先来看看效果:

【|使用Unity制作简单水面涟漪效果】这个效果很适合新手来实现 , 更复杂的 , 就需要小伙伴们用数学公式来计算了 , 再配合自己制作的贴图 , 以及通道 , 就能实现很自然的效果 , 我们目前就不展开讲述了 。
关于此次效果 , 我们使用了Unity的ShaderGraph , 只要小伙伴们了解一些shader基础 , 就能很快上手 , 推荐新手 。 但是平时学习 , 更多的是用它来体现一些思路 , 然后自己来写代码 , 因为自己写的代码 , 更自由 , 更容易控制 , 而且 , 如果掌握了手写Shader , 会比较容易上手ShaderGraph , 不知道内置节点?不要紧 , 自己造一个 , 然后替换 , 反正效果已经实现了 。
准备
此次效果完全由UV动画来实现 , 也就是FlipBook , 已经知道的大佬们 , 就不用继续往下了 , 或者也可以看看 , 完善一下 , 回忆一下? 我们需要一张法线贴图:

这是一个4x4的序列动画法线 , 通过FlipBook , 来让其动起来 , 就可以实现酷炫的涟漪:

效果如下:

但是这样未免有点太假了 , 一看就很规则 , 这是大忌 。
精益求精
我们还需要再来一次:

但这样还不够 , 我们还需要柔化:

最后经过这些步骤 , 再把法线混合 , 看到的就是这样的:

但其实这个还远远不够 , 平的地方太平了 , 不自然 , 都能泛起涟漪了 , 水肯定不少吧:
加一层水的法线 , 再混合:

看看最终效果:

最后我们把法线和地表的法线混合就是最终的效果了:

结语
本次内容只是提供给小伙伴们一种实现的思路 , 这种效果的实现方法不唯一 , 得按照项目需求来定义 , 目前大约有三种:
l 利用梯度值
l 利用粒子效果渲染到shader里
l FlipBook
如果小伙伴们还知道其他的实现方法 , 可以留言讨论 。
希望本篇文章能帮到小伙伴们 。

    推荐阅读