天了噜!《闪耀暖暖》居然是一群男程序员做的!

叠纸游戏在UNITE大会上分享了《闪耀暖暖》的技术实现,从2D到3D的转变过程。技术总监张霁和美术总监柳丛介绍了如何通过Unity引擎实现高精度3D模型、细节处理和光照系统,包括多层UV技术、程序化闪点、物理系统与碰撞处理。《闪耀暖暖》的成功展示了在女性向游戏领域技术创新的重要性。
摘要由CSDN通过智能技术生成

2019年上海UNITE大会于上周五正式举行,在为期三天的大会上,有数千位开发者到场参会,大会也奉献了上百场精彩的分享,让更多开发者能够尽情享受这场技术盛宴。

大会上来自国内外的技术专家与优秀的业内开发者分别进行了各自的主题演讲,为在座的开发者展示了最新的技术与成功的案例,其中叠纸游戏也在大会的第二天进行了分享。叠纸游戏凭借着暖暖系列进入大众视野,之后又推出了《恋与制作人》这样的爆款游戏,让游戏界注意到了女性向游戏市场的存在与重要性,而这次叠纸游戏借着《闪耀暖暖》给全球的开发者们展示如何做好一款注重画面质量的3D手游。

下面源自大会的分享

本次进行分享的是叠纸游戏技术中心技术总监张霁和美术总监柳丛,他们分别参与到了《闪耀暖暖》的开发当中,今天他们的分享主题是《闪耀暖暖技术分享:2D到3D的进化与创造之路》。
在这里插入图片描述
《闪耀暖暖》是叠纸公司的第二款Unity项目,也是暖暖系列的第四个产品,但此前的暖暖系列并没有采用全3D图形进行开发,因此这也是团队的首次尝试,使用的引擎版本从Unity5升级到了Unity2018。

项目开发前期,我们经历了一些技术和风格上的迭代,起初它甚至并不是一款3D游戏。初期的尝试方向是基于spine来做360度旋转,后面很快转向3D方向。这个时期我们更多考虑的是如何用卡通渲染还原2D暖暖,如何还原2D暖暖的线条,让3D线条有颜色粗细虚实的变化,这是当时做到的效果。在2016年下半年的时候,对卡通渲染的研究进入了一个瓶颈期,因为想做到期望的品质,要求非常的高,对移动平台压力过大。同时3D线条的效果与2D暖暖仍然有较大差距。即使这个差距可以继续缩小,卡通渲染导致的画面过于相似也会让新作缺少独特的吸引力。

这迫使我们回到原点思考问题,换装游戏的根本究竟是什么?我们的答案是漂亮的衣服和多样的穿搭体验。我们将其拆分成几个技术点:衣服的极致细节、穿搭的自由度,以及艺术的传承和创新,这也是我们这次分享的目录。

细节,暖暖系列的基石

3D游戏要想达到足够高的精度,制定合理的美术规格是重要的基础。我们发现模型面数对性能的影响并不是很大,影响较高的是贴图的分辨率。这是使用1024和2048贴图的表现效果,以及相应的AB占用和渲染耗时。可以看到即使2048在镜头拉近的时候仍然无法达到我们希望的精度,而随着分辨率的增加,包体内存压力迅速增加,也不利于持续更新。

为了解决这个问题,我们使用多层UV和多层贴图拼合,精度有了显著的提升,相当于4096的贴图。这个例子里使用了四层UV,四层贴图,总的占用比1024的单张贴图还要小。《闪耀暖暖》的包体目在是二点几G,有一半是3D的容量,其中一半是贴图。如果把这部分全按4K重置,包体会达到十几G。接近一款3A游戏了。同时加载多张4K贴图更会直接撑爆手机内存。使用多UV其实也有巨大的代价,渲染耗时从6.85毫秒到8.67毫秒,增加了26%。
在这里插入图片描述
我们对UV的优缺点做了总结,除了精度和包体优势,还有一个好处,就是在制作完成后,有较大的后期调整空间。缺点方面,除了pixel shader负荷增加较多,多UV会导致贴图数较高。Unity默认采样器的数量等于贴图的数量,这样就要求控制单个材质中贴图的使用,不能超过16张。

除了硬件和性能上的问题,多UV对于制作也有较大影响。设计时需要考虑图案规划,而制作时需要根据情况对UV进行调整和拆解。例如这个比较简单的裙子,它的UV是这样的。从另外一个方面,UV拆分过于灵活,也会导致这个流程难以推广和流程化。

