其他可能的改进

投影增强

前面我们在进行扩散投影模拟的时候,是同时对周围八个点进行采样,但是事实上,有时为了控制投影的方向,可以只对一侧的点进行采样:

如图所示,只需要对右下角的五个格子采样,就可以模拟出左上角的光照。

这样造成的效果是亮的部分会凸起,暗的部分会产生凹陷的效果:

函数的拟合

前面在计算相邻点的加权颜色值时,用到了一个指数函数。指数函数的效果的确很好,考虑到在某些平台上 exp 的消耗可能有点大。另外,任意两个像素之间的欧几里得距离不会超过2.3个像素,所以我们尝试对函数进行一个拟合,如0.926+1.441x + 0.6578x^2 + 0.0417x^4

其实我们还可以将把它化成1/(7x^2 +1),效果也还可以,只是无论是哪种情况,在 PC 上测试差距并不明显(也有可能适得其反)

扫描线

考虑到有些游戏中,会出现一些因为曝光过度而无法显示扫描线的情况。于是,我们就需要对扫描线进行加强:

  1. float limit = 1 - step(257.0, min(frac(i.pixel_no.x), 1- frac(i.pixel_no.y)) * _MainTex_TexelSize.z);
  2. float bright = Luminance(out_color);
  3. return fixed4(out_color *(1.8 - limit * bright * bright * 0.89), 1.0);

复制代码

但是对于某些偏暗的游戏,如果为了提高整体亮度,而扫描线同时也强化的很厉害,那么就会导致“碳化”:

中间的白色由于亮度过高,在补偿的时候会显得非常暗

虽然这样的扫描线加强在其他场合正是我们需要的,但在这里只会让画面变得很脏。关于这个问题并没有很好的解决方案,这需要根据不同游戏对参数做出调整。作为游戏开发,如果美术风格及早的确定,颜色的选择有所参照,将会对程序的优化有极大的帮助。而2D 像素游戏由于很少受光照影响,再加上像素画本身也极其依赖于 palette,所以如果 palette 控制的好,是可以根据其调试出一个很好的状态的。

由于目前只用针对一款游戏,所以上面的手工调整可以接受。如果我们需要大量的调整,我在想,可能还有一种思路是像 tone mapping 一样,将亮度映射在一个合理的区域内,这样既保留了细节又处理了边界状况。

Tactics Ogre 的特殊处理

刚开始我为 Taactic Ogre(中文译为:皇家骑士团)写 shader 的时候,出现了一个问题。由于很容易知道 psp 的分辨率是480*272,我就将其硬编码到 shader 中。但是却出现了一些意想不到的状况。在横坐标方向上,扫描线的分布不均匀。由于是周期性的,并且随着窗口的扩大问题更为严重,我最开始猜测是模拟器的精度出现了问题,我查了下 changelog 也的确提到了这个问题,只是我使用的版本应该已经修复了这个问题。另外,我测试了其他的游戏,发现一切都很正常,如果真的是精度问题,不该只出现在这一款游戏上。查看了整个 render 过程后发现 Tactics Ogre 中有些地方与其他游戏做的不同,比如:

注意纹理右侧的黑边

Tactics Ogre 在 draw 顶部的滚动文本时,二手游戏账号购买并不会对其裁剪,而是放到了第二个 color pass 里才进行裁剪:

不过 ppsspp 模拟器提供了 u_texelDelta 这样一个 uniform,我们可以利用它得知当前输入纹理的 resolution:

  1. vec2 c_resolution = 1.0f / u_texelDelta;

复制代码

这样,即使在某些场景中,屏幕的分辨率发生变化,我们也能够保证显示正确的扫描线。

最终 PSP 模拟器效果图

在这里给出自己制作的在 PSP 模拟器上的最终效果,请放大后观察。

结语

本文主要讨论了针对细像素游戏的画质增强,但是这并不意味着像素游戏的增强方式只有一种,相反,光是这里?就提到多种后期特效。我们也无法说哪种效果比另一种更好。更多的时候,还是需要根据对游戏的定位来定制自己的后期特效,从而让画面为游戏核心服务。程序和美术之间的沟通是否充分也是能否有效的构建出成功的游戏画面中很重要的一个因素。

最后,你们觉得这是一篇讨论像素游戏中画面增强的文章吗?

不,不是的,我只是在安利 Tactics Ogre

