我们知道,Winamp由于支持第三方皮肤,所以皮肤数量众多,大量的精品之作更是让人眼花缭乱。不少网友以收集Winamp皮肤为乐,网络上也有不少皮肤专业站点。Winamp皮肤不仅仅美化了Winamp本身,经典的皮肤已经成为竞相模仿的“偶像”。所以,许多软件都以Winamp为典范,纷纷引入类似的功能。
国内最为流行的IM工具QQ在以往版本中也有许多让人爱不释手的皮肤。但是,随着软件的升级,软件界面也不断变化。旧版本的漂亮的皮肤,并不能和新版本的各种功能相适应,所以,急需一些新版本的皮肤来装饰我们的QQ。
过去,腾讯只提供一些关于QQ皮肤的技术文档,我们需要用记事本等文本编辑工具手写配置文件。所以,制作皮肤相当的麻烦。许多搞平面设计的朋友对各种各样的脚本、代码都很反感。面对QQ复杂的配置文件大多望而却步。
|
|
|
一、制作思路 |
最近,腾讯推出了所见即所得的可视化QQ皮肤编辑工具(下载地址:天极网下载频道)。和大多数所见即所得的软件一样,我们无需手写配置文件,就可以制作出精美的皮肤。软件支持最新版的QQ2004Beta,制作新QQ皮肤变成一种轻松愉快的事情。经过小黑试用,感觉和所见即所得的网页编辑工具比较类似。有平面设计或网页设计经验的朋友可以很快上手。对于普通网友,也不妨自已动手给自已的QQ打造一件独一无二的皮肤。下面让我们先来看看本文中所讲述的实例制作得出的最终QQ皮肤效果。(本文制作的QQ皮肤成品包在本文尾页提供下载,QQ皮肤使用方法详见《QQ-Skin使用说明》)

QQ主界面
QQ聊天窗口
在上一篇文章《走近QQ皮肤编辑器》中,小黑介绍了QQ皮肤编辑器 V1.0 。在本文中,小黑将给大家讲述如何使用QQ皮肤编辑器制作QQ皮肤。本文主要内容为:制作QQ2004皮肤的一般思路;访苹果效果皮肤的详细制作过程。QQ皮肤编辑器 V1.0不提供图片编辑功能,小黑使用Photoshop来编辑图片。由于篇幅所限,文中涉及Photoshop处理图片部分不做讲解。当然,您也可以使用其它图片编辑软件来制作、处理皮肤中的图片。关于使用Photoshop等软件的文章,你可以参看天极网设计在线的精品文章《Photoshop 精编手册》和《实用图像处理手册》,另外网络上也不有少相关文章,有兴趣的网友可以用“狗狗”搜索出来参看。
一、制作思路
要制作出好的皮肤首先要有好的创意。我们首先要确定创作的主题和风格,进而打好腹稿。腹稿也可能是比较模糊的,我们可以在草图中不断的明确最初的创意。接下来我们就用photoshop等图片处理软件来“画皮”。绘制皮肤时要特别注意:图片的尺寸要精确到像素,所以图片的尺寸也最好选像素而不要用毫米等长度单位;皮肤中的不同部件最好放在photoshop的不同图层中,这样便于后理的制作和修改;各部件的尺寸要尽量和最终要求的尺寸一至,你也可以做图做的大一些,不过最后还要缩小。
二、素材从哪里来?
制作QQ皮肤要使用到许多QQ图标,这些图标从哪里来呢?如果你还不太了解需要哪些图标的话,可以看看已有的QQ皮肤。有QQ安装目录下有skins文件夹,所有皮肤都在此文件夹下。打开以皮肤名称命名的文件夹,查看缩略图,看一下皮肤中都包含有哪些图标,做到心中有数。在QQ2004中默认的皮肤文件夹为newskins。腾讯并没有给我们提供现成的素材。当然你想自已绘制的话也是可以的,不过自已绘制的图标和QQ的标准图标会有一些不同,这样许多网友在使用你的皮肤时可能很难知道哪个图标对应哪个功能,从而降低你的皮肤的认同率。自行绘制图标最好接近QQ的标准图标。如果想使用QQ的标准的图标,我们也是有办法的,这里我们就要用到“抠”字决。QQ皮肤编辑器 V1.0中提供了标准模板,所以我们可以找到这些文件,并抠出图标来。抠图没什么好说,用photoshop慢慢抠吧。同一个标只抠出一个彩色的就可以了,其它颜色的在photoshop改一下颜色就好了。有了图标之后,皮肤的其它部分就需要我们自已绘制了。
三、不可不知的皮肤元件
第一次制作QQ皮肤的朋友可能不太了解什么是皮肤上的元件?简单的说,元件就是QQ皮肤编辑器 V1.0中可以操作的单元。皮肤就是由一个一个的元件组合而成的。我们绘制皮肤时,不能完全按照元件去绘制,但是,最终我们要把图片转为元件。皮肤分为三个部分:主窗口、聊天窗口和QQ菜单。
1、面板上的元件
下面以QQ2004Beta的默认皮肤为例,说明各元件。QQ面板的组成如图一

图一
各组成部分下分出一些元件。最大的一个元件就是主窗口,也就是QQ面板的底图,如图二

图二
“窗体”部分分为四个元件,分别为:最下面的背景图,最小化、最大化、颜色编辑三个按钮,如图三

图三
“面板”分为:“背景”和“好友面板”两个部分,背景如图四所示

图四
“好友面板”分为“目录图片”和“滚动条”两部分,如图五

图五
“工具栏”分为一个“背景和”上面的“发送手机短讯”、“QQ游戏”、“腾讯TT浏览器”、“进入聊天室”、“QQ主菜单”、“信息管理器”和“查找用户”七个按钮。“侧边条”没有底图,使用的是“主窗口”的底图,分为“QQ好友面板”、“互动空间”、“手机好友面板”、“企业QQ好友面板”、“内容资讯面板”、“身定义面板”、“音乐中心”和“网络硬盘”八个按钮。“状态”分为一个底图和一个按钮图标。“信息”没有底图使用的“主窗口”的底图,上面还显示QQ号、QQ邮件。
2、聊天窗口上的元件
聊天窗口由“边框”、“大工具栏”、“好友消息栏”、“小工具栏”、“按钮组”和“侧边条”这些元件组成。各元件如图六所示。

图六
“边框”由上、下、左、右边框,以及最小化、最大化、还原、关闭按钮组成。“大工具栏”由一张底图,以及“视频”、“传文件”、“短信”、“游戏”和“窗口”图标按钮组成。“小工具栏”由一张底图,以及“字体颜色和格式”、“选择表情”、“登录群社区”、“快捷回复”、“发送图片”、“捕捉屏幕”、“图片禁止”、“聊天场景”、“设置炫铃”和“QQ对讲机”按钮图标组成。“好友信息栏”只有一张底图。“按钮组”只需要一按钮的四种状态图即可。“侧边条”由子窗口标题按钮图片和菜单按钮图片组成。
3、QQ菜单
QQ菜单上只有一张背景图片如图七所示。

图七


