像素化风格渲染（一）

Ylisar

我对像素游戏情有独钟。
小时候最早接触的游戏机就是山寨俄罗斯方块游戏机，印象里除了俄罗斯方块还可以开坦克，开赛车和青蛙过河之类的。如此抽象的表现形式在小时候的我看起来充满了无穷的趣味。一直到现在我都很喜欢像素风，高中的时候购买了一台二手java索爱手机，大学大一上学期偷偷攒钱买了psp，3ds，switch。哦对了，还有一个特殊的“游戏机”，是一个图形计算器，可以下载别人编写好的游戏游玩。

Ti-92+游玩马里奥
https://www.zhihu.com/video/1531518058615476224
所以步入正题，我要写一段像素风格的shader。
首先从原理入手。
像素风格我的理解是模仿早期设备低分辨率的条件，做出的一种抽象的画风。早期设备是迫不得已才做成像素风格的，然而我们现有的设备不是2k高清屏幕就是视网膜屏，类似于蔚蓝这样的游戏都是高清马赛克。



The Last Night，完美结合3d光影和2d像素

而以三渲二的方式来表现像素风格的游戏可以有效减少绘制2d帧动画的工作量，把3d的光，动画，角度切换应用到2d上去。有幸接触到了一个Unity插件pixelizer，看到了作者所给的讲解，在此记录研究的过程。
<hr/>总体上像素化原理就像这个视频里展示的一样：原来图片是这样压缩的_哔哩哔哩_bilibili
方法一：不用任何代码，利用Render texture，然后降低分辨率，将其添加到Quad上，用另外一个camera调整好角度对准Quad。

原始图像
https://www.zhihu.com/video/1532469496815595520

使用render texture后（128*128)
https://www.zhihu.com/video/1532469857115545600
这个是unity商店里的免费模型，由于没有硬阴影，所以看起来还不是很‘2d’这种方法最终效果很像以前的怪物猎人，特别是3ds上的怪物猎人，可以看出是有不错的像素化效果的。但是这种风法局限性也很大，因为这相当于降低了物理分辨率。而且这样的渲染每次都需要额外的camera，当有大量物体时性能很捉急，只能用在小场景里。
方法二：剔除像素 + 全屏后处理
首先进行剔除像素代码。原理就是，设置一个固定的数值d，然后每隔d个像素保留该位置的像素点，然后其余的剔除。



原始的



剔除像素之后，这里每隔5个保留一个像素

ps.有种透明的做法就是和这个差不多，前后遮挡的时候剔除像素。
最后写一个屏幕后处理，对于每个屏幕像素，搜索周围5个像素（因为间隔为5），取不透明的那个。



最后的效果


可以成功渲染成像素风格
https://www.zhihu.com/video/1533548277492703232
当然还存才一些问题，比如正反体尖锐边缘会有一些不规则的颜色，因为这个材质贴图在棱处有一条黄边。
还有像素风格光照处理问题等。这个后续讨论。