【我的华丽衣裳：教你打造卡巴斯基超炫皮肤】〖入门篇〗

听雨醉

我的华丽衣裳：

教你打造卡巴斯基超炫皮肤

（入 门 篇）

作者：听雨醉    更新时间：2007-10-16

引   言

在制作了几款卡巴皮肤后，我收到了许多网友的热心来信，纷纷咨询和交流一些有关卡巴皮肤的安装、使用和制作等方面的问题和看法，甚至还有网友让我写出一篇教程来，教大家如何制作卡巴皮肤。呵呵，谢谢大家的厚爱，这次听雨就不揣自大，恭敬不如从命，遂利用工作间隙写了这篇教程。教程共分为三篇，内容并不太复杂，旨在让大家了解卡巴皮肤的一些相关知识，并DIY出自己喜欢的超炫皮肤。由于本人水平有限和时间仓促，纰漏之处在所难免，还请高手不吝赐教，以期共同学习、共同进步。

第一章  皮肤制作前的准备工作

第一节  知己知彼，百战不殆

古诗曰：“云想衣裳花想容。”一款制作精良、隽秀别致的外观或包装，能够让软件更加引人入胜、锦上添花。卡巴斯基实验室的反病毒软件（以下简称“卡巴”）自进入中国市场以来，以其功能强悍、交互性强、升级便捷等不俗表现而深受广大卡饭的青睐。自从6.0版本之后，卡巴又引入了skin（皮肤）的概念，增加了自由换肤的功能。不过遗憾的是，官方并没有提供皮肤的制作方法，网络上许多广为流传的精美皮肤均是出自一些卡巴爱好者之手。今天，我就来教大家如何制作自己喜欢的卡巴皮肤。

知己知彼，百战不殆。在制作皮肤之前，我们首先要弄清楚皮肤的资源都是哪些、位于哪些目录。好，请大家打开卡巴安装目录的skin文件夹，卡巴的所有语言和皮肤资源便一一展现在我们眼前了。它包括下列目录和文件：

·sch、en：语言资源，卡巴汉化爱好者最熟悉的地方。此处与本文无关，略；
·images：皮肤的所有图片、图标等资源，一个都不少；
·sounds：这个就不用多说啦，卡巴的警报、提示等声音文件；
·layout：与皮肤相关的高级配置文件，较为复杂。但若弄懂后则功能强大，例如可以改变卡巴的皮肤布局、使背景透明等等（在后面的内容中会讲到）；
·skin.ini：顾名思义，即皮肤配置文件。涉及到最基本的例如皮肤颜色、背景、字体、声音等元素；
·actskin.css、actsystm.css：貌似和皮肤有关，但这里我们用不到，略；
·ah.loc、bb.loc、enums.loc、glock.loc、privctrl.loc、prot.loc、risk.loc：语言资源，略。

好了，现在我们已经大概知道了皮肤资源都是哪些，下面就可以动手比划了。在本篇中，我们将着重讲述一下images里的文件在皮肤中的位置、作用和用途。

第二节  工欲善其事，必先利其器

准备开工了，赤手空拳当然不行。我们还得找几样称手的家伙。它们分别是：

·Photoshop：一款不用多说的图像制作软件，地球人都知道。我用的是CS1绿色版。当然其他版本也可以，有基本的功能就行。（必需！）
下载地址：http://down.9yxz.com/20077/Photoshop8.0_green.rar

·IconWorkshop：一款功能强大的Windows XP图标制作、提取、转换、管理和发布软件，帮您在几分钟之内制作出专业的漂亮图标。我用的是企业绿色版。（必需！）
下载页面：http://www.greendown.cn/soft/3280.html

·   好色鬼：不要误会，这是一款小巧多能的拾色工具。试了多款同类工具后，最终选用它。（必需！）
下载地址：http://www.crsky.com/soft/7833.html

·Ulead GIF Animator：友立公司出版的动画GIF制作软件，内建的Plugin有许多现成的特效可以立即套用。（非必需）
下载页面：http://www.sz1001.net/down/1127.htm

