【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

学习自 http://games.sina.com.cn/o/z/wuxia/2015-10-15/fxivsch3599438-p5.shtml

1. 技术讲解捏脸系统设计原理 天刀脸模型的风格定位

关于[天刀独有的捏脸系统]先由静与动的结合展开介绍一共有5个部分。

静:天刀脸模型的风格定位与制作。

动:由骨骼驱动的捏脸以及表情动画的表现。

包装与完善捏脸系统:我们想给玩家带来一些有乐趣的功能展示。

疑难杂症:开发的过程中所遇到的困难点是如何解决的。

不断优化-希望做的更好:我们希望在未来的时间里解决以及优化的一些问题。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

白色:

在某种定义上象征着温柔、干净、美丽,富有、以及社会地位的象征。

另外肤若凝脂的特征也是中国古代美女的主要标准之一。包括现在的美容产品,没有美白两个字来包装是很难卖得出去的。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

古风与欧化的结合:

随潮流影响现代人的审美观逐渐开始欧化,深邃的面孔和立体五官也是判断美丑的标准。

在制作上将欧洲人的立体感融入了东方人柔美典雅的五官气质。

比如保留了亚洲的小脸轮廓,圆润的骨骼结构和小而丰满的嘴同时融入了欧洲人挺拔的鼻梁,比较大的眼睛,深眼窝这一些特征。

这些特征也是天刀脸在制作时的必要元素。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

根据这4个方向我们在五官的塑造上是如何应用的我接下来讲一下。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

一张人物照片,无论衣着多么华丽,人的脸始终是我们观察时间最久的,而在人脸上,我们的观察更多的又会集中在眼部周围。

眼睛可以表达情感,瞳孔的变化也与人的思想情绪关系密切。

另外在视觉上讲眼部位置也在黄静分割线比较集中的地方。

所以我们愿意观察眼部也是有一定的科学依据的。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

卧蚕在眼部的作用是通过增加阴影面积从视觉上丰富眼部内容,同时也增大眼部视觉面积。女性有卧蚕呢脸部看上去比较甜,会更有异性缘。男性则看上去更有魅力。

3. 技术讲解捏脸系统设计原理 五官模型制作要点

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

修长的眉毛和靠前的鬓角发髻线,会加大眼部占据脸部的面积,从视觉上使人的脸型变瘦变窄。可使面部看上去更加精致。大家可以先看一下图片的对比,可以明显看出右图眼部的看上去更整体紧密,更凸显眼部的轮廓,在视觉上脸型也会小些。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

头部的立体感取决于下颚骨的形状,也是塑造完美脸型的方法。

在制作中我们搜索了很多 V 型脸的图片寻找出大概的角度和范围,通过这个范围值来塑造不同的 V 型效果。

另外下颚骨与脖子的衔接要收紧,这样可使下颚骨所呈现出来的阴影来凸显 V 型脸的轮廓。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

嘴型:嘴部依然保留亚洲的小嘴概念,同时可融入一些流行趋势, 比如最近交流的嘴角上扬的微笑嘴。将这些细微的变化放入到游戏里来迎合90.00后的审美。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

写实的皮肤质感是必不可少的。我们在皮肤贴图的处理上采样了真人的皮肤细节并进行手绘的优化处理,同时程序为皮肤开发的 3S 材质球,这样可使角色在游戏世界里皮肤质感看上去更加逼真。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

角色灯光的处理,大家可以看一下这张图,这是同一张脸,左边脸由正面光照的照射下看上去很阳光。右边脸在顶光源的照射下就更显颓废,所以不同的光照方向也决定了脸的性格和美观。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

为了确保角色在游戏世界里再不同时段光照下保持美观,我们除了角色的常规光照外,开发了绑定在摄像机上的灯光可使角色在任何角度下都会有个正面的光源。这就是 Cameralighting(摄像机光照)

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

因此我们削弱了 CameraLighting 的光照强度并加强了天光和散射光照的表现使角色在不同的环境下呈现出体感与美感。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

