Blendr和Unity数字化重建“九龙城寨”

kirin77

香港九龙城寨大家应该有所耳闻,1993年拆除以后我们只能在电影或动漫中看到它的身影。本期以3D场景艺术家Sherman Waffle的视角观察与解析存在于历史中的建筑,细讲使用Blender和Unity制作九龙城寨的全过程。

九龙城寨外观模型
https://www.zhihu.com/video/1535324878994956288
  |艺术家介绍

  3年前我开始自学成为一名3D环境艺术家(3d Environment Artist),痴迷于沙盒游戏或乐高等艺术方式呈现事物,当制作成3D场景艺术时感觉非常适合自己。尤其对城市建筑感兴趣,迄今从事该行业。





Unity应用商店发布的日本街头

|概念

  七个月前,我挑战自己用Unity重建九龙城寨的外观和内部,在我知识范围内自由地尝试模块、升级、材质、灯光、故事性等,尽量发挥极致。
  九龙城寨曾是世界上人口密度最高、无人管控地区。这里有着牙科、医生、美容、肉店、杂货店、五金厂、纺织品等等。我非常喜欢下面外观照片,照片角度和贫瘠的周围环境揭示很多故事。



Sherman Waffle收集的外观照片

|策划与灵感

  收集资料是工作前期必做的事,过程中决定项目质量和工作方向。制作中几乎没有使用到左下蓝图。



资料收集

  建筑外观灵感来自其他优秀的艺术家,着重观察明亮的色彩、出色的细节表现等方面的作品。



外观灵感图

  非常喜欢下列照片中的灯光和强对比效果。对于小巷子,我的灵感来自霓虹灯、反乌托邦、赛博朋克、先锋派等关键词。我被“猫猫冒险游戏(Stray)”的灯光着色深深吸引,并一直对尝试设计华丽照明有着强烈的欲求。



灯光灵感图

Tips:猫猫冒险游戏(Stray)一只孤身离群的流浪猫,迷失在一座被遗忘的网络城市里,必须解开一个古老的谜团才能逃离出去,找到回家的路。



stray


猫猫冒险游戏(Stray)视频
https://www.zhihu.com/video/1535355258360791040
|模块设置

  脑海中无数次剖析建筑物基本结构之后,在Blender中进行每个模块基础建模。个人认为比起1:1的宽高比例,3:4更为合适,因此按照墙面的宽度3m,高4m(或者4x3m)厚度20cm而设置。


  对于巷子和走廊也做同样的做模块化建模(3x4m,厚30cm)。用这些网格面可以迅速搭建外观。


  网上下载免费的材质球,用于世界空间坐标平铺材质(world-space tiling materials)。因为
Unity中有世界坐标贴图(world-space texture)功能,我没有展UV。



world-space texture用法

因此快速做成下图的程序化建模。



模块组合展示

|模型边角处理

  建模时我用到面权重法向编辑方式(FaceWeighted Normal)+TrimSheet贴图表现方式。加权法向编辑方式是对于模型的面进行加权倒角处理。
Tips:如果按照普通建模方式,应该是下图方式1,无限增加倒角参数,顶点数和面数增加,这种模式不仅影响渲染时间,也要考虑到导入第三方引擎时面数的控制。而2,3是在FLAT(仅添加一次倒角)的基础上(40个顶点)做出的效果。平滑是对法向进行平均处理方式,平滑参数越高,上面和侧面将受到影响无法保存原切面的形态,关键是着色后的反射效果很差劲。权重法向是,原顶点法向保持不变的前提下处理边角,材质反射效果也是自然的。



边角处理方法比较

  可以看出权重法向是即使不用烘焙也可以呈现平滑锐利边角的最佳处理方式。


Tips:Trim Sheets把建筑或模型的材质制作成一张横向的材质制作方式,结合权重法向建模,保持低多边形(Low Poly)的状态上才能展示最佳效果。



TrimSheet做出来的效果

|内墙

