蓝铅笔 蓝铅笔logo

《纪念碑谷》是如何欺骗人们的视觉的?

20513 0 0
2015.12.06 02:23

游戏利用了循环、断层以及视错觉等多种空间效果,构建出看似简单却又出人意料的迷宫,一些超出理论常识的路径连接,让你在空间感方面一下子摸不着头脑,而这也是本作的神髓所在。不过由于通关路径设计具有唯一性,加之建筑和场景又相对固定,所以只要给点耐心探寻就会找到明确方向。

1.jpg

《纪念碑谷》是由ustwo games开发的解谜类手机游戏,获得2014年度App Store精选榜单 中国区iPad年度最佳游戏。

游戏通过探索隐藏小路、发现视力错觉以及击败神秘的乌鸦人来帮助沉默公主艾达走出纪念碑迷阵。

“朽骨暗夜,候多时,沉默的公主,您已徘徊多远?山谷曾为人之居所,而今,前人的辉煌,只化为石碑座座,窃贼公主,为何您又归来?”不得不说文字表达和精神层面的诗意让游戏的内涵值上升到了一个新高度,而这样一个似懂非懂,韵味十足的故事我们大可以抱着“不求甚解”的态度对待之。


本回答将会大致解答《纪念碑谷》是如何在技术层面上实现这些不可能,从而让人们在视觉上获得完美的体验的(如何通过技术欺骗你们的视觉的)。资料来源是ustwo monument valley team的技术主管应Unity官方邀请对游戏开发者做的presentation。

  OK,废话说了好多,下面是干货。

  个人总结:《纪念碑谷》其实就是通过将人们从2D平面看见的路径,在3D的游戏场景中加以实现。人们看见的效果其实只是3D游戏场景的一个投影(Projection)。

  下面的内容我将配合图片进行讲解~多图预警!!

  这个是presentation的主题:创造不可能!由于本答案侧重介绍技术原理,presentation中涉及测试,用户体验和关卡设计等不相关内容不予提及。

0933511shpkazxddqqdx5q.png

主讲人一上来就摆上了潘洛斯三角形,从别的角度看实物是一个奇形怪状的东西,可是如果从特定角度看过去,就变成了那个神奇的三角形~这就是monument valley team开发秉承的思想:See things in different angle!同时也是技术上实现的核心。

然后可以看到,在Unity的游戏场景(左图)里其实也是这么个奇怪的几何体!可是调好摄像机的角度(右图)效果就出来了

093352532m3mdqm426joo3.png

 于是问题就来了。我们在玩游戏的时候看到的效果感觉艾达是在一条路上走的(右图中艾达可以从三角形最上面的角通过中间的角到达下方的角)。可是在3D的场景中两条路(左图中根本木有中间的角)根本没有交汇,那艾达是怎么走过去的呢?

  答案就是对路径进行标记,如下图

093352q5nllhnqhkunefqp.png

由图中我们可以看到,可供艾达行走的矩形路面都用Node进行了标记,Node由蓝色的Boundary Point和绿色的Connection Indicator。我个人认为游戏程序的寻路算法是基于Node组成的路径网络的,而通过对Connection Indicator进行处理,可以决定不同的Node之间是否相连。通过这种方法,技术人员可以轻松地根据视觉效果在3D场景中标出路径,下面是效果展示:

图中可以看见两个实际上分离的Connection Indicator,换个角度后就重合了。

  有些同学会有这样的疑问:就算视觉上重合了,可是艾达的位置应该也有改变呀,远近不同会导致物体大小在视觉上的变化,可是怎么完全看不出来?

  我来告诉你,其实艾达的位置并不是一直位于方块的上面,只是让你看着像而已...请看下图:

093352532m3mdqm426joo3.png

由图我们可以知道艾达的位置并不是单纯地在方块上面,而是针对用户的视角进行了偏移。可是这些在技术上怎么实现呢。我推测是通过Node来实现的,由于Node是一个圆心处于矩形单位正中心的球体,通过预先设定艾达通过特定Node时离圆心的距离,从特定的角度看就像在大路上行走一样。

  我这么推测的原因是主讲人在presentation中明确表示艾达通过曲面的时候,是通过调整艾达和Node圆心的相对倾斜度来实现走曲线的效果的。

0933537ddid6gg6zod4g55.png

 而且Node还决定了艾达通过它的时候采取什么动画,这就是他们实现爬梯子和走楼梯的动画的原理。当一个梯子同时可以当做地面(左图路径)或者梯子(右图路径)的时候他们还头疼了一阵,后来通过在这种功能重叠的地方放置多个Node,然后通过艾达的位置来决定具体哪一个Node有效。

 由此可见艾达的行走是由基于标记的寻路系统决定的,用于标记的Node还储藏了特定的渲染方式。通过定义特定的位置,旋转角度以及动画,来保证艾达行走的真实效果。

  以上为大概的原理!看起来貌似是比较简单,可是据说实际实现起来问题一大堆。

  上面说了通过设置Connection Indicator可以标记哪些节点相互连接,可是实际玩得时候有些情况还需要对某些点进行闭塞,如下图

在这个图里,通过视觉我们可以发现当艾达位于左上角的时候,她是三个地方都可以去的,寻路算法必须  通过人们的点击输入来选择性地闭塞掉一些Connection Indicator,如下图。

然后下面是NPC的路径图,直接上不同的Node,各走各路哈~

 这些就是presentation关于纪念碑谷技术设计部分的全部内容啦。最后上一张完整关卡的实际效果与视觉效果对比图!

093354jdljk727ki5571i1.png

评论
new

直播时间:1970.01.01 晚08:00
直播嘉宾:
查看详情