捏脸在前期的预研时,我们在两种的捏脸方式上做出了选择。

一是用 Blendshape(融合变形)。
二就是用骨骼驱动。

融合变形

优点:可以控制的非常细微捏脸变化。

缺点:Blendshape 在捏脸制作上工作量非常大,我想把一个结构捏的多么细微就要制作多少张脸,这个细微度和工作量是成正比的。这样会导致后期修改不方便,更重要的是性能消耗非常大。另外跟我们第三方动画软件不兼容。

骨骼驱动

优点:制作量比较少,性能消耗相对少些,和现有动画系统兼容,另外捏脸骨骼和动画骨骼是同一套骨骼,就通过 MorphemeConnect 动画软件跟面部骨骼做了融合。当你捏出来任何形状的脸都可以套用同一个动画,这样也减少很大的工作量。

缺点:权重分配受限较多,捏练的细致程度有限。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

关于表情动画与捏脸的匹配

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

然后我们观察了真实人脸表情的肌肉的动态变化,打算使我们的角色在播放表情时也呈现出动态的肌肉结构,因此我们通过软件在原有的结构法线贴图的基础上绘制了表情法线贴图。

资源做完后我们使用动画软件跟二套表情法线进行融合,当动画播放某个表情的动画时, 表情法线和本身模型的法线进行了叠加,表情法线会设置 0 到 100 的透明度,动画软件会触发这个表情的动画事件,随着模型的变形,表情法线会根据动画时间线进行不同强度的融合。大家可以看一下视频。

6.技术讲解捏脸系统设计原理 如何通过骨骼进行捏脸

骨骼捏脸确定后,以及表情动画新骨骼的完美匹配,那么我们如何通过骨骼在游戏里进行捏脸,下面分享一下。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

我们在捏脸的操作方式上采用了两种方式。1个是可视化操作,1个是滑条式操作。

可视化操作:可让玩家更直观的调节所捏区域。这样的体验对中国玩家来说是新鲜也是非常直观的,这也是我们天刀捏脸比较大的一个特点。

在操作上可先在脸部点选你所要捏的部位,然后可以通过快捷键 Q,W,E(位移,缩放,旋转)的轴向在脸上直接进行调节。

滑条式操作:第二种是给玩家保留传统的操作习惯,提供选择骨骼可推动的滑条方式。玩家可将鼠标移动到 Ui 的塑型区域,在区域栏里可选择你所要捏的部位,再通过你选择的轴向进行捏脸。

这样的两种操作方式的结合可让玩家在捏脸的操作上更加轻松流畅。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

我们确定骨骼拾取方式确认后呢,我们将他做成可视化。  

我们通过像素拾取的方法来实现鼠标在脸上骨骼的选取,先给每个骨骼所映射的部位设置一个ID,并根据每根骨骼的权重范围绘制一张带通道 mask 图。

每个骨骼的 ID 都有一个固定的数值,反映在贴图的通道上就是不同的灰度值,可看一下这张 MASK 图,颜色不同代表拾取区域的不同,这样鼠标就可识别你选取骨骼的区域。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

然后我们将这张 MASK 图映射再脸部的 UV 上。然后测试拾取区域的权重范围

是否跟 MASK 图相匹配。当拾取区域的准确性确定后,我们需要一个好的包装。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

当我们的显示区域映射在脸上后,发现我们在做捏脸时,脸上的网格会一直存在的,这影响着观察效果同时无法分辨所捏区域是否被拾取。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

包装与完善的捏脸系统,这是在创角景里除了捏脸功能外给玩家带来乐趣的一些功能展示。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

这次的版本我们提供了非常多的妆容资源。针对这些妆容部分我把比较有特点的功能逐一讲一下。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

在贴花(纹身)制作上,我们根据设计效果使用 NormalMap,SpecularMap 来使贴花呈现出更好的的立体感。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

