大多数游戏菜单都是平面的,使用2D图像、文本和面板直接绘制在屏幕上。我们的游戏《大卫琼斯的船员》是一款牌戏游戏,迄今为止几乎所有内容都使用屏幕空间UI。但是,新船日志并不是这样设计的,而且这种选择带来了几个值得解释的挑战。 图像:船日志gif
我决定将船日志菜单设计为一个真正的3D物体,能够自然地弯曲并翻页。为了实现这一点,我没有绘制菜单作为一个平面的图像,而是构建了一个实际的小3D场景,一个物理书籍模型坐在自己的迷你空间里。 图像:UI投影到3D网格的场景视图
使用3D场景作为菜单的困难在于,Unity引擎自然地将UI绘制在世界空间的上面。这对于我们的游戏来说尤其困难,因为几乎所有内容都是UI,包括主战斗。因此,要让3D船日志菜单在战斗场景上方渲染,我们使用一个隐藏的摄像头来“拍摄”书籍,这种方法每秒60次更新。看起来像是一个绕道的方法来展示菜单,但这就是让3D风格日志在绝对所有其他东西上方弹出的窍门。 因此流程是: * 书籍页面上的内容在平面2DUI画布上创建 * 该2D画布上的页面内容被其隐藏的摄像头捕获 * 该摄像头渲染它看到的内容到一个应用到3D页面网格的纹理上 * 3D物体被另一个隐藏的摄像头捕获 * 该摄像头捕获3D物体渲染它看到的内容到一个2DUI面板上 * 我们看到最终的2DUI面板 😅 图像:平面UI页面内容被投影到纹理
实际上,页面弯曲像纸张一样。每个页面不是一个平坦的矩形,而是一个可弯曲的网格,它在实时旋转时弯曲和剥离,就像真正的书籍页在书脊附近那样。甚至有一个“角剥”效果,就像你用书角夹一样,每个页面都有真正不同的纹理印刷在其前面和后面。这个整个系统在制作鼠标位置检测时又带来了另一个头痛。因为页面弯曲而不是平坦,我们必须在3D空间中工作,来确定鼠标点击实际上落在弯曲表面上的地方,而不是仅仅在你的平面屏幕上看起来落在哪里。有一段时间,每个页面的不可见“点击检测器”使用的是一个扁平的替代形状,而不是真实的弯曲形状,这意味着点击落在了稍微不准确的地方,尤其是在页面中心以外的地方,因为这正是曲线向平面弯曲最多的地方。因此,点击检测必须在实时中考虑到真实的页面弯曲,以使其感觉准确。这个仍然是WIP,且没有任何玩家在“哇,酷的技术”方面看到它。如果我们做得对,它就像一个令人满意的小物理书籍,哪怕你在玩什么游戏,它也能正常工作。这也是我第一次涉足3D领域。它是一种有趣的rabbit hole。很高兴回答任何有关它的问题。有人用不同的方法实现了类似的结果吗?对于从未听说过我们的游戏的人,快速背景:我们正在打造《大卫琼斯的船员》,一款海洋风格的roguelike牌戏。您在岛屿之间航行,使用牌子进行战斗系统,管理两个“姿势”并进行反击。新船日志尚未在游戏中,但我们已经有了一份live演示,您可以在Steam上查看: https://store.steampowered.com/app/3544900/Davy_Jones_Deckhand/
评论 (0)