从像素之间谈起:像素游戏的画面增强(下)相关推荐

  1. 从像素之间谈起:像素游戏的画面增强

    转自:http://fushigi-hako.site/2017/07/02/from_pixel_to_screen_1/ 无所不在的像素画 分类 随着分辨率的普遍提高,我们已经告别了依赖于简陋像素 ...

  2. 从像素之间谈起:像素游戏的画面增强(上)

    分类 随着分辨率的普遍提高,我们已经告别了依赖于简陋像素来表现游戏画面的年代.但还是有不少人像我一样沉迷于像素美术和游戏.如今到处可以都可以看到的各式像素作品,虽然大多被直接称呼为像素画,但实际上已经 ...

  3. 深入理解——亚像素 / sub-pixel、亚像素卷积

    目录 1.1 亚像素理解 1.2 何谓亚像素? 1.3 何谓亚像素精度? 摘要: 2 图像处理中的sub-pixel是什么意思? 3 PixelShuffle(像素重组) 1.1 亚像素理解 在相机成 ...

  4. 【深度学习笔记】亚像素 / sub-pixel、亚像素卷积

    近段时间需要用到亚像素卷积的知识,因此上网查阅了论文和资料,此文是根据网上的博文以及相关论文,依据个人的理解整理而来. 总而言之,拾人牙慧而已. Content 1 亚像素的定义 1.1 亚像素理解 ...

  5. unity中单位是米还是厘米_2019-08-22Unity中的单位长度与像素之间的关系

    一:什么是像素? 像素是由很多个小方格组成,每一个小方格上都存储了位置信息和色彩信息.像素是图像的最小单位 分享一个知识点:图像分为两类,位图和矢量图 位图(点阵图):由多个像素组成,当放大时被分为多 ...

  6. 4.设备像素、css像素、设备独立像素、dpr、ppi 之间的区别?

    一.背景 在css中我们通常使用px作为单位,在PC浏览器中css的1个像素都是对应着电脑屏幕的1个物理像素 这会造成一种错觉,我们会认为css中的像素就是设备的物理像素 但实际情况却并非如此,css ...

  7. css基础知识四:说说设备像素、css像素、设备独立像素、dpr、ppi 之间的区别?

    一.背景 在css中我们通常使用px作为单位,在PC浏览器中css的1个像素都是对应着电脑屏幕的1个物理像素 这会造成一种错觉,我们会认为css中的像素就是设备的物理像素 但实际情况却并非如此,css ...

  8. 设备像素、css像素、设备独立像素、dpr、ppi 之间的区别

    一.背景 在css中我们通常使用px作为单位,在PC浏览器中css的1个像素都是对应着电脑屏幕的1个物理像素 这会造成一种错觉,我们会认为css中的像素就是设备的物理像素 但实际情况却并非如此,css ...

  9. 说说设备像素、css像素、设备独立像素、dpr、ppi 之间的区别?

    一.背景 在css中我们通常使用px作为单位,在PC浏览器中css的1个像素都是对应着电脑屏幕的1个物理像素 这会造成一种错觉,我们会认为css中的像素就是设备的物理像素 但实际情况却并非如此,css ...

最新文章

  1. 【迁移学习(Transfer L)全面指南】基于迁移学习完成图像分类任务(Pytorch)
  2. td 超出部分怎么显示_道瑞斯:黄金白银TD走势分析(纸黄金,纸白银,现货黄金,现货白银)...
  3. [react] 说说你对windowing的了解
  4. Grafana Prometheus 服务安装部署(Linux服务器监控)
  5. Android热更新开源项目Tinker集成实践总结
  6. Redis有哪几种数据淘汰策略?
  7. 山东计算机专业的在职硕士,山东轻工业学院在职研究生计算机专业如何复习
  8. 剑指offer面试题17. 打印从1到最大的n位数
  9. 011:求排列的逆序数
  10. IE重置input file
  11. MariaDB 安装与启动 使用MySQL
  12. 豆瓣电影top250
  13. java 银联,支付宝接口
  14. 常识之外:全表扫描为何产生大量 db file sequential read 单块读?
  15. git文件夹不区分大小写_Git区分大小写并且您的文件系统可能不区分大小写-Windows上奇怪的文件夹合并
  16. SELECT list is not in GROUP BY clause and contains nonaggregated column 异常
  17. SaaSBase:免费的思维导图软件:2022年9种最好的工具
  18. FPGA学习-Verilog例化说明
  19. Android跳转到拨打电话界面和拨打电话
  20. 【clion】Clion安装与配置

热门文章

  1. 抖音上css照片动态旋转怎么做,抖音里单张图片平移视频怎么制作?影音制作实现一张图片从左到右滑动视频效果...
  2. 机器学习-医疗保险花费问题
  3. 3Done 文字绘制到球体或者圆柱体上方法
  4. 【CTO辩论会】移动开发者忠于技术or 背离技术
  5. 解决libpng error: IDAT: invalid distance too far back问题
  6. 考研数学二真题用到的知识点
  7. 基于SpringBoot的预约挂号微信小程序
  8. jh锂电保护电路_锂电池保护电路设计方案
  9. 计算机绘图综合训练铣刀头实训报告,典型零件测量与计算机绘图
  10. 大学生课程设计 ------ 安卓Android软件设计(电话本)