内墙2.4m高无反面。



建模组件

|楼梯

  对于室内模型,比起使用外观的格子型墙和窗户,进行变形和排版会更加丰富。
  楼梯做了4种网格形态,其中2个按照真实照片还原。出入口固定在栅格上,方便替换其它网面。这些楼梯导入Unity后用管道、电线、贴画装饰,让我们继续看下去。



楼梯组件

  下图是原照片和渲染图对比,在下面状态下我最终改变了灯光效果。



左原图，右渲染图

|阳台

  阳台模型和贴图也用权重法向+TrimSheet方式,这里为了快速展TrimSheet的UV,我使用“TexTools”插件。铁皮瓦使用凹凸变现的材质。



阳台栅栏模型图

  我先用“Substance Painter(SP)”软件使用笔刷描边、磨损贴图(Grunge map)、曲率贴图(Curvaturemap)制作铁网的材质。然后用Justin Lazzaro的“Ultimate Trim Generator”节省我很大的时间烘培曲率贴图、环境光遮蔽、高度贴图以便于生成法线贴图。



贴图

Substance Painter:Adobe推出的绘制3D贴图软件。
Ultimate Trim Generator:在SP软件中制作高、宽、间距,线条排列的生成器。



Ultimate Trim Generator

|管道

  制作管道前先参考了一些实物图。



管道照片

  柱体为主体,用倒角和细分创建4种管道套件。在共同的网格范围内对高和长变形。



管道模型组件

|着色

    在SP烘焙后开始着色。我习惯用软件自带的脏脏纹理、智能蒙版、手绘、智能材质等进行图层着色处理。多数图层调整颜色、粗糙、高度图、金属参数即可生成。



Substance Painter



Substance Painter

  下面是我最喜欢用的一些磨损贴图(Grunge map)。(不知道磨损贴图这个翻译是否正确)



磨损贴图

  分析和收藏更多图片后,重复上述操作最终获取下图。



管道模型

|布料模拟

  遮阳蓬布在Blender中先做布料模拟再用SP烘焙材质。如果添加子碰撞选项,很难预测最终结果,尤其是表现物体之间的物理碰撞效果。这时候需要放大布料,修改细节避免穿模现象。



布料

    表现被风吹的布料时用Unity的布料系统(Cloth Component)组件,固定上方的一些顶点。下图为附布料材质的平面(细分subdivide)。



布料模拟

|电器箱

  电器箱组件参考九龙城寨实图,做几个基础模块后用SP制作材质,底部垫木板模型后排列电能表。看到的电线是用曲线制作,手动排列几组,最后复制而成的。电缆、配件、木板等使用不同材质。



九龙城寨电箱实图



模型组件



导入Unity中效果

  除此以外我觉得有必要增加一些更乱的细线作为辅助,用Alpha贴图烘培,以便摆放在任空间。



电线



模型

  通过以上方式,制作出数百个道具(Props)。其中一些从Polyhaven(公共资产库)下载使用。



所有模型组件

|材质

我的材质制作方式并不是典型通用的,我习惯用“Substance Designer”结合“Substance Painter”中Alpha一步步呈现。在Pixabay下载高清纹理图。



制作贴图过程



贴图

  下图为“Substance Designer”中创建的混凝土材质。用石膏为基础材质,最后在Unity中添加色彩。材质表现为SD中砖和蒙版混合而成。



混凝土材质制作流程

  一切都在世界空间UV中。可以自由平铺和偏移。



Unity中world-space texture展示

|玻璃

玻璃材质,面片的四边涂鸦灰尘效果,用阶梯式垂直分布面片,这样就可以不影响其它玻璃的情况下方便单片绘制。



玻璃贴图

在Unity中玻璃材质能表现透明和折射,窗框也是分离制作,因此方便旋转窗户角度。



自由开关窗户角度