为了让玩家更方便的挑选自己的捏脸成果,我们增加了捏脸储备功能。提供 5 套自定义方案,供玩家保存和读取。玩家也可以跟其他玩家进行交互。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

装预览功能可以辅助玩家判定捏完的脸在不同衣着风格下的呈现。确保脸部的百搭性。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

捏脸功能开发后由于要可捏下颚骨的需求,而将 3 测脸下颚靠近脖子的分帕线位移到脖子中间的位置,原本不那么让人注意到的接缝变的引人注目了。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

最后我们将模型导入游戏里,在多种环境的验证下,我们的接缝问题完美解决了。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

在这次版本的眼睛优化时,我们发现眼球与眼皮的融合处理的很生硬,想找程序增加眼部的阴影,但通过程序去真实计算的话这么细微的阴影性能上消耗太大了,而且性价比不高。

我们想了个办法解决了这个问题。在眼球外部增加了一个模型,这个模型起到了两个作用。第一个作用是增加眼皮对眼球造成的阴影。另一个作用是增加了泪腺,以及眼球与下眼袋湿润度衔接的表现。通过模型和贴图就完美的解决了。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

11.技术讲解捏脸系统设计原理 未来想解决的问题

我们在制作捏脸时走了一些弯路,在开发中有段时间停滞不前,局限在捏脸时面部位骨头的位置摆放是否能更好的呈现出这个捏脸效果。随着时间越来越紧迫。我们也急需想找到突破口,后来我们的制作人 Ethan 提醒了我们,玩家所的关注热点是什么,我们当时确实是忽略了这个问题。随后了解市面上的同类产品对比了我们的优势,我们将二套法线配合的表情动画任务提前开发制作了,这样骨骼首先符合脸部合理的肌肉运动同时骨骼所捏脸的范围区域也就确定了。随后我们放出了一张有法线贴图的捏脸表情截图。虽然那时的制作质量不是特别的高,但玩家的热度一下子就上去了,也给了我们一定的信心。接下来的在其他功能的开发上也越来越顺利。所以当我们遇到开发瓶颈,要主动分析了解自己的产品优势,把产品优势最大化,提高玩家乐趣同时也给自己信心。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

在下个版本我们会增加贴花的位移。加强玩家在脸部贴花的自由度的体验。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

另外我们想加强眉毛与胡子的表现,就是体积感。想把贴图转变成模型,除了更精致的表现外,也可以增加大胡子这种类型的样式。

【技术美术】千人千面如何炼成 技术讲解捏脸系统设计原理

因此我们分析了人脸特征,人脸的特征除了五官比例和五官形状外皮肤细微的颜色变化,肌肉的表皮结构都决定了每个人脸的特点。

我们目前的规格限制只可以改变脸部的五官比例和形状,比如我可以让鼻子短一点,长一点。可以让杏仁眼变成三角眼。但我们无法解决的是单眼皮变双眼皮,这就是刚刚说到的表皮结构。所以这就是我们为什么要增加了多种差异性的脸。

那么我们如何通过捏脸系统来解决这个问题呢胆设想一下通过之前已有的技术二套法线进行替换的方法,然后做 5 张法线贴图。这五张分别是眼皮,鼻头,嘴巴,颧骨,下颚,这几个比较重要的五官部位,通过程序的对 UV 参数区分配置可使一张贴图可制作这个五官的不同形态。就比方说眼皮贴图,里面可包含单眼皮,双眼皮,内双,多层眼皮,等不同的形态。

这样我们有了可控制五官比例的外形本身的捏脸系统再加上通过二套法线叠加出来的不同的表皮结构变化这个功能,就可实现更加逼真的捏脸效果。

来源:HeartyHu

声明:本站部分文章及图片转载于互联网,内容版权归原作者所有,如本站任何资料有侵权请您尽早请联系jinwei@zod.com.cn进行处理,非常感谢!

上一篇 2017年4月11日
下一篇 2017年4月11日

相关推荐