QQ皮肤制作全程实录
图28 用相同的方法把“—”和“+”这两个符号出画出来,然后放在各自的水晶球按钮上,如图29。
图29 如此一来这三个按钮又都画好了。然后我们依次为这三个水晶球建立导出切片,并按其相应的按钮功能将切片取名为“最小化按钮”、“颜色编辑按钮”和“关闭按钮”,如图30。
图30 别忘了,这三个按钮在用于QQSkin的时候是可以有触发状态的,也就是说当鼠标指向这些按钮时,按钮的状态会有所变化,实际上也就是换了一种图像。因此我们把这三个按钮中的“—”、“+”和“X”符号同时选中后,将其描边色由白色改为#053585,作为这三个按钮在被激发时的状态,如图31。
图31 然后再为这三个按钮依次建立导出切片,以BMP格式保存在“蓝色畅想”文件夹中。为了便于辨认,我们把这三个按钮依次命名为“最小化按钮(触发状态)”、“颜色编辑按钮(触发状态)”和“关闭按钮(触发状态)”,如图32。
图32
用“矩形”工具在“拉幕式面板”图层里画一个124*367大小的矩形,圆角度为10,采用由#FDFEFF至#CEDEFF的线性填充,描边色为#344FB7。如图33。
图33 调整该矩形的位置,使其顶部距QQ主窗体顶部约有63像素,从而为以后信息栏按钮的绘制预留一定的位置。然后在该矩形上建立导出切片,取名为“面板背景”后记得保存为BMP格式。
图34 因为“蓝色畅想”这款QQSkin在色调上与“QQ2004” Skin的色调相似,所以我们依然可以在“腾讯QQ2004皮肤编辑器”中沿用“QQ2004”Skin的拉幕式模版。因此我们也就省去了在Fireworks里重新为“蓝色畅想”Skin绘制拉幕式按钮及垂直滚动条了。但在本例教程中,为了使大家能够较全面的看到“蓝色畅想”Skin的外形,才画蛇添足的画上拉幕式按钮及垂直滚动条,如图35。
图35 这样一来,“拉幕式面板”的绘制也就轻松完成了。
五、我们点击“工具栏”图层,开始在该层中绘制这7个按钮。先用“钢笔”工具在QQ主窗体的右下角位置上绘制出如图36般的路径。
图36 对该路径使用由# 2F54AB至# FFFFFF的线性渐变填充。然后将该路径再复制一份,并在“工具栏”图层中将这一复制品重命名为“主菜单按钮背景”,一会我们将会用到它。
图37 选中“主菜单按钮背景”对象,并把它拉到“工具栏”图层内的最上层来。用“部分选择”工具使该路径左边的节点向右移动1像素,而右边的节点侧向左平移1像素。然后还要把顶部的节点向下平移1像素。完成后对该路径使用由#FFFFFF至#FFFFFF的线性渐变,如图38。
图38 这了使这个主菜单按钮更具透明质感,我们用“钢笔”工具再画一个如图39般的对象。对其采用线性填充,由#FFFFFF至#FFFFFF,而透明度侧由100至0。
图39 完成主菜单的绘制后,我们把画布改成#113A80,然后将该按钮建立切片并以“QQ主菜单(触发状态)”为名导出。如图40。 上一篇:Firewoks 营造残破纹理 下一篇:制作一款打字效果的LOGO 更多相关文章
|
推荐文章
精彩文章
|