用gimp制作最简单的光影
本帖最后由 perryfa 于 2010-12-4 14:19 编辑昨天看到zxcyzcs制作出了第一个xfce主题，我很欣慰。在讨论中提到了光影效果的制作问题。合适的光影效果对任何一张图都是至关重要的，技巧性非常强，我自己在这方面也只会点皮毛，被zxcyzcs同学激励，我也分享一点出来给大家做个参考吧。
首先我们看这张图：
http://www.lucky8k.com/data/attachment/forum/201012/03/154039pvp69vpm9fj5cpyd.png
这是我做的一个e17的主题的程序窗口，看图中的标题栏部分，标题栏看上去是玻璃的，有厚度，这种效果完全是用光影效果画出来的。
现在，我来一步步做给大家看。
首先，我开一张空白的200x200的图片，给图片整个灌上土黄色：
http://www.lucky8k.com/data/attachment/forum/201012/03/154040ib96k6ibz1oqw11m.png
纯色的图片，没有任何光影效果，看上去和第一张图的玻璃感标题栏没有任何相同之处。
仔细看标题栏可以发现，图的上方和下方颜色深浅是不一样的，上面比较黑，下面比较亮，所以，现在我给这个土黄色的图层上加上一个透明图层，并且加上黑色阴影。
我用gimp中的混合工具，设置如下图：
http://www.lucky8k.com/data/attachment/forum/201012/03/154043ptz3fflq1r5lnptn.png
首先我把前景色设为黑色，把“渐变”设置为“前景到透明”，把“形状”设置为“Linear”，就是一般的“线性”的意思。然后到新的空白图层上去拉，从最上面拉到最下面，出来就是这样的图层（关掉之前的土黄色图层）：
http://www.lucky8k.com/data/attachment/forum/201012/03/15404488ao86l9z7mhp7ac.png
把之前的土黄色图层点开小眼睛，就是这样的
http://www.lucky8k.com/data/attachment/forum/201012/03/154046l6t676raay9kj7dx.png
我对比了一下标题栏，感觉黑色有点太深了，所以，在图层窗口我调整了一下“不透明度”，把这个黑色渐变的图层的不透明降低，降到30左右，感觉好一些了：
http://www.lucky8k.com/data/attachment/forum/201012/03/154047bf11bcrcp2j7csej.png
这个图层就完成了。
上面这张图和标题栏的图还有很大的差别。在标题栏的上方，明显有厚度的感觉，感觉这是个玻璃条凸出平面的，如果仔细看的话，你会发现，所谓的凸出其实只是有些灰白色的颜色在上面，也就是通常说的“高光”。现在我来做这个白色高光图层。
建立一个新的透明图层。
还是使用混合工具：
http://www.lucky8k.com/data/attachment/forum/201012/03/154859y404yjybzm84dyrr.png
前景色： 白色
渐变： 前景到透明
形状： 对称线性
对称线性和一般的线性不同，一般的线性的渐变该是从鼠标开始拉到结束的颜色渐变，而对称线性是从鼠标开始拉到结束颜色有渐变，同时，在鼠标开始点的另一个方向也有同样的渐变颜色出现，如果你从上到下拉，那么颜色是上下对称的，如果是左右拉，那就是左右对称。
现在我要实现颜色的上下渐变，同时不想要完全对称，怎么拉呢？这样：
http://www.lucky8k.com/data/attachment/forum/201012/03/154050a83iffw37ziy7vv4.png
鼠标点接近上边沿，然后往下拉一小段，即上图的那根上下的细线，那就是我用鼠标拉出来的轨迹，我只拉一小段，这样，从前景的白色到背景的透明就在这一小段里完成了。拉这个小细线要注意一点，线一定要拉直，不能有倾斜，不然出来的效果就不是我要的了（你可以试试斜着拉线，看看会是什么样）。出来的效果如下图：
http://www.lucky8k.com/data/attachment/forum/201012/03/154051wman4hrm4nrwwiur.png
因为小细线下面部分我没有拉到，所以就是透明的，而细线的上面部分，本来应该是完全和下面部分对称，但因为我在上面部分只留了很少的空间，所以看起来就是一点点，就是这一点点体现出了这块玻璃板上边沿的厚度。
我自己觉得这个白色高光有点太亮了，有突兀感，所以，把这个图层也降低一下不透明度，设成70左右，看上去就柔和一些了：
http://www.lucky8k.com/data/attachment/forum/201012/03/154052fgob4yuq1tg74u4f.png
现在来处理图片的下面部分。从标题栏可见，图片的下面部分是比较亮的黄色，颜色比较浅。这个效果还是可以用混合工具来实现。
建立一个新的透明图层。
直接在第一张图片里取来橘色作为前景色，在混合工具里设置：
渐变： 前景到透明
形状： 对称线性
鼠标这样拉动：
http://www.lucky8k.com/data/attachment/forum/201012/03/154053710u1tn6mn1cnw5d.png
鼠标点接近下边沿，往上拉，依然是下面留出一小部分。为了让淡黄色看上去柔和，我把这个图层的不透明设为90.
http://www.lucky8k.com/data/attachment/forum/201012/03/154054befffssrz87jjfjr.png
上图看起来已经像个玻璃了，最后，我又加了了一个新图层，在上下边沿各加了三个像素宽的深色边线，让玻璃的凸出感更强一些。这就是最后的图了：
http://www.lucky8k.com/data/attachment/forum/201012/03/154056xd841jv0duh1vcct.png
如果觉得效果不满意，这张图还可以反复调整，因为都是分层画的，调整起来十分简单，例如黑色图层可以更透明一些，甚至干脆去掉黑色图层，又例如底部的亮光可以更宽一些等等。我在这里只是演示一个过程，并没有很注意地调整效果。事实上，我在做主题时，这张图调整了不知道多少次。作图就是这样，需要非常耐心。
这是我上面作图过程的xcf文件，想学的同学可以下载来参考，主要就是看每个图层：
又有新教程啦，真好，论坛换了风格了还未适应过来，找了很久才找到 楼主又用新主题了，楼主真是从未被超越啊，啥时都用新主题 gimp的教程网上很缺乏啊，感谢楼主，要好好学习实验 实现颜色的上下渐变............gimp绝对是个技术活啊