针对这个问题,我们制定了一套工作流来进行标准化,首先是色块填充构成底色,平铺布纹,接下来印花,最后是风格化处理。对于复杂的服装,可以灵活变通,实现精度的最大化。

通过程序化方式进行细节补充,实现程序化闪点

首先,这个是我们期望闪点能够做到的内容,其实就是一些随机分布的点,点与点之间有一些表现颜色和大小的随机性差异。美术希望能有方便直观的控制方式,比如用密度贴图控制哪些地方需要有更多的点。同时,点的大小分布也能以类似的方式进行控制。其次希望有稳定可靠的闪烁,类似高光的表现。

在这里插入图片描述
闪点算法的基础其实很简单,其实就是在UV空间上生成棋盘格,这其实是一个2D的问题,我们可以转化成平面进行考虑。每格的索引就是随机数种子,使用这个随机数种子,可以生成偏移量、缩放和颜色和相位。接下来是填充格,可以直接填满就是方块。或者柔化处理成菱形或者圆。接下来是根据相位和预设的密度阈值进行剔除,达到密度控制。

处理偏移的时候,会出现越界的问题,就会出现截断的情况,看起来比较奇怪。处理越界闪点的方式,就是随着点随机缩小,把偏移量限制在格内。但是这样过于规律,几乎看不出什么变化。后来我们发现只要限制点的中心在格里就可以了,这样一共是自己加周围8个邻居,共9次闪点相关的计算。可以利用一些情况来合并计算。由于点的中心不能出框,左邻居只会影响当前格左半边的像素,右邻居只会影响当前格右半边像素,左右两半边可以合并计算。同理,上下两邻居也可以合批计算,四个对角也可以合并计

Requires Unity 5.6.0 or higher. RealToon v5.1.2 An AAA Anime/Toon Shader to make your characters & objects to look as close to real Anime/Cartoon. Toon/Cel shading shader. (For Games, Film/Animations & Illustrations/Arts) - It is Fully Multi-Lighting. Features: - Smooth Object Normal: *Smooth object normal for better or clean shading. - Self Shadow: *(Adjust Size/Threshold and Hardness without using any texture) - Normal Map: *(For more details) - FReflection: *(Use images/textures as reflection.) *(Can also adjust the size and position) *(This is not a matcap style reflection or cubemap.) - Outline: *(Can change the Color and Width) *(With noise/distort outline for sketch style outline and dynamic) *(You can choose to use outline or without outline "for less drawcalls"). - Gloss (Texture) (Custom Gloss): *(Use images/textures as gloss) *(Can choose to follow light position & object rotation.) - ShadowT (Texture): *(Gradient or Flat base shadow/shade.) - RealToon Refraction: *Anime/cartoon style glass, ice, liquid, etc. - Reduce Shadow: *Reduce real-time shadow of an object - material without affecting other parts of an object. - Fade Transparency with outline and transparent affects shadow. - Vertex color support for Outline, Self Shadow & Smooth Object Normal features. - Includes RealToon (Lite Version) shaders for mobile or lite type games. - Includes RealToon (Tessellation Version) shaders. - Includes RealToon (LWRP Version) (Unity 2018 with LWRP V4.0.0 to latest) - Includes effects like sobel outline. - More... Other Features - Use Directional Light and Point & Spot light or multiple lights at the same time without problem and maintaining that anime/cartoon style shadow color & brightness. - Fully color shadow and maintain light falloff. - Fog affect Outline. - Receive GI with Flat/Smooth shade & Skylight/Environment Light. - Do baked/real-time reflection. - Can use patterned textures for manga/comics like shadow. - Use it with or without shadow. - Computer (PC,Mac & Linux), Mobile & Video Game Console (Nintendo Switch) in one shader. - You can also use this in creating Anime/Cartoon film & Illustrations/Arts in unity3d. - You can also use this in making VTuber works with or without real-time shadows. - Can now be used in 2D type games. - Includes a simple tool/script Frame By Frame Rendering for animation & illustration/art use. *Renders frames to Image Sequence or PNG Sequence file. - Includes a simple custom shadow resolution script for higher quality shadow. (For Film/Animation & Illustration/Art use) - This can also be use in VRChat/VRC. - More features to come so be sure to check my social network/media.
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值