Animate实例教程（Animate2020）电子活页微课版 课件 第13、14 作品的测试、优化、输出和发布；综合设计实训

本章简介：在制作Animate动画时可以测试作品是否达到预期的效果，还可将作品进行优化，以保证最好的网络播放效果。制作完成Animate作品，可以对其进行输出或发布，制作成脱离AnimateCC环境的其他文件格式。本章将介绍对动画作品进行测试和优化的益处及技巧，还有输出和发布作品的方法和格式。读者通过学习要了解并掌握测试、优化、输出、发布作品、转换为HTML5Canvas的方法和技巧，以便制作出高质量的动画作品。第13章作品的测试、优化、输出和发布课堂学习目标了解影片的测试与优化掌握影片的输出与发布13.1影片的测试与优化影片测试窗口作品优化选择“控制>测试”命令，或按Ctrl+Enter组合键，进入影片测试窗口。“测试影片”窗口13.1.1影片测试窗口动画文件越大，在网络上播放浏览时等待播放的时间就越长。虽然在动画作品发布时会自动进行一些优化，但是在制作动画时还要从整体上对动画进行优化，以减少文件量。动画的优化包括以下几个方面。（1）将动画中所有相同的对象用同一个符号引用，这样，相同内容的对象在作品中只能保存一次。（2）在动画中尽量避免使用逐帧动画，多使用补间动画。因为补间动画中的过渡帧是计算所得，所以其文件量大大少于逐帧动画。13.1.2作品优化（3）如果使用导入的位图，最好将位图作为背景或静止元素，尽量避免使用位图动画元素。（4）对舞台中多个相对位置固定的对象建组。（5）尽量用矢量线条代替矢量色块。减少矢量图形的复杂程度，如减少图形的边数或曲线上折线的数量。（6）尽量不要将文字打散成轮廓，尽量少用嵌入字体。13.1.2作品优化（7）尽量少用渐变色，使用单色，因为渐变色比单色多占用50个字节的存储空间。少使用不透明度，因为会减慢回放速度。（8）尽量限制使用特殊线条的类型数，如虚线、点线等。实线比特殊线条占用的空间要小。使用“铅笔”工具绘制的线条比使用“画笔”工具绘制的线条占用的空间要小。（9）使用“属性”面板中“颜色”选项下拉列表中的各个命令设置实例，可以使同一元件的不同实例产生多种不同的效果。13.1.2作品优化（10）尽量避免在作品的开始出现停顿。在作品的开始阶段，要在文件量大的帧前面设计一些较小的帧序列，在播放这些帧的同时，预载后面文件量大的内容。（11）对于动画的音频素材，尽量使用MP3格式，因为其占用空间最小，压缩效果最好。（12）音频引用对象和位图引用对象包含的文件量大，因此，避免在同一关键帧中同时包含这两种引用对象，否则，可能会出现停顿帧。13.1.2作品优化13.2影片的输出与发布输出影片设置输出影片格式发布影片设置发布影片格式转换为HTML5Canvas针对HTML5的发布选择“文件>导出”命令，可以选择将文件导出为图像或影片。13.2.1输出影片设置AnimateCC可以输出多种格式的动画或图形文件，一般包含以下几种常用类型。13.2.2输出影片格式SWF影片(*.swf)JPEG序列(*.jpg)GIF序列(*.gif)PNG序列(*.png)选择“文件>发布”命令，在Animate文件所在的文件夹中生成与Animate文件同名的SWF文件和HTML文件。发布影片13.2.3发布影片设置AnimateCC能够发布多种格式的文件，下面介绍各种格式文件的参数设置。13.2.4发布影片格式Flash（.swf）文件格式SWCHTML包装器GIF图像JPEG图像PNG图像OAM包SVG图像SWF归档如果想要将Animate中制作的旧版动画转换为HTML5动画，可以通过一下几种方式进行转换。13.2.5转换为HTML5Canvas复制图层的方式使用菜单命令转换HTML5是构建Web内容的一种语言描述方式，是网页创建内容的最新标准。在AnimateCC2019中，选择HTML5Canvas文档类型，可以进入HTML5发布环境，输出发布即可。选择“文件>发布设置”命令，弹出“发布设置”对话框，在对话框中进行设置，单击“发布”按钮，即可发布文件。13.2.6针对HTML5的发布

本章简介：

