BlueRoseNote/02-Note/演讲与教程笔记/究极风暴渲染技术.md
2023-06-29 11:55:02 +08:00

118 lines
17 KiB
Markdown
Raw Permalink Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

---
title: 究极风暴渲染技术
date: 2022-08-09 13:55:15
tags:
rating: ⭐️
excerpt:
---
此文为转载  转载地址此文中已注明,本地址转载请注明 http://blog.sina.com.cn/diorsolo 
重视画面效果的DOF        图A是应用DOF前的状态。在这个基础上由于适用了从ZBuffer中抽出的(unfocusmask)虽然再现出了DOF但是因为在角色上有轮廓线Outline模糊的部分和不模糊的部分的差距鲜明的显出了轮廓若隐若现图C。因此像图D那样在unfocusmask本体上加上Blur来抑制上述的不合适图E。实际仔细看来本来的焦点应该符合背景而显得模糊但考虑图像的融合还是采用了这种方法。顺便说一句Blur使用了高斯filter来处理可以很轻松的完成。【千里马肝注这的确是一个让unfocus部分与focus部分更柔和融合的小trick。】
![](https://cdn.jsdelivr.net/gh/blueroseslol/ImageBag@latest/ImageBag/NARUTO/C936EB7747674CEEAE7990DA20272D9B.jpeg)
### 火焰的特效
      图A里是佐助的[豪火球忍术]图B是实际的模型构成。这个特效可以由中心的球体模型图C平面的正面化模型图DE对应移动的生成平面多边形的轨迹模型图F这三个部分构成把这些合成后可以实现拥有2D的样子并在3D空间中没有不协调感的特效。还有适用于Flare或轨迹的动画用贴图如图所示各自八张的循环,每个一种但是担任特效的下田星儿先生表示最初是做成了平均性形状的多边形在实际组合时让多边形变形即使用一个种类的循环动画也能够表现出形态丰富的火焰。顺便说一句这个特效为了再现动画版的时间虽然是一秒内8到15个画面但游戏本身是按30fps活动。试验性的尝试过60fps和15fps但在60fps中不能流畅的做出活动的动画一旦用15fps做出动画作为游戏的反应就变差了。
      
http://www.opengpu.org/forum.php?mod=viewthread&tid=6609&extra=page=1 转载原文地址尊重作者劳动
## 为了让动画片和游戏没有界限
      本作是在06年初时开发的当时Xbox360刚在日本发售PS3的发售还要有些时候这时不论是谁都在思考着今后的次时代游戏的开发战略。在这样的状况中负责开发CyberConnect2公司的董事社长松山洋先生决心把[伴随着次世代机的图形性能飞跃的提高,各种开发经费也高涨]这个问题,通过以全世界的市场作为目标进行开发而得到突破。
      为了实现这个坚固的理念,深思熟虑过我们自己对于世界的优势,导出的方针就是[把日本独有的动画和漫画的表现贯穿始终],那就成为了所谓的[把动画和游戏的界限消除]的具体目标。为了这个目标首先编成了10人的研究开发组作为先头部队这期间有7名设计师进入开发组内从事制作被称为[超动画]的[贯穿始终]的视觉表现的预想影像经过了半年时间终于在3dsMax上做了出来。
      
      为了达成目标如动画般的画面表现,本作的动画全部用手工完成,一方面是松山先生回想起那些庞大的工作量就说[总之是动作组MotionTeam一直很努力才顺利前进],另一方面动作指导的石桥洋平先生也回答说[确实太辛苦了,但是有研究开发时适当策略可供参考,所以可以冷静的应对]。确实是可靠的言词。
      还有本作是有动画版权的游戏所以要由原版权公司检查。具体上和动画设定的出入对于游戏中存在的IF假象剧情原创忍术的[奥义]的表现进行检查。这些都给予了细心的注意,动画师不时地一边参照动画影像一边进行工作,还要根据每个负责人的文字描述做出概念,之后由导演进行核对,整个工程全部的阶段都要在内部核对,要做到尽可能不返工的程度,用这样精炼的制作来接受原版权公司的监督。职员们这样的努力,已经出色的成为本作的一个理念[兼顾画面的观赏性和作为游戏的游戏性这样的两个目标]。事实上在本作的预告片公开时,也能看到用户和游戏业界对于过高的游戏品质比起动画业界发出了更多的赞赏声。
      最后,通过采访最有印象的是,开发职员要面对把原作动画作为初始的动画本身,从言词的细微传来了敬意和热爱。从下页开始要介绍这种丝毫不妥协的热爱,平时挑战各种各样限制本作构思和技术平衡的真髓。
### 让人感觉不到CG噪音的简单角色表现
动画作画的关键就是对信息量的控制。用少量的信息表现出强烈的个性,怎么才能做出活灵活现的角色呢?
![](https://cdn.jsdelivr.net/gh/blueroseslol/ImageBag@latest/ImageBag/NARUTO/704A99E2037A4B2BBA320465980DA40E.jpeg)
### 角色模型的LOD
      角色的建模使用3dsMax。图里是主人公漩涡鸣人的身体和头的建模从左开始是高、中、低模。多边形数量各自为高模16000头部2400、中模8000头部1400、低模4000头部700基本上由从镜头的距离算起5米以内、5到7米、8米以上来区分以此进行LOD处理。梅田公一先生表示这是为了在减轻描画处理负荷的同时表现出动画特有的[远处的东西被画出线条是经过整理的形态]。还有,有时有必要让人清楚的看到表演性质的脸,还会发生由于大量的角色登场引起的负荷上升那样局面的情况,要根据情况强制性的切换高模或是低模。还有,脸上使用到了很多的多边形,本作中使用法术时结印的手指也分配到了相当精细的多边形。
【千里马肝注:临、兵、斗、者、皆、阵、烈、在、前。这九个字源于东晋葛洪的《抱朴子*登涉篇》,(葛洪者,乃东晋时结合儒家思想改造道教,宣扬采药炼丹、长生不老的人,至此,道教变成为封建统治服务的宗教)“临兵斗者,皆数组前行,常当视之,无所不辟。”  意思是说,常念这九个字,就可以辟除一些邪恶。在抄录这九个字时,把“数、组、前、行”误抄成“阵、列、在、前”而沿用至今。这九个字分别的意思是:临,代表身心稳定。兵,代表能量。斗,代表宇宙共鸣。者,代表复原。皆,代表危机感应。阵,代表心电感应或隐身。列,代表时空控制。在,代表对五元素的控制。(五元素:就是我们熟知的金、木、水、火、土。)前,代表光明。】
![](https://cdn.jsdelivr.net/gh/blueroseslol/ImageBag@latest/ImageBag/NARUTO/8000D42FA9A44E93B15A6AE23283AAA2.jpeg)
### 重视画面效果的生动配色阴影
      公司内部以前使用过的乘法CelShader绘制出皮肤的阴影部分的褪色效果是个难点见上图A。在本作中为了解决那个问题模仿了Photoshop的softlight图层效果开发出了CelShader见上图B。用这个方法虽然确实在皮肤的影子上能得到良好的结果但同时衣服等东西原本的色彩很高的部分影子也变的明亮结果作为影子就会出现破绽。于是开发出了新的彩度高的像素上使用乘算彩度低的像素上用softlight的把影子颜色在直线上混合描绘的shader实现了取得平衡的阴影见上图C。另外项目主管的西川裕贵先生表示因为这个shader保持相当的的彩度根据动画上经常用的色调也可以适用在阴影的表现上例如说把夜里的阴影做成青色时也很有用。
【千里马肝注:动画在绘制之前,会由一位经验丰富的美术绘制一套被称作“色彩指定”,简称“色指”的图片,其中对于角色的肤色、头发色、眼睛、服饰等的颜色进行规定,包括该部分在阴影下的颜色、高光的颜色等等。这样严格要求的结果是,当动画关键帧被绘制完成后,流水线上的美术必须严格按照色指进行上色,于是出来的动画效果就如同一个人画出来的一样。】
![](https://cdn.jsdelivr.net/gh/blueroseslol/ImageBag@latest/ImageBag/NARUTO/323A8D58845A421495538CCD55D2C04C.png)
![](https://cdn.jsdelivr.net/gh/blueroseslol/ImageBag@latest/ImageBag/NARUTO/DCB6EECE80484ACBA8C6CC0C0F14A8EF.jpeg)
### 整理出动画风格的阴影
      虽然图A把高模做出了GlowShading但是如果使用这个光源设定进行CelShading光照会像图B那样忠实的表现出阴影来导致表情变的非常僵硬。这样就达不到动画片的效果所以需要像图C和D那样让模型膨胀再整理法线作成调整过的模型取得了法线信息后把那些适用在原模型上就可以再现出图E那样动画风格的柔软的表情。还有在实际主机上的再现是开发了专用的插件对应完成的。这个Shading技术可以说是初期研究开发阶段很大的一个成果。
【千里马肝注这种手法之前在《偶像大师1、2》中也出现过具体实现还是第一次见到。需要试验一下这种膨胀的方式当光源位置变化时会是什么效果
![](https://cdn.jsdelivr.net/gh/blueroseslol/ImageBag@latest/ImageBag/NARUTO/2DE1377209674C0F933535642A1953D8.jpeg)
### 必要的轮廓线(Outline)抽出法
      作为轮廓线的生成法从PS2的时候就是被经常使用的方法把模型按法线的方向推出很大的一圈再把多边形的法线反向作为轮廓的绘制手法图A。用这个方法因为对于全部的多边形都适用一样的处理头发等的轮廓也忠实的绘制出来表现出期望中的动画风格的质感。还有一种生成法一次性把模型渲染到2Dbuffer中进行post处理是一种抽出模型的轮廓silhouette的绘制手法图B。用这个手法虽然使用silhouette生成了简单的的轮廓线Outline但不能在silhouette的内侧生成。所以本作的Celshading上附加了轮廓线Outline选择的选项由于设计师会对应状况选择绘制方法实现了这两个手法的并用。
      
【千里马肝注图A的方法不用多说图B的方法可以将normal或depth渲染到rendertarget中然后进行Sobelfilter处理。作为卡通渲染有时的确不希望过多的细节被表现出来这里本作使用2种可选项是个好办法。更多的信息请见RenderMonkey中的NPR。】
### 动画中加入了其所特有的夸张
动画的深奥妙趣,就是充分利用省略和强调张驰。
那么如何通过CG来表现这些并灵活的运用呢
这里来披露一些吧。
![《火影忍者:究级风暴》渲染技术究极解析](https://cdn.jsdelivr.net/gh/blueroseslol/ImageBag@latest/ImageBag/NARUTO/66E0601B773C4C0897688A5B49D19040.jpeg)
### 索具(Rigging)的准备配置(Setup)
       角色的索具装配使用了Biped。骨骼的构成被称为全角色共通的基础的躯干部分有52个各种调整用的自由骨骼是22个面部是67个服装和头发等摇动的物体用的延伸骨骼是30到80个全部大概每个角色可以算出是170到220个。还有做成的动画数漩涡鸣人的情况在自由战斗时是125个极限任务模式里是90个。
![《火影忍者:究级风暴》渲染技术究极解析](https://cdn.jsdelivr.net/gh/blueroseslol/ImageBag@latest/ImageBag/NARUTO/173B3E3372CF466CBAF62D2B94B0A042.jpeg)
### 动画拖影AnimeBlur的实现
      作为动画片固有的速度表现速度过快的会有轮廓被拖长的情况。在本作中把三角锤的模型重叠图A,提前加入角色的末端部分图B,把骨骼拉出来图C实现了这个效果图D。在骨架上加入了弹簧控制根据动作的速度把拉出的长度自动的变化虽然做出的动作也有些和表演意图不同但为了取得平衡全部的人都加入了。
【千里马肝注: 关于弹簧控制,请搜索:虎克定律。】
![《火影忍者:究级风暴》渲染技术究极解析](https://cdn.jsdelivr.net/gh/blueroseslol/ImageBag@latest/ImageBag/NARUTO/D0BA456FAE4A4D8E8BD494880593C096.jpeg)
### 面部配置Setup的基础
       面部正如前述那样由67个骨骼控制图A。作为本作特有的设定下唇的下骨骼占到脸的三分只一。这是为了可以表现出即使是动画独特的张嘴下巴的位置也不会改变或是表现出图B那样脸有很大的扭曲。还有一看就明白的真实系的面部配置中大多被设定的脸颊或鼻根的骨骼极少。这样着色在平面上难以反映变化所以并不是要设定最低限度的骨骼而代替那些皱纹表现的要用专用的3D模型图C来实现图D。顺便说一句图C的两个白色圆板是眼睛的高光这样可以把皱纹以及高光从shader上分离容易按意图做出表情
![《火影忍者:究级风暴》渲染技术究极解析](https://cdn.jsdelivr.net/gh/blueroseslol/ImageBag@latest/ImageBag/NARUTO/0D143BF89E814B7DA84E3BFFE8BA9F94.jpeg)
### 动画独特的不合常态的关节
       图A作为人的动作当然相当的正确但是按动画来看就太过死板缺乏趣感。正是像图B那样柔软有弹性的形状变化才符合动画片。为了实现那些要用基础的骨骼图A制作动作后再把子阶层模型顶点网格通过自由骨骼对权重进行控制图C的红色部分这样就可以制作动画独特的柔软性。
![《火影忍者:究级风暴》渲染技术究极解析](https://cdn.jsdelivr.net/gh/blueroseslol/ImageBag@latest/ImageBag/NARUTO/2822B5D78276433D8CDAEF4A086D4395.jpeg)
### 大胆夸张的动画风格构图
       在实际的镜头中一旦让被摄影对象的人完全的进入画面怎样努力也如图A那样有透视的限制。所以为了得到如图B那样动画型的夸张的构图要通过Biped的骨架的辅助动画中加算上Scale让其在物理性上巨大化。
![《火影忍者:究级风暴》渲染技术究极解析](https://cdn.jsdelivr.net/gh/blueroseslol/ImageBag@latest/ImageBag/NARUTO/9B85F54DB0CB464690D1E2C433A5BDAF.jpeg)
### 面部的作业环境
       使用了以前的目标变形MorphTarget是因为要在本作中变更骨骼如图那样准备了选择器工作中可以迅速的对应新的手法图A。还有由于这个变更表情的数据库管理化就成了问题但是可以把表情的骨骼和标准的姿态的骨骼的差值做成文本档案化解决了输出脚本的制作问题。由于这样通过目标变形能够混合两个表情的同时还可以转移到拥有同一个骨架构造的其他角色上做出类似的表情对工作的效率化还有风格的统一等有很大的作用。
![《火影忍者:究级风暴》渲染技术究极解析](https://cdn.jsdelivr.net/gh/blueroseslol/ImageBag@latest/ImageBag/NARUTO/DA0CEEBCE9C2478DA77C99B1741522C5.jpeg)
### 背景的概要
      上图是战斗舞台的其中一个角色的移动可能范围按实际尺寸是直径50米最远景是500米左右大约用了5万多边形做成。担当背景制作的四所铁矢先生表示开发当初好像有40万到50万多边形一边要维持品质一边要把多边形消减到能够实时绘制处理的水平很辛苦呢
![《火影忍者:究级风暴》渲染技术究极解析](https://cdn.jsdelivr.net/gh/blueroseslol/ImageBag@latest/ImageBag/NARUTO/10CA18F8717F457CA88A232FB38E5A58.jpeg)
### 丰富的河流表现
       让水面上反射出美丽阳光的河流图A,如何能用一张平面的多边形作出来图B。使用的贴图有color图Cheight图Dnormal图Eshadow图F环境图G5个种类水的颜色在shader参数里设定在颜色上也可以增加高度的信息。环境贴图拥有alpha通道,加入了模拟的HDR信息图H绘制太阳一类的效果。像素描绘的结果会显出很强的GlareFilter效果花了很多工夫。
![](https://cdn.jsdelivr.net/gh/blueroseslol/ImageBag@latest/ImageBag/NARUTO/9EFCA4B955C84964A830832998D90916.jpeg)
### 背景的贴图
      在贴图上使用了Albedo贴图图A和阴影贴图图B。根据适用的地方在2048X2048到256X256像素的范围内选择尺寸使用DXTC格式总计30MB的程度。还有用Photoshop的插件做成Mipmap来使用图C。虽然由于这些贴图的容量会增加33%但和没使用时比起来GPU的处理负荷减轻了接近一半那个效果是非常大的。
![](https://cdn.jsdelivr.net/gh/blueroseslol/ImageBag@latest/ImageBag/NARUTO/212029DE080A4C709ACC71E7DC81E798.jpeg)
### 背景的作业环境
      公司内部在构筑开发环境上也倾注了全力在背景制作中使用了30台以上的wacom的21寸液晶绘图板。更有应该注意的是在负责人的头上有个防止面对监视器时映入灯光的特别定作的圆盘形的遮光罩。这是日产汽车和slik共同开发的产品由于这个抑制了照明实现了没有那么明亮的作业环境。
![](https://cdn.jsdelivr.net/gh/blueroseslol/ImageBag@latest/ImageBag/NARUTO/04F65D2BA78243F0BE323125FB99F78F.jpeg)