·XnView：非常棒的图像查看程序，支持150种图片格式，可与ACDSee相媲美。当然我们不在意其看图功能，需要的是其一项特殊功能。（非必需）
下载页面：http://www.greendown.cn/soft/5470.html

[ 本帖最后由 lwb_1211 于 2007-11-24 08:34 编辑 ]

听雨醉

第二章  皮肤制作全接触

第一节  磨刀霍霍向卡巴

呼呼，说了这么多还没有讲到正题，恐怕有人已经嫌我“唐僧”了。呵呵，好，闲话少说，下面我们就正式开始上课。请同学们拿起鼠标，翻到skin下的images目录，我们今天要学习的课文是《唐僧是怎么炼成的》。哦不不不，当然没有这篇文章……《唐僧是怎么炼成的》只是我的一篇短篇小说，还没完稿滴说……我的意思是说，等我讲到后面，如果你也已经变得唐僧的话，那么请不要怪我哦～

首先，要将skin目录备份一下，以防哪个文件改错的话还可还原——一定要养成这个好习惯哦，别到后悔时怪我没有告诉你：）当然如果你不小心忘了备份也不要紧，在我的作品的FAQ中有详细的恢复方法，可以去参考一下喽，嘿嘿～然后，再到设置中取消卡巴的自我保护和“使用系统颜色与风格”选项，以方便我们对原皮肤进行DIY。

◆ 小提醒

•  如果没有特殊说明，文中的卡巴版本为7.0.×××。卡6的皮肤与之有些不同，我们会在后面的内容中讲到。
•  卡巴的皮肤适用于同版本的全系列，即包括KIS、KAV、FS和WKS（语言资源亦同）。

◇ 你知道吗

Q：如何取消的卡巴的自我保护功能和“使用系统颜色与风格”选项？
A：设置→服务→取消“启用自我保护”前的勾；设置→界面→取消“使用系统颜色与风格”前的勾。


下面，请同学们将计算机翻到skin下的images目录，按缩略图查看，卡巴的皮肤图片就都在这里了，我们操刀直接在这里修改！其中主目录下146个文件，子目录tasks下31个文件，子目录tray下10个文件，总共187个文件，一个都不少。那么它们的作用和位置都是什么呢？请闭上眼睛，做三次深呼吸，嗯对，深呼吸、深呼吸……然后默念三遍：“爱生活、爱卡巴”，开始浏览下表——


Images目录中各图片对应功能一览表.rar (1.11 MB, 下载次数: 1377)

2007-10-16 14:31 上传

点击文件名下载附件



晕没？没晕走两步儿，对，走两步儿……

呵呵，别看这么多张图片，其实除去不需改动的外，纳入我们DIY范围的只有60张左右，而重点DIY的图片就更少了。所以算下来，需要仔细雕琢和磨功夫的大概不会超过40张。而且，这些图片的修改都是有技巧的，归类划分，理出头绪，你就会发现：原来卡巴可以更美的！

怎么样，大家有信心吗？

