如何为2D侧滚动游戏实现假的3D像失真效果?


14

尽管我认为这是某种后期处理效果,但我不确定要搜索的合适术语,甚至不确定从何处开始。

我见过像《我想成为笨蛋》和《你必须赢得游戏》之类的游戏,它们设法修改了2D游戏的视角,使它们具有某种3D效果(请参见下图)。当您必须赢得游戏时,Boshy基本上使其看起来像在塔(圆柱体)中,从而使图像失真,从而看起来像在旧的CRT显示器上播放,特别是略带圆角的外观。

  • 有这种效果的术语吗?
  • 实现这种效果(术语)的标准方法是什么?
  • 从20,000英尺的角度来看,我将如何在高级引擎/框架(如Unity或XNA / Monogame)中实现这种效果?(详细的代码很容易被接受,但不是必须的-我意识到确切的实现细节可能会有所不同,但是对于需要做什么的高级细节将不胜感激)

我想成为混蛋 我想成为大佬

你必须赢得比赛 在此处输入图片说明


是的 我一直很想知道这项技术的确切术语。我能想到的最好的是“旧电视屏幕效果”
Tofu_Craving_Redish_BlueDragon

究竟!这仅适用于后一个示例
SpartanDonut 2014年

Answers:


7

这可以实现为一种后处理效果。(使用Unity / XNA / Dx / OGL / ...时)

几何方法

首先创建类似于您要实现的变形效果的网格。(例如,对半圆柱体(或圆锥体,球体,立方体等)建模,请确保设置纹理坐标)。照常渲染2D游戏,但将最终结果渲染为纹理。然后,使用刚创建的纹理渲染变形几何。您可以使用世界/视图/投影或修改实际的几何/纹理坐标来控制变形的强度。(图1显示了常规2D游戏,图2显示了投影到球体上的相同纹理)

游戏范例 将示例投影到球体上(使用混合器)

失真方式

图像处理工具通常会提供可以模拟投影的失真效果(有点像光学错觉)。例如,图像3是使用Paint.Net的凸出滤镜生成的

凸起变形

(您可以从GPUImage中找到此失真效果的实现(OpenGL ES 2.0)项目中 -请参阅GPUImageBulgeDistortionFilter)

根据实现的不同,这两种方法都可能更快或更适合您所需的结果。由于这两种实现都非常简单,因此您可以尝试同时实现这两种,然后看看哪种方法最适合您。


很棒的答案!
Tholle,2014年

1
两者都需要处理相同数量的图像。投影永远比不做任何事情都要快,并且图像处理的成本相同。-“失真”方法更快,因为您跳过了顶点变换和栅格化,还为驱动程序提供了更多的自由来迭代像素,其中多边形方法更具体地描述了绘制顺序。最后,多边形保留有关预期效果的信息较少,而求助于一般解决方案,该解决方案强调纹理过滤硬件并产生近似值,而不是真实过滤器。
MickLH 2014年

@MickLH:此类后处理投影的顶点可以脱机或在加载时进行计算,从而产生非常便宜的直通顶点着色器。对于凸出滤镜,还必须渲染和栅格化全屏四边形(除非SpartanDonut可以访问例如计算着色器),并且必须为每个像素计算偏移量而不是进行插值。因此,我相信(取决于可用的工具和实现)这两种方法都可以同样快。我已经更新了答案,谢谢您的投入。
米克拉斯
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.