像素画吧 关注:19,675贴子:49,440
  • 16回复贴,共1

如何用2D画出3D像素画

只看楼主收藏回复

本方法用到了法线贴图,简单地说就是用RGB三个值表示一个面的倾斜度,当然你也可以用3D建模更简单地实现这一点,不过本吧是像素画吧不是吗?
下图分别为像素画和其法线贴图,以及其在Godot引擎中的效果。




IP属地:安徽1楼2025-02-06 07:43回复
    就用一个简单的四棱锥作为范例吧,我们首先要知道一个物体是什么颜色的,如果是光滑的表面,请用纯色体现,如果是粗糙的表面,则用杂色表现。如图是一个白色四棱锥的顶视图


    IP属地:安徽3楼2025-02-06 08:13
    回复
      接下来就要知道这个物体不同面的倾斜度并绘制法线贴图了,用建模软件可以很轻易地得到,我稍后会解释这种方法其实存在一个不大不小的问题,不过一般可以忽略不计。建模软件得到的法线贴图如下


      IP属地:安徽4楼2025-02-06 08:20
      回复
        将颜色纹理(也就是像素画)和法线贴图导入后在灯光下得到效果


        IP属地:安徽5楼2025-02-06 08:29
        回复
          用这种方式绘制的像素画有一个好处就是不需要考虑明暗关系,只要画出像素画和一张法线贴图,随便哪个角度的光打上去就会自动产生亮面和暗面。之前说的不大不小的问题就是建模软件生成的法线贴图只能表现倾斜度而不表现位置,所以不会产生阴影,一个面的明暗只取决与它的朝向,其他任何物体都不能对它造成影响。


          IP属地:安徽6楼2025-02-06 08:37
          回复
            所以我们就来试试手绘一张法线贴图,这是一个一张有不同倾斜度代表颜色值的色盘,其中周围的蓝色表示的是平行于屏幕的平面,至于其他颜色。。。这么说吧,你可以把整个色轮看成一个垂直突出屏幕外的蒙古包


            IP属地:安徽7楼2025-02-06 08:43
            收起回复
              接下来就是手绘部分,如图,这部分是一楼展示的桌子腿,因为桌腿会被桌面遮光,所以用蒙古包色轮的最下方的紫色来作为其法线贴图的部分,(稍加一点网点笔)结果如下



              IP属地:安徽8楼2025-02-06 08:56
              回复
                综上,算是不完美地解决了建模软件生成的法线贴图存在的小问题,拥有复杂曲面的图像的法线贴图建议你用ps而不是aseprite,能用扭曲工具解决的问题靠手绘有点折寿。你问我为什么用aseprite画法线贴图?因为我脑子里有泡


                IP属地:安徽9楼2025-02-06 09:02
                回复
                  质感有点怪


                  IP属地:福建来自Android客户端10楼2025-02-06 11:38
                  收起回复
                    不太能体现质感,不过作为一种风格挺好的


                    IP属地:天津来自Android客户端11楼2025-02-06 11:53
                    收起回复
                      实际上很多游戏里的像素画面都是以这种方式呈现的


                      IP属地:江苏来自Android客户端12楼2025-02-08 08:05
                      回复
                        哇哦,所以说像下面这张图也是用法线贴图做出来的吗


                        IP属地:广西来自Android客户端13楼2025-02-08 22:40
                        收起回复