OK，那就Let`s go！

[ 本帖最后由 听雨醉 于 2007-10-16 14:52 编辑 ]

听雨醉

第二节  游刃有余，看我72变

想必大家都记得上小学时写第一篇作文的情形，语文老师会要求我们先列出一个提纲，然后才开始写作文，甚至连提纲带作文本一起上交。可能那时很多人都对此不理解，认为多余，老师太苛刻。但是如果你现在对作文还不讨厌的话，那么你一定会明白老师的一片苦心。皮肤制作亦然。同学们要先对images目录里的所有图片了然于胸，熟识熟记，并做一张制作列表出来，就如同我上面的那张《一览表》一样。目的只有一个，那就是纵有再多的图片，我们都知道它代表什么、什么意思、打算用什么来替换它、为什么用它，快刀斩乱麻、多而不乱……

周杰伦：“哇靠，这老师讲课好严肃啊，想吃人！兄弟们，想听我唱歌的都上去扁他！”

[email=#$%^&%&%$%#@$@#$]#$%^&%&%$%#@$@#$[/email]#&&*^(&)(&^^^^^^^^

少顷，听雨醉头顶一窝鸡蛋、身挂一袭果皮走上台来：“哎，同学们，鸡蛋水果这么贵，随便扔掉很可惜的，要是砸到小朋友怎么办?就算砸不到小朋友砸到那些花花草草也是不对的[email=……”#$%^&%&%$%#@$@#$]……”#$%^&%&%$%#@$@#$[/email]#&&*^(&)(&^^^^^^^^

◇ 你知道吗

Q：如何获取images目录下的文件列表？
A：其实很简单，一个命令即可搞定。
开始→运行→输入“cmd”（不带括号，下同），进入images目录，例如：
cd C:\Program Files\Kaspersky Lab\Kaspersky Internet Security 7.0\Skin\images
dir/b>1.txt
文件名列表就都在1.txt里了。其它目录的文件列表如法炮制。

列出皮肤目录的文件列表之后，下面我们就正式开始真刀实枪地做皮肤了，准确地说是开始DIY皮肤了。你是不是早已摩拳擦掌了呢？下面是我的制作思路，当然，我希望“青出于蓝而胜于蓝”，如果你有新的思路或对各图片已了如指掌，那么可以不按我这个顺序。

一、tasks目录

首先我们打开tasks目录，别忘了按缩略图方式查看。嘿嘿，卡巴各大监控及主要的大图标就都在这里了。我们就从这里开刀！

可能聪明如我者会发现，这些图片都是有规律、有联系的。比如：

antihackerX.png尺寸：64×64像素，antihacker32.png尺寸：32×32像素；
antispamX.png尺寸：64×64像素，antispam32.png尺寸：32×32像素；
…… ……

嗯，不错。它们分别都代表着卡巴的一种功能。一个位于主界面左侧各功能标题栏左端，另一个位于主界面各监控简介区域。

知道了这些那就好办了。那就拉出photoshop开始练吧！制作要领：

1、图片尺寸要保持原大小，不能随意改动；
2、大、小图片是一样的，仅尺寸不同，一般情况下不改变；
3、图片格式为png，背景要透明；
4、想到了再说，别打……

我先做一个“保护”的图标，同学们跟着学。

打开PS（就是photoshop啦），载入要修改的图片。

然后，图像→图像大小，设定大小如图。

OK，另存为protection.png。然后再将图像大小改为32×32像素。图像有些模糊？好办，滤镜→锐化→USM锐化（如图），然后另存为prot32.png。当然锐化数值你可以根据你的图像改，并不一定我设置得就对。这一步只是让图像清晰一些，色阶、曲线、亮度/对比度等等都可以，锐化简单些。

然后如法炮制，将剩下的图标也都改喽。打开卡巴看看，是不是有了一点儿成就感呢？J

什么？嫌我讲得太慢、太磨叽？简直就是唐僧转世？唉，做老师容易嘛我，台上一分钟台下十分钟，备课、做实验、写讲义、改作业，连泡MM的时间都没有。唐僧很无奈，很无奈……L


◆   小提醒

卡巴皮肤的修改支持所见即所得功能，即：你修改了哪个部位的图片或相关参数，那么一般无需重启卡巴，只要打开主界面，按下F5刷新即可立马预览到修改效果。

◇   你知道吗

Q：为什么皮肤图片绝大部分都是png格式而不是其它格式？
A：PNG是目前保证最不失真的格式，它汲取了GIF和JPG二者的优点，存贮形式丰富，兼有GIF和JPG的色彩模式；它的另一个特点能把图像文件压缩到极限以利于网络传输，但又能保留所有与图像品质有关的信息，因为PNG是采用无损压缩方式来减少文件的大小，这一点与牺牲图像品质以换取高压缩率的JPG有所不同；它的第三个特点是显示速度很快，只需下载1/64的图像信息就可以显示出低分辨率的预览图像；第四，PNG同样支持透明图像的制作，透明图像在制作网页图像的时候很有用，我们可以把图象背景设为透明，用网页本身的颜色信息来代替设为透明的色彩，这样可让图像和网页背景很和谐地融合在一起。



二、其它目录

做完tasks目录里的图片（其实并没完全做完，因为还剩余一两个不配对的图片可以先不做，后面我们再讲），就要开始对images目录下的图片发起总攻了！同学们，激动人心的时刻到了！现在，我宣布：立正，向右看，稍息！男的站左，女的站右，剩下的站中间。哎别看了，说你呢……就是你，拿着鼠标那位……哎呀！听雨醉不幸中蛋——全剧终……………………………………了那才怪～

听雨醉在众多粉丝儿的千呼万唤中终于苏醒过来。咬咬牙，为了这场战斗的最终胜利，坚持到底！

其实呢，剩下的images目录和tray目录里的图片就好解决多了，无需我多说，就看你有没有足够的耐心和细心了。想偷懒的话，tray目录可以完全不改；而images目录里图片就对应着制作列表，看哪个不舒服，炒它鱿鱼！看哪个不顺眼，AK47爆他头！就这样，磨啊磨磨啊磨；就这样，时间过了很久很久；就这样，牵着你的手不放开；就这样，爱简简单单没有伤害……

终于，终于想换的图片都磨完了。哪位同学的做好了，举手让我们看一下。

李伟波：“老师、老师，我的做好了！”

“嗯，看着还不错嘛。咦，怎么是俄文的？你，俄国大鼻子？”

“哦不是，这是俺刚刚从网上down下来的……”

“down下来的？我靠！抄袭抄袭抄袭抄袭，BS抄袭！同学们，都上去扁他啊……”

[ 本帖最后由 听雨醉 于 2007-10-16 14:38 编辑 ]

听雨醉

第二节  卡6皮肤的制作技巧

据有关调查资料显示，还有很多同学在用6.0版卡巴。6.0使用起来简单方便、占用资源又少（较7.0而言），所以这让许多人有了怀旧情结。鉴于自己的爱机配置又不高，所以就决心挺着卡6厮守一生。好，那我就好人做到底，在这里简单给大家介绍一下卡6皮肤的制作技巧。（其实，我心里是多么想让你改用卡7啊，强烈推荐～！）

打开images目录，按缩略图方式并按类型查看，可能冰雪聪明的同学都已发现了，卡6的images目录下与卡7的不完全一样，除了png图片外，还有很多ico文件。这些文件是做什么用的呢？其实它们也是代表着卡巴的某项功能，只是它的特性没有png格式优异和突出，所以在以后的卡巴版本（6.0.1.×××版）中已被淘汰。下面，我们就简单了解一下它们。

◆ 小提醒

• ico文件仅大量存在于6.0.0.300/303/307简体中文版中，其它版本中没有。
• 卡6的images目录下的文件列表我就不贴上来了，我将我当初制作绝世武器皮肤时的列表放在附件内上传上来，仅供大家参考。

◇ 你知道吗

Q：什么是ico文件？
A：ico是Icon file的缩写，即Windows的图标文件格式的一种。通常体积很小，用来做软件或其它文件的图标。当然它也可以包括多个像素深度的图像格式，体积会增大。

一、ico图标文件的制作技巧

在做过卡7的皮肤之后，卡6的就好做多了，流程也是先做一制作列表，然后照着挨个DIY。这叫先难后易、熟能生巧。当然你考试答卷子时可千万别这样，不然烤个鸭蛋你就当早餐煮了好了，我概不负责。

现在，就要请出我们的另一款重磅武器——IconWorkshop登场了。这款工具很好、很强大，其在ICO界的知名度就如同PS在二维图像制作界的地位一样不可撼动！下面举例说明它的具体用法。

用IconWorkshop打开application.ico，编辑→属性，图标文件的信息就全在这里了。

◇   你知道吗

Q：什么是像素深度？
A：一个像素所能表达的不同颜色数取决于比特每像素(BPP)，即像素深度。它也是用来度量图像的分辨率的。这个最大数可以通过取二的色彩深度次幂来得到。例如，常见的取值有：
8 bpp [28=256; (256色)],
16 bpp [216=65536; (65,536色，称为高彩色)],
24 bpp [224=16777216; (16,777,216色，称为真彩色)]。
48 bpp [248=281474976710656; (281,474,976,710,656色，用于很多专业的扫描仪)

在制作图标时，我们需要注意这些文件的像素深度和尺寸是不能改变的。

首先，用IconWorkshop打开一张我们已经将尺寸调整好的png图片（背景是透明的），在编辑区右键→从所选创建windows图标，在弹出的对话框中选择32×32-xp。（xp位即24位每像素）

确定，保存为application.ico。OK，大功告成，是不是很简单呢？其它ico文件亦如法炮制，即——先做好或选好该ico文件的png格式（背景必须是透明的），然后重复上述操作，挨个磨啊磨、磨啊磨，不再赘述～

◆   小提醒

在众多的ico文件中，有一个regicons.ico。从卡6到卡7的众多版本中，它一直都没变。它应该是注册表防护在记录日志要所调用的，很特殊，请一定不要改动它。

二、navstate.ico文件的制作技巧

如果你有兴趣，那么navstate.ico绝对不容错过。它类似于卡7里的navstate.png文件，表示卡巴的某项功能当前被选中。但是打开它后，你会细心地发现它并不像其它ico那样内容居中，而是偏向左侧，只占了半部分区域。为什么呢？哈哈，这正是它的好玩之处。到底是什么，暂时保密。

用IconWorkshop分别打开navstate.ico和需要往其右侧添加的图片，复制欲添加的图片内容，按1:1粘贴入navstate.ico的编辑区域，并调整好大小位置，如图。

然后，保存，替换原navstate.ico，打开卡巴主界面，点选各功能试试，你发现了什么？J

[ 本帖最后由 听雨醉 于 2007-10-16 14:49 编辑 ]

听雨醉

第三章  并非废话的总结

其实，制作一款精美的皮肤并非易事，它需要作者付出大量的心血和努力，简单地说就是要“三心一会”，即：对卡巴要有爱心、制作中要有耐心和细心，以及要会一点儿Photoshop（听雨醉语），少了一样都不行。

制作一款皮肤，从确定皮肤的主题或主格调，到搜集大量的相关文字资料、图片素材等等，这些都是无法用文字来叙述的，是大量的“幕前”工作做基础才能呈现后面的精彩佳作，并且有时素材不够用了，边制作还要边再搜索新的素材。如此种种，只有亲自深入进去才能切身体会到其中的酸甜苦辣、快乐艰辛。要不我以前的皮肤作品最后为什么总要来一个“制作絮语”呢，呵呵～

好了，今天的课就上到这里。讲得不当之处请大家多多指正批评，我会在下次讲课时努力改正。什么？我唐僧？哎，呵呵、嘿嘿、哈哈，这个……这个也是江山易改、本性难移嘛，也是想让大家听得明白些，我下回跟进、跟进……

这次留给同学们的课后作业是，运用今天所学的知识，发挥你的聪明才智，每人制作一款自己喜爱的卡巴皮肤。我相信：大家都能够认真、圆满地完成，因为你是优秀的，你是最棒的！

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
下课喽，一起happy吧，不会休息就不会学习！HOHO～

[ 本帖最后由 听雨醉 于 2007-10-16 14:51 编辑 ]

暗天使

抢占位置~~~不错的帖子。。。学习了。。

[ 本帖最后由 qlltyoxi 于 2007-10-16 14:39 编辑 ]

地之雾

好帖  ，这个教程做完了，来个奥运皮肤吧
我觉得这个皮肤做的不错：我现在用这个皮肤


[ 本帖最后由 地之雾 于 2007-10-16 16:26 编辑 ]

dianshixs

很不错,值得学习!

笛儿多

楼主你太辛苦了，不顶不行啊

westfeet

多谢分享,不错的教程,学习一下...