摘要:QQ聊天时,越来越多的朋友喜欢使用表情符号代替语言描述。由于技术的限制大部分的网友都只有去下载别人制作好的QQ表情图片。这期QQ表情制作专题,期望能教网友们一些表情图片设计的基本技术,自己创造出更加丰富具有个性化的表情符号。
QQ聊天时,越来越多的朋友喜欢使用表情符号代替语言描述,使聊天生活形象生动。由于技术的限制大部分的网友都只有去下载别人制作好的QQ表情图片,使有许多有创意的网友无法秀出自己的才艺。这期QQ表情制作专题,期望能教网友们一些表情图片设计的基本技术,让大家掌握基本的设计方法,自己创造出更加丰富具有个性化的表情符号。
十分钟制作文字表情
当QQ聊天时,输入文字后发送给对方的却是图片形式的彩色文字表情,这样的效果在QQ才推出表情符号初期非常受欢迎。现在为什么大家很少使用选择文字表情符号了呢?是不是因为看惯了那几个老样子缺乏新意,所以弃之。如果有了新的文字样式,大家会不会再次使用呢?如果是自己DIY的文字表情,是不是肯定会使用呢?其实文字表情符号制作非常简单,静态的、动态的也就那么几步,只需十分钟就能轻松搞定。
1.前三分钟:准备素材
下面我们以“电脑商情报”为例制作QQ文字表情符号。制作之前,需要下载一些漂亮的字体安装到系统中。把下载的字体文件(TTF文件)拷贝到“C:WINDOWSFonts”目录下完成字体的安装。
推荐字体下载网址:
K666字体下载:http://font.85888.com/
Sj000设计无限:http://www.sj00.com/sort /2_1.htm
推荐字体:
中文:华康布丁体、华康海报体W12等
英文:Library of Minerva、Celtasmigoria等
2.两分钟搞定静态文字表情
打开图像编辑工具(本文使用的图像工具是Fireworks),新建一个空白文件,大小为50*50像素左右为好,背景色为白色。选择“文字”工具在编辑界面上输入设计的文字内容,如“电”,然后设定文字的字体(如“华康海报体”)、文字大小(如40像素)、文字颜色(如红色)等样式,再使用“缩放”工具稍稍旋转一下文字的角度,在“属性”面板的“滤镜”选项中点击“+”按钮打开滤镜菜单,选择“投影与光晕”下的“投影”命令,设计好投影的颜色、距离、柔化和角度,给文字添加点投影效果,使文字感觉比较活跃(图1)。最后,把输出为GIF或JPG格式的图片保存即可。
图1
按照上述的方法,再设计其它文字的表情图片,如“脑”、“商”、“情”、“报”,除了字体可以保持不变之外,每个文字的颜色、旋转角度、投影等效果都可以分别的设计一下。
3.四分钟搞定动态文字表情
在静态文字的基础上加以动画设计,就能轻松的制作出动态文字表情。动态文字的效果可以是文字动,也可以是在文字添加其它的图像动画。
文字动画
打开Fireworks的“帧”面板,选择面板下放的“添加帧”按钮创建新帧,然后把第一帧的文字,如“电”拷贝到新建的第2帧上。在“修改”菜单下选择“变形”中的“数字变形”命令,在弹出的“数字变形”窗口中选择“缩放”,设定缩放比例为“120%”。确定后返回,此时编辑区中的文字大小将变大到原文字的120%。在“帧”面板上双击每一帧后面的播放时间打开设置小窗口,重新定义帧的播放时间,如20(图2),再设定第2帧的播放时间为20。
图2
现在点击Firework编辑区下放的“播放”控制按钮,演示一下文字的动画效果,可看到“电”字一大一小等节奏的变化。在“文件”菜单下选择“导出向导”,根据向导提示选择输出“GIF动画”(图3),将图片输出成GIF动画格式。同理,设计其它文字表情的GIF动画图片。
图3
图像动画的文字表情
文字动画除了文字本身动作外,还可以设计成文字不动,在文字周围添加动画图像的效果,例如我们再新建一个50*50像素的空白文件,白色背景。选择Fireworks“工具箱”中的“星形”绘图工具,在编辑区中绘制按照正方形绘制4个五角星,五角星的位置分别在正方形的上、左、下、右四个位置上,再为每个五角星填充不同的颜色。
在“帧”面板上创建四个新帧,每一帧分别依照某个方向调换各个五角星的填充颜色(图4),例如第1帧,红色五角星的右边是蓝色五角星,那么第2帧,红色五角星调换到第1帧蓝色五角星的位置,而蓝色五角星调换到下一个五角星的位置上,这样四帧设计下来四个不同颜色五角星的位置刚好调换一圈。调节一下每一帧的播放时间,选择“播放”控制按钮看看这四个五角星的动画,是不是在绕圈呢!
图4
把这个动画输出成为GIF动画文件保存好,不关闭图像动画文件,在“图层”面板上把原来静态的文字图片,如“电”字导入到新图层上(每一帧都添加新的图层粘贴上文字),这样再播放动画看看是不是星星围绕着文字旋转呢(图5)?最后使用“导出向导”命令把文字导出为GIF动画保存起来。接着再用这个方法在四个星星中间添加其它的文字制作不同的文字动画。
图5
现在我们把制作好的文字表情图添加到QQ表情库中。在QQ聊天窗口中选择表情符号面板中的“添加表情”命令打开“表情管理”窗口,选择窗口上方的“添加分组”按钮可以创建一个新的表情分组,为分组取名为“文字表情”。点击表情管理窗口右边的“添加”按钮,可以开始添加自己制作的文字表情符号,如导入“电”GIF动画文字图片,然后设定文字的键盘输入方式为“电”字(指定为“电”字以后输入拼音“电”就能自动出现该文字表情图),再为表情符号取一个名称(图6),确定后完成添加。
图6
把制作的“电脑商情报”文字表情全部添加完毕,在QQ聊天窗口的表情面板上启用“使用自定义快捷键”命令,在聊天选框中用拼音或五笔输入“电脑商情报”汉字,即可看到自己制作的文字表情符号了(图7)。
图7
卡通表情快速制作
QQ表情符号使用率最高的图片类型要算是卡通画了,例如QQ经典的高兴、发呆、调皮、尴尬等面部表情符号都是属于卡通画。对于普通网友来说,卡通表情的制作是不是比较复杂呢?其实不然,它和文字表情的制作差不多,可以做成静态、表情动态、动画图形的形式,大家只要掌握Fireworks的基本绘画技能就能绘制出有特色的表情符号。
1.四分钟绘制静态脸部表情
在Fireworks中新建一个100*100像素的文件,背景为白色,选择工具箱中的“椭圆”工具,按住键盘Shift键在编辑区中画一个正圆出来。选择填充工具,再在属性面板中设定填充方式为“线性”,然后为图形填充渐变的颜色。例如用深紫色和浅紫色,将圆形填充成有立体感的球形(图8)。
图8
绘图时要制作有立体感的球形,可以选择“渐变”填充颜色,再选择一深一浅的两种色彩,用斜线方式填充就能达到立体感效果。
接下来再使用“椭圆”工具,画两个同等大小竖立的白色树状椭圆形,边缘填充深紫色,然后再画两个黑色的小椭圆形分别放到白色椭圆形的下方,做成面部表情的眼睛效果。选择钢笔工具在眼睛下方划一条左右均等的黑色弧线,表示脸部表情的嘴部,这样可以制作成一个静态的微笑表情符号(图9)。
图9
2.三分钟让面部表情动起来
想让脸部表情动起来只需要在静态表情图片上,为它设计简单的面部动作就可以了。例如,在上面这个表情基础上,再增加三帧,从第2帧开始调动每一帧的黑眼球位置,把它做成眼睛不停旋转的效果(图10)。最后用“导出向导”命令把它输出为GIF动画图片。我们也可以使用动态图像文字表情的制作方法,在面部卡通表情图像周围添加一些动态的图像,使其成为卡通动画图。
图10
3.三分钟在线制作动态卡通表情
如果要设计其它的卡通动态表情图,使用在线制作工具来制作也非常简单。例如:Eoool网站(http://www.eoool.com/),就是专业的图像在线制作网站。打开Eoool的首页,在“头像、签名、题图、广告”选项中可以挑选要制作的图像类型,如我们选择“96*96像素”的图像规格,点击“制作图标”按钮开始制作。在“选择图片”步骤,我们可以自己上传图片,也可以选择网站提供的各种卡通图片,例如选择网站提供的一张卡通妹妹的图片,挑选好以后进入下一步“裁剪图片”。裁剪图片时,网站会提供一个96*96像素大小的裁剪框,用鼠标移动这个选框让它选定要裁剪的图像区域(选框选中部分就是获取的最终图像),建议选择卡通人物的面部区域确定裁减。
接下来可以在图片上输入文字,如“QQ美女”,设定文字的颜色和边框颜色,点击“添加文字”按钮然后来到“绚彩效果”步骤。此时可以选择“相框”特效为图片添加一个漂亮的边框,再选择“动效”效果在图片上增加动态的绚彩特效(图11)。
图11
点击“加入绚彩”按钮后立即生成最终的动画图片作品,选择“保存图片”选项就可以把在线制作的GIF动态图片保存到自己的计算机上了。试看这个动态图片效果是不是很不错呢,花三分钟的时间就搞定了!按照在QQ表情管理器中添加文字表情的操作,把自己设计的卡通面部表情、动态卡通表情加载到QQ表情库中,定义好表情的快捷键就可以使用了(图12)。
图12
十分钟搞定图片表情
QQ表情符号使用率最高的还有一类,就是动画图片。例如很多网友把周星驰大话西游的剧照图片,添加上几个文字做成搞笑的QQ表情图片,令大家赞不绝口。制作这类表情技术难度不高,就是要考考大家的创意能力了。
1.前三分钟准备图片素材
根据自己设计的图片表情创意,再到网络上去收集一些静态或是动态的图片。例如制作一张爱的表情图,就去下载一张充满浪漫色彩的玫瑰花的图片。
素材图片推荐下载地址
素材中国:http://www.sc-cn.net
素材精品屋:http://www.sucaiw.com/
2.七分钟搞定动态图片表情
Firewokrs制作动态图片
用Fireworks打开玫瑰花图片,然后使用“剪裁”和“缩放”工具选择图片上比较漂亮的画面裁剪,缩小尺寸,让它适合QQ聊天窗口的尺寸,不会因为图片尺寸太大影响表情的传输速度。选择“滤镜”菜单下的“Alien Skin Splat!Edges”命令打开滤镜编辑窗口,使用该滤镜为图片设计一个雅致的边框(图13)。
图13
确定使用边框滤镜后返回Fireworks的编辑界面,使用“文字”工具在图片上添加一些爱的文字,如“I LOVE YOU”,设计好文字的字体(如:Celtasmigoria英文字体)、填充颜色和特效。在“图层”面板上新建一个图层,选择工具箱中的各种绘图工具在玫瑰地图上画一些小的装饰图形,如圆形、星型之类的,用白色填充即可。在“帧”面板上新建一帧,把这一帧图片上的装饰小图形透明度降低到50%左右(透明度在“图层”面板中修改),调节一下两帧的播放时间(图14),此时预览动画可看到白色的小装饰图在画面中一闪一闪的动作了。最后把图片导出为GIF动画文件保存。
图14
动态图片合成
上面介绍的方法是在静态图片的基础上设计动态的表情图片,我们也可以使用原本就是GIF动画格式的动态图片利用Fireworks工具合成一张新的动画,制作方法也很简单。首先在精灵豆豆E趣屋(http://fairydoudou824.vip.sina.com/sucai/sucai00.html)可以下载GIF像素动画或者素材中国的“GIF动画”栏目去下载GIF动画。
例如我们挑选一张生日蛋糕的GIF动画图片和一张像素女孩的GIF动画。选择两张都是GIF动画图片合成的制作方式,需要注意的是两个动画的帧数不同,自己要调节一下,把两个动画的帧补齐为相同的帧数,再写上如“生日快乐”的字样(文字也需要添加到每一帧),做成一个小女孩庆祝生日的动画(图15)。把动画输出为GIF动画格式的文件保存。
图15
搞笑表情图片制作
使用搞笑的表情图片可以让大家聊天时敞开大笑,下面我们选择一张周星驰的剧照把它做成搞笑图片。把周星驰的图片用Fireworks裁剪成合适的尺寸,然后在图片上撰写一些文字,如“上了QQ不回信息,什么世道?”之类的。接下来使用Fireworks的“圆形”工具在周星驰的脸上画两滴眼泪。首先用“椭圆”工具画一个树状的椭圆形出来,再选择工具箱中的白色箭头“部分选定”工具,用该箭头工具指向椭圆形上方的节点,把节点往上提,两边的节点往外移一点,就绘出了水滴的形状(图16)。把图片输出为静态的GIF或JPG格式的图片保存即可。
图16
如果要让周星驰的眼泪动起来,可以按照上述设计GIF动画的方式创建新的帧,把新帧上稍微修改一下眼泪的形状就能使它动起来了哦!最后,我们把这些表情图片添加到QQ的表情管理器中,随时把它们发给QQ好友使用了(图17)!
图17
如果感觉自己设计的QQ表情图片不错,不妨把它们全部合成制作为一个表情包文件,上传到QQ网站,参加QQ表情制作比赛,让更多的网友使用你精心设计的QQ表情图。
打开QQ的表情管理器工具,选择“添加分组”按钮创建一个“分享QQ表情”的新类别。从现有的表情图中选择需要分享的图片,按住键盘Ctrl键可以执行多选操作,再选择“移动到”按钮把这些表情图片移动到新的分组中。选定新的分组,点击“导出”的下拉菜单,选择“导出本组自定义表情”命令(图18)。在导出窗口中选择保存的文件类型为“表情安装包(*.eip)”保存即可。
图18
打开QQ自定义表情网页(http://im.qq.com/cgi-bin/face/face),选择页面中的“上传表情”按钮(图19),根据提示输入表情的分类、输入表情的标题和描述文字、填好作者的个人资料等,再选择上传的表情图片或是表情安装包文件,进行上传。
图19
看完了以上的各种QQ表情制作是否有一种自己动手的冲动呢?是否手中有一些值得恶搞的素材呢?不要犹豫了按着上面的步骤DIY自己的个性QQ表情吧。10分钟!QQ表情你也能做。