本章的综合设计实训案例，是根据商业动漫设计项目真实情境来训练学生利用所学知识完成商业动漫设计项目。通过多个动漫设计项目案例的演练，使学生进一步掌握AnimateCC的强大操作功能和使用技巧，并应用所学技能制作出专业的动漫设计作品。第14章综合设计实训课堂学习目标掌握使用传统补间命令制作传统补间动画的方法。掌握图形、按钮、影片剪辑元件的创建及应用方法。掌握运用动作面板添加动作脚本的方法。14.1贺卡设计—制作元宵节贺卡项目背景及要求项目创意及制作1．客户名称尚佳科技有限公司2．客户需求尚佳科技有限公司在元宵节来临之际，为与合作伙伴以及公司员工联络感情和互致问候，现需制作电子贺卡；要求具有温馨的祝福语言和传统的节日特色，能够充分表达本公司的节日祝福与问候。14.1.1项目背景及要求3．设计要求（1）贺卡要求运用插画的形式进行设计。（2）使用具有元宵节特色的元素装饰画面，使人感受到浓厚的元宵节气息。（3）整体色调使用暖色调烘托节日氛围，使卡片更加具有元宵节特色。（4）设计规格均为2598px（宽）×1240px（高）。14.1.1项目背景及要求导入素材制作图形元件；使用传统补间命令制作传统补间动画；使用属性面板设置元件的不透明度及旋转；使用场景制作场景动画。效果图14.1.2项目创意及制作14.2电子相册—制作旅游相册项目背景及要求项目创意及制作1．客户名称麦芽摄影工作室2．客户需求麦芽摄影工作室是一家专业的摄影工作团队，工作室致力于运用独特的眼光捕捉属于顾客唯美的瞬间，同时提供精致唯美的相册。目前工作室需要制作一款新的旅游相册模板，以江南游记为主题，要求相册复古、唯美，即能够体现出江南水乡的特点又能够表现出工作室的品质。3．设计要求（1）相册以江南不同风景为主，画面要求精致唯美。（2）提炼江南特色景观，在模板中进行体现并点缀画面。 （3）整体设计要体现旅行所带来轻松愉悦的感觉。（4）设计规格均为800px（宽）×600px（高）。14.2.1项目背景及要求导入素材制作按钮元件和图形元件；使用创建传统补间命令制作补间动画；使用动作面板设置脚本语言；使用粘贴到当前位置命令复制按钮图形。效果图14.2.2项目创意及制作14.3广告设计—制作女包广告项目背景及要求项目创意及制作1．客户名称NEWLOOK2．客户需求NEWLOOK是一家生产经营各类皮件商品的公司，包括各式皮包、男女装、香水、丝巾等等。多年来一直坚持做自己的品牌精神，给顾客提供不同的产品。现因公司推出新款女士皮包，需要制作一个全新的网店首页海报，要求起到宣传公司新产品的作用，向客户传递出清新和活力感。14.3.1项目背景及要求3．设计要求（1）将自然元素与新产品巧妙结合，突出产品的优点。（2）画面包含新产品，但不能喧宾夺主。（3）色彩运用自然和谐，明亮清新。（4）设计具有简洁、时尚和雅致的艺术风格。（5）设计规格均为800px（宽）×250px（高）。14.3.1项目背景及要求使用导入命令导入素材并制作图形元件，使用创建传统补间命令制作补间动画效果，使用属性面板设置实例的不透明度及动画的旋转角度，使用变形面板改变实例的大小及角度，使用文本工具输入标题性文字。效果图14.3.2项目创意及制作14.4