|金属

  为了不同的金属色彩,我创建“油漆蒙版颜色变化(paint mask color variation)”着色器,这个着色器可调节色相、饱和度、亮度等滑块蒙版。这个着色器不影响生锈表现。



阳台色彩表现

  在世界空间内对每个对象设置任何色彩。



使用world-space texture颜色随位置而变

|窗内环境

  接下来是Unity shader graph,根据网上教程,实现用时间差生成室内环境假象(视错觉)。用到2种立方体贴图(Cubemap)日与夜,它们之间用shader graph自由切换。



Unity shader graph



用指令开关灯

  这是白天,近看不是很精致,在本项目中远看还是较逼真。



白天室内

  在Unity中摆放之前做好的模型,渲染作为立方体贴图的每个面,再用PS组合而成。



室内环境CubeMap

|墙面贴画

贴画能深化提升作品的完成度。在这里多数用在胡同内部。涂鸦文字是1001平台下载免费提供的,在PS处理后使用。



布置贴画


  用SP绘制各种混凝土遮罩绘制出的磨损贴画。流体混凝土用Alpha笔刷手绘而制。



混凝土贴图

|灯光与构图

  构图上,无数次布置建筑内部、巷子的排列,也测试相应的灯光设置和摄像机角度,最终选择效果最佳的。
  我对灯光使用也很简单,如外部自然光是实时的,没有烘焙。使用了Polyhaven的免费HDRI。



自然光模拟

  我使用物体原有的参数值和温度等。例如建筑内部温度为5000K色温,强度为2300流明。太阳是4500K色温,照度为120K勒克斯。我能提出的建议就是,尽量观赏艺术作品。



配色

  确定光照角度和后处理时,可以用PS中直方图(histogram)功能,有助于浏览图像色调参数和色调分布状况。我的目标是能调出平滑、均衡的曲线。



查看直方图

    提到配色方案,我经常用Adobe提供的色轮工具。构图和照明是迭代的过程,我在PS中水平翻转图像研究更好的结果(大多数2D艺术家熟悉的技巧)。并放大镜头抓住细节。



外观图

|激光线

打破激光线(laser lines)也有助于构图,激光线是图像中任何不间断的线。如下图中摆放的垃圾袋、盆、水桶、篮子等道具,用参差不齐的排列打破墙和地面枯燥的衔接,最后在背景添加细节。这个技法经常用于场景深化时,墙和地面等直线交界处摆放植物、石头等道具,这就是打破激光线。



打破激光线

|有情怀的场景

这个内部图像有很多故事,例如沿墙面流下来的脏脏的水、破碎磨损的墙砖、厨房用品、钟表、电线、风扇、锅具、植物、灯具等满满的细节揭示这个环境的的地点、条件、时间、居住者等信息。



室内

|优化

  从制作初期起考虑了外部场景带来的性能问题。因为我使用程序化建模,5万个以上的墙、窗、栅栏组成的,其Draw call(CPU调用图像编程接口,命令GPU进行渲染的操作)数量巨多。但在我的项目,Unity静态批处理不起作用,手动合并Mesh,还好我用脚本解决这一问题。


|渲染

    用我的RTX3080,最终以15K(5K x 3)渲染,再缩小到4K,60fps。出图前做后期处理(post processing)、太阳光角度、天空偏移、建筑景深等调整。然后导入PS,应用色阶滤镜,以防没有调好曝光度。



曝光度测试

|结论

我对这次项目非常满意,尽管在业内觉得自己不是特别出色,但我一直努力学习新事物并成为一名艺术家。

数字还原九龙城寨内部
https://www.zhihu.com/video/1535354788128067585
<hr/>  我们看完了制作全流程,介绍到很多制作技巧,这个作品在Unity应用商店。如果问起这个场景用于游戏中是否非常有效率,那应该是另外个话题。虽然有很多快速有效的技法,但国内游戏公司场景制作上并不会用到。至少在制作场景灵感和思维和实现过程还是有参考价值。
回复【 HDRI 】 获取12GB天空盒素材