搜索
    Unreal Engine 4 帧转移模糊效果的实现与分析
    资源 › 知识库/文章/讯息 › 技术文章 › 元素文章 UE/U3D
    图形图像技术CGGraph渲染图形学

    显示全部标签

    搜索中出现以下关键词标签即可被搜索引擎找到
    楼主可在左边的【标签】按钮中添加
    希望搜索结果同时满足多个条件，可用空格隔开
    • 图形图像技术
    • CG
    • Graph
    • 渲染
    • 图形学
    7258 301
    实名

    通过了实名认证的内容创造者
    利维亚的杰洛特 + 关注 3269
    发布于 2018-4-6 20:30:08

    您需要 登录 才可以下载或查看，没有账号？注册

    x
    这篇文章介绍了类似守望先锋中的帧转移模糊(Smear Frame)效果。

    效果图如下，两个模型实际上都是球：

    1.gif

    Tessellation

    在本质上，这个效果是使用PN Tessellation来对模型进行曲面细分，然后使用world displacement通道来进行顶点的偏移操作。Tessellation能够给模型带来更多的细节，例如盔甲上的凹痕、地形的小起伏等。

    但是需要注意的是：Tessellation非常耗费资源，并且Unreal Engine 4在目前为止（4.12.4）也只支持Windows平台的Tessellation。所以如果需要使用Tessellation的话，需要注意性能以及多平台的处理。

    逻辑实现

    需要实现这个功能，首先需要获得当前物体在前一段时间的偏移量，因此这里创建了一个Component，在每次Tick的时候更新Previous Position。在使用Previous Position进行计算最后，将最后的偏移量传入Dynamic Material Instance进行计算即可。

    完整BP如下：

    2.png

    材质实现

    前提条件

    该材质需要启用Tessellation，选中D3D11Tessellation，设定为PN Triangles，记得启用Adaptive Tessellation。
    此外，由于在Vertex Shader中，无法转换到Local Transform进行计算，所以这里需要两个额外的UV通道用来传递Position信息，因此需要进行设定。
    材质函数封装

    CustomUV通道

    在这个材质函数中，将Position的X、Y信息储存在Custom UV1中，将Z储存在Custom UV2中。



    偏移量的计算

    Smear效果的特征之一就是这个模型的后面那一块（运动反方向）会产生转移模糊的效果，因此需要将Smear的方向与VertexNormal进行点乘，大于0的顶点才进行处理。



    整个材质函数便封装完毕，使用方法如下：



    注意事项

    在Component的逻辑中可以看到Smear的表现效果与帧率有比较大的相关性。在帧率很低的情况下会导致Smear过大，在帧率很高的情况下则会导致Smear过小。

    一种可行的方法是针对于Component进行锁帧处理，让其固定在一个帧率下运行即可。

    我进行了这一块的处理，并且已经Pull Request。

    评分

    参与人数 1活跃度 +10 展开 理由
    to1 + 10 【点赞】这很有大网气质！

    查看全部评分

    还没有设置签名！您可以在此展示你的链接，或者个人主页！
    使用道具 <
    流云飞魄  发表于 2018-4-7 07:56:27  
    2#
    感谢大神赐教，此文将作为技术教科书留存！！！！！！
    回复 收起回复
    使用道具
    Weidaliya  发表于 2018-4-7 12:09:16  
    3#
    资源甚好，发帖艰辛，且阅且珍惜！
    回复 收起回复
    使用道具
    彭。  发表于 2018-4-10 09:22:05  
    4#
    sdgfgzsgsg
    回复 收起回复
    使用道具
    Weidaliya  发表于 2018-4-19 11:32:44  
    5#
    感谢分享这么好的教程资源！~~~
    回复 收起回复
    使用道具
    织梦者与游梦人  发表于 2018-4-19 18:36:59  
    6#
    啡网纹哇
    回复 收起回复
    使用道具
    Pang.k  发表于 2018-5-24 19:22:11  
    7#
    66666666666666666666666
    回复 收起回复
    使用道具
    潘墩墩  发表于 2018-10-15 09:09:03  
    8#
    强强强厉害了
    回复 收起回复
    使用道具
    E.vs.E  发表于 2018-10-15 09:18:11  
    9#
    Unreal Engine 4 帧转移模糊效果的实现与分析
    回复 收起回复
    使用道具
    E.vs.E  发表于 2018-10-15 09:18:17  
    10#
    Unreal Engine 4 帧转移模糊效果的实现与分析
    回复 收起回复
    使用道具
    gaoke313495557  发表于 2018-10-15 09:25:07  
    11#
    谢谢分享
    回复 收起回复
    使用道具
    akbinlin  发表于 2018-10-15 09:25:43  
    12#
    强强强 碉堡了 我们都不懂这么做
    回复 收起回复
    使用道具
    qq_在云端_glK  发表于 2018-10-15 09:28:32  
    13#
    碉堡了 我们都不懂这么做
    回复 收起回复
    使用道具
    悚魅  发表于 2018-10-15 09:36:19  
    14#
    感谢分享
    回复 收起回复
    使用道具
    卖套套的小男生  发表于 2018-10-15 21:27:26  
    15#
    八个
    回复 收起回复
    使用道具
    东风轻起  发表于 2018-10-15 21:34:14  
    16#
    回复 收起回复
    使用道具
    jddt  发表于 2018-10-15 22:06:55  
    17#
    八个
    回复 收起回复
    使用道具
    胖-哒  发表于 2018-10-15 22:09:58  
    18#
    感谢分享~~~~
    回复 收起回复
    使用道具
    ceeka  发表于 2018-10-15 22:14:18  
    19#
    想要成大触，天天上元素！
    回复 收起回复
    使用道具
    886677  发表于 2018-10-15 22:35:30  
    20#
    无法理解的内容，但还是要凑够8次回复摇奖
    回复 收起回复
    使用道具
    12345678910... 16下一页
    高级模式
    B Color Image Link Quote Smilies
    您需要登录后才可以回帖 登录 | 注册

    本版积分规则

    素材推荐
    提醒
    0
    快速回复 返回顶部 返回列表