海报设计——制作油泼面海报项目背景及要求项目创意及制作1．客户名称一碗面2．客户需求一碗面是一家连锁餐饮品牌，以一座城一碗面为主旨，致力于为身处外乡的人们带来家乡的味道。本季度店内重点推出陕西油泼面，需要制作一款宣传海报。设计要求画面主题明确，符合行业特色并能够体现出招牌菜品。14.4.1项目背景及要求3．设计要求（1）设计要求简洁大方，体现出当地特色，且点明主旨。（2）要求图文搭配合理，装饰元素符合主题需求。（3）色彩要求以红色为主色调，体现出本期主题特点，营造出热闹的氛围。（4）画面整体主次分明，视觉流程明确。（5）设计规格均为750px（宽）×1181px（高）。14.4.1项目背景及要求使用导入命令导入素材并制作图形元件；使用创建传统补间命令制作动画效果；使用时间轴面板控制动画的出场时间。效果图14.4.2项目创意及制作14.5节目片头—制作早安片头项目背景及要求项目创意及制作1．客户名称阳光幼儿园2．客户需求阳光幼儿园自成立以来，以温暖的关怀、优质的教育、专一的服务精神为行为准则，致力于为儿童提供一流的教学环境和先进的教学服务。现需要制作一部以早安主题的动画片片头，要求通过简洁夸张的动画造型，以及拟人化的风格，体现出清晨朝气蓬勃的特点，能够引起小朋友的注意并调动其积极乐观的心态。3．设计要求（1）动画设计要简洁夸张，运用拟人化手法，符合儿童视觉识别特点。（2）要保持声画同步，提升信息传达的能力。（3）将歌曲中的要素提炼概括，在模板中进行体现并点缀画面。（4）画面要求使用明艳的大色块，符合儿童的色彩感观。（5）设计规格均为800px（宽）×534px（高）。14.5.1项目背景及要求使用导入命令导入素材并制作图形元件，，使用创建传统补间命令制作补间动画效果，使用遮罩命令制作动画效果，使用属性面板设置实例的不透明度及动画的旋转角度，使用变形面板改变实例的角度。效果图14.5.2项目创意及制作14.6课堂练习1—设计音乐节目片头项目背景及要求项目创意及制作1．客户名称《你我来说唱》2．客户需求《你我来说唱》是一款青年说唱音乐节目，旨在传播年轻人的文化态度和主张,重视理念和交互,是一档年轻人群体作为收视主体的网络综艺节目。现要为其设计节目片头，要求以视听合一的形式概括与表现节目内容，直观的体现主题思想且形式创新。14.6.1项目背景及要求3．设计要求（1）设计要求使用卡通画的形式进行制作，使画面活泼生动。（2）将节目特点及要素提炼概括，在片头中进行体现并点缀画面。（3）色彩要求使用激情、奔放、斗志昂扬的红色调，符合节目特点。（4）图文搭配合理，主次分明，视觉流程明确。（5）设计规格均为800px（宽）×600px（高）。14.6.1项目背景及要求1．素材资源图片素材所在位置：云盘中的“Ch14/素材/设计音乐节目片头/01~12”。2．制作提示首先，新建文件并导入素材文件；其次，在库面板中制作图形元件；再次，返回场景中制作动画效果；最后，为动画添加动作脚本。3．知识提示使用导入到库命令和新建元件命令导入素材并制作图形元件；使用新建元件命令制作影片剪辑元件；使用时间轴面板，控制画面的出场时间。14.6.2项目创意及制作14.7课堂练习2—设计空调扇广告项目背景及要求项目创意及制作1．客户名称戴森尔2．客户需求戴森尔是一家综合网上购物平台,商品涵盖家电、手机、电脑、服装、百货、海外购等品类。现推出新型变频空调扇，要求进行广告设计，用于平台宣传及推广，设计要符合现代设计风格，给人沉稳干净的映像。3．设计要求（1）画面设计要求以产品图片为主体。（2）设计要求使用直观醒目的文字来诠释广告内容，表现活动特色。（3）画面色彩使用要给人清新干净的印象。（4）画面版式沉稳且富于变化。（5）设计规格均为1920px（宽）×800px（高）。14.7.1项目背景及要求1．素材资源图片素材所在位置：云盘中的“Ch14/素材/设计空调扇广告/01~03”。2．制作提示首先，新建文件并导入素材文件；其次，在库面板中制作图形元件；再次，制作影片剪辑动画；最后，制作场景动画。3．知识提示使用导入到库命令导入素材；使用新建元件命令和文本工具制作图形元件；使用分散到图层命令制作功能动画；使用创建传统补间命令，制作补间动画；使用属性面板调整实例的透明度。14.7.2项目创意及制作14.8课后习题1—设计手机广告项目背景及要求项目创意及制作1．客户名称米心手机专营店2．客户需求米心手机专营店是一家手机专卖场。该手机店最新推出了手机促销活动，需要制作针对网店的宣传广告，能够体现出新款产品的特点。广告要求内容丰富，重点宣传此次推出新款产品活动。14.8.1项目背景及要求3．设计要求（1）广告要求内容突出，能够充分展现此次新品宣传活动。（2）以产品实物为主体，与文字一起构成丰富的画面。（3）广告设计要求主次分明，对文字进行具有特色的设计，使消费者快速了解产品信息。（4）要求画面对比感强烈，能迅速吸引人们注意。（5）设计规格均为1899px（宽）×595px（高）。14.8.1项目背景及要求1．素材资源图片素材所在位置：云盘中的“Ch14/素材/设计手机广告/01~04”。2．制作提示首先，新建文件并导入素材文件；其次，在库面板中制作图形元件；再次，返回场景中制作手机动画