在新版QQ的聊天窗口中点击“选择表情”图标,你会看到表情列表里多了个“魔法表情”标签页。这是全新推出的QQ魔法表情,其不同于以往的QQ表情,QQ魔法表情更加生动、形象,它可以跳出聊天窗口显示,而且表情也更加的丰富。文章末尾提供源文件、效果及素材供大家下载参考。
现在我们来试着自己制作一个flash的QQ表情——“祈祷”。
为满足初学者的要求,我们采取详细图解的方式为大家仔细讲述每一步的绘制过程。
绘制步骤提纲
一.动画分析
首先要制定人物动画剧本,虽然这个QQ表情很短,但是为了避免做重复工作,所以首先要确定人物哪些元件可以重复使用,不需重新绘制的。
1.身体部分:手有变化,其它部分没变化。
2.脸部:嘴、眉毛、眼睛以及脸上的阴影及腮红有变化外,其它的部分没变化。
二.卡通人物绘制
(1)身体部分的绘制
①脖子及阴影的绘制 ②双腿的绘制 ③双脚及阴影的绘制 ④裙子的绘制 ⑤裙饰的绘制
(2)脸部绘制
①带阴影的脸部绘制 ②带渐变的脸部绘制 ③脸蛋的绘制 ④耳朵的绘制 ⑤头发的绘制 ⑥发夹的绘制 ⑦发辫的绘制 ⑧发辫夹子的绘制
(3)手、嘴、眉毛、眼睛的绘制
①垂下的双手绘制 ②并拢的双手绘制 ③嘴的绘制 ④绘制张开的嘴 ⑤眉毛的绘制 ⑥祈祷前睫毛的绘制 ⑦祈祷前眼睛的绘制 ⑧祈祷后睫毛的绘制 ⑨祈祷后眼睛的绘制
三、简单帧动画的制作
①祈祷前的动画制作 ②祈祷后的动画制作 ③为动画添加命令 ④动画发布
具体绘制过程
一、用Flash绘图工具绘制卡通人物
(1)身体部分的绘制,最后效果如下:
步骤:①脖子及阴影的绘制 ②双腿的绘制 ③双脚及阴影的绘制 ④裙子的绘制 ⑤裙饰的绘制
1.打开Flash软件,新建一个文档,按下Ctrl+J修改文档属性,设置宽高均为400像素,背景颜色为灰色(#CCCCCC),其它设置保持默认。
2.选择菜单里的“插入”→“新建元件”(快捷键为Ctrl+F8),插入一个名为“身体”的“图形”元件。
①脖子及阴影的绘制
1.单击“确定”按钮进入此元件中,双击“图层1”的图层名称,将其更名为“脖子”。
(提示:为各层、各元件起名是方便动画的制作与编辑,以免混淆。)
2.在“工具箱”中选择“钢笔工具” ,然后在下方“颜色”选项中设置“笔触颜色”为(#D67D7B),填充颜色为(#FFEBEF),在下方“属性面板”中设置“笔触高度”为1.5,绘制脖子的形状,并用“工具箱”中的“部分选取工具”进行节点调整,最终成形。
3.再新建“阴影”层,设置“笔触色”为无,“填充色”为(#8E8E8E),在脖子下方较远处利用“工具箱”中的“椭圆工具”绘制阴影。
②双腿的绘制
1.首先建立名为“右腿”的图层,利用“矩形工具”绘制一个框,再利用“部分选取工具”选择节点进行调整。
提示:笔触色与填充色与脖子的颜色一样。
2.框选右腿按Ctrl+C进行复制,新建一层为“左腿”,按下Ctrl+V将图像粘贴在合适的位置,在图像被选中的情况下,选择菜单中“修改”→“变形”→“水平翻转”命令,将原来右腿图像翻转过来并调整好位置即可。
③双脚及阴影的绘制
先来看一下完成的双脚和阴影:
1.新建三个图层,由下至上依次命名为“右脚”、“右脚阴影”、“右脚环”。
2.单击选中“右脚”图层,在“工具箱”中选择“钢笔工具”,设置“笔触色”为(#245CD0) ,“填充色”为(#86C2FF),利用“钢笔工具”及“部分选取工具”绘制调节出右脚的形状。
3.选中“右脚”的笔触线,按Ctrl+X剪切下来,选择“右脚环”图层,按Ctrl+Shift+V粘贴到当前位置。
提示:将脚的笔触线和填充色分开是为了方便绘制脚上的阴影。
4.选择“右脚阴影”图层,绘制并调节成阴影的形状,因为有“右脚”笔触线的遮挡,所以靠边的一侧就不用过于仔细。
5.最后利用复制粘贴以及菜单中“修改”→“变形”→“水平翻转”命令制作另一个脚及阴影即可。
④裙子的绘制
1.裙摆、裙身的“笔触颜色”为#A50855,裙摆的“填充颜色”为#FF80C1,裙身的“填充颜色”为#FFB3D9,比裙摆稍淡一些。其绘制方法就不在此多讲了,可参照源文件利用“钢笔工具”及“部分选取工具”进行绘制及调节。下图为裙摆、裙身及最后的合成图。
⑤裙饰的绘制
1.裙饰1是三角形的蝴蝶结了,先绘制一个正方形,利用“部分选取工具”移动正方形右下角节点到左边,最后填充颜色,一个蝴蝶结就制作完成了,再利用“复制”+“水平翻转”的方法制作另一个蝴蝶结。
2.裙饰2是在裙身上一只可爱的小兔子,小兔子是由椭圆、圆以及点和线组成。首先利用“椭圆工具”绘制一个填充色为白色的长形椭圆作为兔子的耳朵,复制另一个耳朵后,利用“任意变形工具”旋转形成另一只兔子耳朵。
3.最后再利用“椭圆工具”绘制兔子的脸、眼睛,利用“线条工具”及“部分选取工具”调节兔嘴,则小孩的身体部分制作完成。
完成身体部分的制作后,记得一定要按下Ctrl+S键进行保存!
(2)头部绘制
最后的效果如下:
步骤:①带阴影的脸部绘制 ②带渐变的脸部绘制 ③脸蛋的绘制 ④耳朵的绘制 ⑤头发的绘制 ⑥发夹的绘制 ⑦发辫的绘制 ⑧发辫夹子的绘制
1.选择菜单里的“插入”>“新建元件”(快捷键为Ctrl+F8),插入一个名为“头部”的“图形”元件。
2.元件创建完后,会自动进入“头部”元件中,双击“图层1”的图层名称,将其更名为“脸”。
(提示:为各层、各元件起名是方便动画的制作与编辑,以免混淆。)
3.在“工具箱”中选择“椭圆工具”,然后在设置下方“颜色”选项中设置“笔触颜色”为(#D67D7B),填充颜色为(#FFEBEF),在下方“属性面板”中设置“笔触高度”为2。
4.利用“椭圆工具”在工作区绘制二个圆相交,大圆是脑袋的上半部,小椭圆则是突出MM的脸蛋。
5.选择 “工具箱”中的“选择工具”,点选两圆相交的红线,将其删去。
6.选择“工具箱”中的“部分选取工具”,选中脸蛋那部分的线条,稍做一些修改,框选整个脸,按下Ctrl+G群组,然后锁定这一层,。
(提示:选中一个节点,拖动二个手柄即可调整曲线的弯度。若调整一边,则按下Alt键并拖动相应的节点。)
①带阴影的脸部绘制
1.新建一个名为“脸部阴影”的图层。利用“钢笔工具”及“部分选取工具”绘制调整结节成为阴影,其“笔触色”为无,“填充色”为(#FFCCCB)。
②带渐变的脸部绘制
提示:单击“脸部阴影”图层上的眼睛按钮即可隐藏,利用Ctrl+C(复制)和Ctrl+V(粘贴)及Ctrl+Shift+V(原位置粘贴)可加快编辑速度。
1.隐藏“脸部阴影”层,然后选中并复制“脸”图层的内容。
2.新建“脸2”图层,按Ctrl+Shift+V原地粘贴图像并选中它,按下Shift+F9(也可利用菜单中的“窗口”→“混色器”命令)调出“混色器”面板,设置“填充样式”为“线型”,设置二个渐变色值为#FFCCCB与#FFEBEC,调整色块的位置。
3.用“工具箱”中的“颜料桶工具”进行填充,然后再用“填充变形工具”调节渐变方向与位置。
③脸蛋的绘制
1.新建一个名为“脸蛋”的层。利用椭圆工具,绘制一个“无笔触”(即外框),颜色值为(#FFDFF7)的圆。
2.复制二个这样的圆并调节大小,设置其中一个颜色值为(#FFC7DE),另一个为白色(作脸蛋的高光)。
3.利用“复制”+“水平翻转”的方法制作另一边的脸蛋。
(小知识:复制的方法有二种,一种是利用Ctrl+C(复制)、Ctrl+V(粘贴)。另一种就是利用“选择工具”选中对象后拖动时按Alt键。)
④耳朵的绘制
1.新建一个名为“耳朵”的图层,利用“椭圆工具”绘制一个“笔触颜色”值为(#D67D7B),“填充颜色”值为(#FFEBEF)的圆作为耳朵,为了表现出耳朵的层次感,再来一个“无笔触”色,“填充颜色”值为(#FFCFCE)的内耳。
2.利用复制的方法画出另外一个耳朵,调整耳朵的合适位置,最后可利用“箭头工具”拉长靠向脸部的耳朵轮廓。
(注意:“耳朵”层,要在“脸”图层下。)
⑤头发的绘制
1.将其它层锁定,新建二层,分别命名为“左发”、“右发”,选择“椭圆工具”,设置“笔触色”为(#6F2420),“填充色”为(#C0854D),利用“三圆相减”绘制出左边头发,进行调整后再利用“钢笔工具”绘制出右边的头发,调整为合适的形状后按下Ctrl+G将其组合。
2.再新建二层,命名为“左发1”、“右发1”,利用“钢笔”工具绘制出右边头发上的深色部分,其“笔触色”同上,“填充色为”(#A55000),利用同样的方法制作“左发1”,最后用“部分选取工具”进行调整即可。
⑥发夹的绘制
1.利用“椭圆工具” 绘制一个长椭圆,设置“笔触色”与“填充色”分别为(#A51408,#FF00CE)。利用“线条工具” 连接长椭圆左右二边,然后换成“选择工具”选中下部半圆按Delete键删除。
2.删除后利用“工具箱”中的“任意变形工具”进行半圆的上下拉升,形成一个长半圆,这就是夹子的上半部分。
3.再利用上述方法制作另一发夹部分,放在刚才制作好的发夹中间,进行删除,形成有个椭圆空洞的发夹。
4.先在“工具箱”中选择“椭圆工具” ,设置“笔触色”与“填充色”分别为(#A51408,#FFCF00),绘制一个圆,再将这个圆分成二半,利用“矩形工具”绘制个矩形,利用“任意变形工具”将其变形与半圆相符,按下Ctrl+G进行组合,合成一个漂亮的发夹。
5.再利用“椭圆工具”和“矩形工具”绘制小圆点和菱形,作为夹子上的装饰,绘制出来后组合,再缩小放置在夹子表面合适的地方。
6.最后将夹子放在头发合适的位置即可。
⑦发辫的绘制
1.新建“右辫”图层,选择“钢笔工具”,设置“笔触颜色”为(#916360),“填充颜色”为(#C0854B),绘制右边第1个发辫,设置“笔触颜色”为(#6F2420),“填充颜色”为(#A55000)绘制第2个发辫。
2.新建“左辫”图层,可以复制“右辫”中的那2只小辫子,并利用菜单中的“修改”>“变形”>“水平翻转”进行调整。将两只辫子放在合适的位置上即完成了发辫的绘制。
⑧发辫夹子的绘制
1.新建一层,命名为“发夹”,选择“工具箱”中的“文本工具”,利用输入法中的“特殊字符”输入“★”符号,调整好合适大小后,按下Ctrl+B将其打散,填充“笔触色”为黄色,“填充色”为白色,最后将调整好的星星群组(Ctrl+G)。
特殊字符的输入
2.利用“工具箱”中的“矩形工具”绘制二个矩形,其“笔触色”与“填充色”分别为:(#C60063)(#FF0084),(#3171EF)(#319AFF)。将星星与矩形合理的放在一起,形成漂亮的发辫夹子。
3.框选一组发辫夹子(红色),按下Ctrl+G将其组合,再单击“工具箱”中的“任意变形工具” ,将鼠标放在对象“发辫夹子“的四角,当出现旋转图标时进行旋转。对另一组发辫夹子(蓝色)进行相同的操作。
4.利用“选择工具+Alt键”移动法复制发辫夹子,将这二组发辫夹子分别放在合适位置。
(3)手、嘴、眉毛、眼睛的绘制
步骤:①垂下的双手绘制 ②并拢的双手绘制 ③嘴的绘制 ④绘制张开的嘴 ⑤眉毛的绘制 ⑥祈祷前睫毛的绘制 ⑦祈祷前眼睛的绘制 ⑧祈祷后睫毛的绘制 ⑨祈祷后眼睛的绘制
为了保证绘制出的图像大小比例不失调,可以在“头部”元件中新建图层绘制,绘制完再转化为元件。
①垂下的双手绘制
1.在“头部”元件中新建名为“手垂下”的图层,利用“钢笔工具”绘制左边的手,设置“笔触色”为(#D47C78),“填充色”为(#FFEBEC),并利用“复制”+“水平翻转”制作另一只手。
2.绘制完后右键单击选中的双手,在菜单中选择“转换为元件…”,将其转化为“手垂下”图形元件。
②并拢的双手绘制
1.新建名为“并拢的双手”图层,利用“椭圆工具”绘制一个圆,按Ctrl+G将其组合,然后利用“复制”及缩放大小,最后调整成为双手。
2.绘制完后右键单击选中的双手,在菜单中选择“转换为元件…”,将其转化为“并拢的双手”图形元件。
③嘴的绘制
1.新建一个名为“嘴”的图层,在下方“属性面板”中设置其“笔触颜色”为(#D27D78),“笔触高度”为2,绘制一条横线作为嘴。
2.将其转化为“嘴”图形元件。
④绘制张开的嘴
隐藏刚才绘制的“嘴”图层,新建一层名为“张开的嘴”,利用椭圆工具绘制张开的嘴,“笔触颜色”与“填充色”分别为(#D27D78)和(#FFE7E7),最后将其转化为“张开的嘴”图形元件。
⑤眉毛的绘制
眉毛利用“直线工具”、“箭头工具”以及复制和水平翻转即可完成,最后组合转化为“眉毛”图形元件。
⑥祈祷前睫毛的绘制
在动画中要用动到祈祷前和祈祷后二种眼神和睫毛,这里先看祈祷前的:
1.新建一层名为“眼线”,利用“钢笔工具”绘制四个节点,其笔触色为无,填充色为黑色,利用“箭头工具”和“部分选取工具”进行调整,然后利用“复制”+“水平翻转”制作另一边的眼线。
提示:新建一层名为“眼线2”,将做好的一对眼线原地复制并“锁定”隐藏备用。
2.在“眼线”层上新建一层名为“睫毛”,利用“钢笔工具”绘制,并用“选取部分工具”进行调节。“笔触色”为无,“填充色”为黑色。
4.然后利用“复制”+“水平翻转”法制作另一边的睫毛,最后将“眼线”层和“睫毛1”层内容组合转化成名为“睫毛”的图形元件。
⑦祈祷前眼睛的绘制
1.锁定其它层后,新建一图层并命名为“眼睛”,选择“椭圆工具”后,在“属性面板”中设置“笔触颜色”为黑色,“笔触高度”为2。
2.“填充色”则在“颜色面板”混色器中进行设置,设置其“填充类型”为“线性”,左色块颜色为(#7B1A1F),右色块颜色为(#B18989),绘制出眼框,再利用“填充变形工具”调节渐变方向和半径,复制出另一个眼框并放在合适的位置。
提示:为了防止图形重合,可以先分层制作,然后将图形组合后再放在一层上。
2.新建一层命名为“眼仁”,利用“椭圆工具”和“任意变形工具”进行绘制调整眼珠和高光,并复制出另一只放在合适的位置。
3.分别组合后,转化为“眼睛1”图形元件。
4.进入“眼睛1”元件后,按下Ctrl+A全选并复制,新建一个名为“眼睛2”的图形元件,按Ctrl+Shift+V原地粘贴,将眼睛中最大的白色高光向上在方移动。
⑧祈祷后睫毛的绘制
1.显示解锁在第⑥步中复制的“眼线2”,在这层上新建一层为“睫毛2”,利用“直线工具”绘制,“笔触高度”为2,“笔触颜色”为黑色,最后用“箭头工具”进行调整。
3.利用“复制”+“水平翻转”法制作另一边睫毛,将“眼线2”和“睫毛2”上的内容组合,选中后转化为“睫毛2”的图形元件。
⑨祈祷后眼睛的绘制
1.新建一图层并命名为“眼睛2”,利用第⑦步中眼睛的绘制方法绘制出眼睛,不同的是眼球和高光的位置不同。
2.下面就是眼黑和眼白高光的制作了,利用“椭圆工具”和“任意变形工具”进行绘制调整,再利用复制的方法制作。
3.利用“复制”法制作另一边的眼睛,组合后转化为“眼睛2”图形元件。
二、简单帧动画的制作
在制作前还要准备一个动画的声音文件,声音文件在源文件压缩包中有,名称为1.mp3。
祈祷动画分为“祈祷前”和“祈祷后”二部分,在这个动画中大部分是利用“逐帧动画“制作的。“祈祷前”是1-9帧,“祈祷后”是10-45帧,在前面的部分我们已经制作完成了各个元件,现在动手进入动画的后期制作。
①祈祷前的动画制作
1.首先按下Ctrl+F8创建一个名为“祈祷”的影片剪辑,我们把动画制作在这个影片剪辑中。
2.单击“时间轴”上的“插入图层”按钮插入4个图层,并分别改名为“声音”、“嘴”、“祈祷前眼睛”、“祈祷前眉毛”、“祈祷前身体”。
3.选择菜单中“文件”→“导入”→“导入到库”,在文件夹中选中1.mp3进行导入。
4.在“声音”层第9帧按下F6插入“关键帧”,然后在下方“属性栏”的“声音”下拉菜单中选择1.mp3,其这果默认。
5.在第9帧上按F5,直到音乐波频显示完为止。(其实这步可以省略,即使显示不完,音乐也会在动画中播放完整的)
6.选择“祈祷前身体”图层,将“库”中的“头部”拖进来,放在合适的位置。
7.利用“眼睛1”、“眼睛2”元件在“祈祷前眼睛“层相互交替制作成逐帧的“祈祷前眼睛动画”,利用“眉毛”元件上下移动在“祈祷前眉毛”层制作逐帧的动画,最后再把“嘴”元件放在“嘴”层,祈祷前的动画就制作完毕了。
②祈祷后的动画制作
1.再插入三个图层,分别命名为“祈祷后眉毛”、“祈祷后头部”、“祈祷后身体”,在“祈祷后身体”层的第10帧按下F6插入关键帧,将“身体”元件拖进来,
2.在“时间轴”上单击“编辑多个帧”,将“开始绘图纸外观”起始括号拖到第1帧,这样就可以看到“祈祷前”身体的位置,移动现在这个“身体”元件与原身体位置重合,最后在第45帧按下F5。
3.在“祈祷后头部”层第10帧将“头部2”元件拖进来,同样在第45帧按下F5,利用“编辑多帧”效果对齐头部。
4.在“祈祷后眉毛”层第10帧将“眉毛”元件拖进来,在第1利用上下移动眉毛逐帧法制作上下挑眉毛的动作。
③为动画添加命令
再插入一个图层,命名为“命令”,在第45帧按下F6插入关键帧,打开“动作面板”,输入:
stop();
fscommand("quit");
提示:quit命令是用来关闭播放器的.swf和.exe文件,该命令没有参数,直接写为: fscommand ("quit");。
④动画发布
最后回到主场景中,将这个名为“祈祷”的影片元件拖到合适的位置,保存FLASH文件后按下“Ctrl+回车”进行测试,会在FLASH源文件根目录看到测试动画,最后直接双击生成的.swf文件测试其动画播放完毕后自动关闭的效果了,大家快试试吧!最后希望朋友们多多支持天极网设计在线,来这里看梦梦发表的文章!