FLASH创意设计教程:试读-“都市恋爱”

教程|设计

  1.3 基础效果制作

  1.3.1帧动画

  1. 都市恋爱

  在充满诗意的黄昏,都市的大厦闪烁着灯光,逐渐的灯光隐灭,留下了“LOVE”恋爱的音符……这个创意来源于网络,看到过一个大学生宿舍灯光求爱的图片,所以想到了这个效果。
效果展示

  其中一帧画面如图1.3.1所示(完整效果参见光盘中的“\第一部分\第三章\都市恋爱.swf”)

点击这里下载源文件

  效果讲解

  在Flash中,朋友们可以通过改变连续排列的帧内容来实现动画。创建动画序列有两种方法。逐帧动画和渐变动画。在逐帧动画中,朋友们需要为每一帧创建图形,通过修改每一帧中的内容产生动画,它特别适合于复杂的、细腻的动画效果。因为Flash需要存储每一个完整的帧,所以逐帧动画将显著增加文件的大小。

  关键帧的作用是定义动画中的对象变化。在创建逐帧动画时,每一帧都是关键帧,包含内容的关键帧将以实心圆圈表示,添加在其后的帧将包含和关键帧相同的内容,每一层的首帧将自动设置为空白关键帧。每个新关键帧最初包含的内容和它前面的关键帧是一样的,因此可以渐进的修改动画中的帧。当朋友们创建动画的背景时,经常会碰到需要某一幅图像持续显示若干帧的现象,此时可以在层中添加新帧,注意不是添加关键帧,添加的新帧将包含前面关键帧的内容,添加的新帧将以淡灰色帧表示,最后一帧中有个白色小矩形,表示包含相同内容的帧结束。

  所谓“帧频”就是动画播放的速度,按每秒播放多少帧来计算,太慢的帧频将使动画出现停顿现象,太快又会发生跳帧现象,略过动画的细节。因此,设置合适的帧频是很有必要的。默认的是每秒12帧,标准的运动图片频率则是每秒24帧。因为一个Flash电影只能指定一个帧频,所以最好能在开始创建动画之前设置帧频。

  Macromedia Flash MX Professional 2004 提供了几种在文档中包含动画和特定效果的方法。利用时间轴特效(如模糊、扩展和爆炸)可以很容易将对象制作为动画。只需选择对象,然后选择一种特效并指定参数。利用时间轴特效,您只需执行几个简单步骤即可完成以前既费时又需要精通动画制作知识的任务。

  当您向对象添加时间轴特效时,Flash 将创建一个层并将对象传输至此新层。此新层自动获得与特效相同的名称,而且其后会附加一个数字,代表在文档内的所有特效中应用此特效的顺序。当您添加时间轴特效时,具有该特效名称的文件夹将添加到库,它包含在创建该特效中所使用的元素模糊特效原理是通过更改对象在一段时间内的 Alpha 值、位置或缩放比例来产生运动模糊效果。 

  制作过程

  运行Flash MX 2004,新建文件,选择“修改”|“文档”命令,将背景颜色调为#003366,帧频为2fps,其余默认。如图1.3.2所示。

  提示

  这些设置最好在动画制作刚开始的时候就设定好,否则完成以后再修改要费很大的力气。
  (2)设置完文档属性,在不单击舞台中任何元素的情况下,舞台下方的属性面板显示文档属性,如图1.3.3所示。

  注意
  以后的教程中不再给出文档属性面板。
  (3)选择“文件”|“保存”命令,由于是第一次保存,所以系统会弹出“另存为”对话框,我们可以选择保存的路径,修改文件名,还可以修改文件保存的类型,默认是保存为Flash MX 2004文档。如果需要,我们可以在下拉列表框中选择Flash MX文档,可见Flash MX 2004是向下兼容的。如图1.3.4所示。

  (4)用直线工具在舞台中绘制出楼房的边框,如图1.3.5所示。

  (5)用填充工具填充黑色,再用“文本”工具在右上角键入“都市恋爱”,默认是“静态文本”,选颜色为黄色,字号为30,如图1.3.6所示。

  (6)单击“都市恋爱”文本,选择“插入”|“时间轴特效”|“效果”|“模糊”命令,弹出“模糊”对话框,我们根据效果进行参数修改,如图1.3.7所示。

  (7)单击“确定”按钮,返回到主场景,在时间轴上Flash自动生成一个新图层“模糊 1”,此时一共有两层了。选择“插入”|“时间轴”|“图层”命令,插入图层3,修改图层名称为“灯光”,调节层的顺序,将“灯光”图层拖动到最上面,使“楼房”图层处于中间位置,“模糊”图层处在最下位置。

  提示

  Flash中的图层是上下遮挡的关系,在上面的图层内容遮挡下面的图层内容,所以要把“灯光”层放在最上面,使灯光在舞台中可视。

  (8)锁定“楼房”图层和“模糊”图层,在“灯光”图层中用矩形工具绘制一个小矩形,再按Ctrl键拖动复制,适当调节位置和大小,最终效果如图1.3.8所示。

  (9)选择第2帧,选择“插入”|“时间轴”|“关键帧”命令,在第2帧中随机加入一些小矩形,然后重复操作,单击第3帧,同样插入关键帧,再加入一些小矩形,以此类推。
如图1.3.9所示。

  提示

  选择“插入”|“时间轴”|“关键帧”命令,可以插入一个关键帧,也可以使用快捷键F6插入关键帧。

  (1)我们共做了12个关键帧,为了达到我们要的效果,此时单击第1帧,按键盘上的Shift键单击第12帧,这样我们就全部选中了12个关键帧,然后选择“修改”|“时间轴”|“翻转帧”命令,把这12个关键帧的排列顺序倒置。

  提示

  选择多个帧共有三种方法。在不单击第1帧的情况下,拖动鼠标从第1帧到第12帧;在图层名称处选择鼠标,也能单击所有帧;在第1帧到第12帧中任单击一帧,点右键菜单中的“选择所有帧”。

  (2)最后来完善一下作品,模糊层我们做了14帧,所以把灯光和楼房层延长到第14帧,单击这两个图层的第14帧,选择“插入”|“时间轴”|“帧”命令,延长帧,这样“LOVE”字符出现后有两帧的停留时间,不会马上消失。

  (3)选择“控制”|“测试影片”命令,进行效果测试,制作完成。

  逐帧动画像传统的动画片一样,一幅一幅去绘制,每一帧中都是一个不同内容图形,利用人眼的视觉残留形成运动的画面。逐帧动画是Flash动画作品不可缺少的技术之一。由于它能实现任意的效果,所以当用渐变动画无法实现时,就可以考虑用逐帧动画来代替,虽然这会很明显地增加文件体积,但是为了达到好的效果还是值得去尝试的。

  十一期间我们将陆续放出《FLASH创意设计教程》的部分章节,对于没有买到书的朋友是一个难得的学习机会。敬请关注

时间: 2024-10-04 12:35:34

FLASH创意设计教程:试读-“都市恋爱”的相关文章

FLASH创意设计教程:试读-临摹绘画技术

教程|设计 上一节:FLASH创意设计教程:试读-"都市恋爱" 2.2 临摹绘画 Flash动画主要有两个部分组成,其一为绘画,其二为电影等姊妹艺术的表现方法.初学朋友们在创作Flash动画过程中,往往无法准确.生动地把自己头脑中构思的角色形象在电脑中表现出来.如何提高创作者本身的美术技能技巧,是朋友们非常关心的问题.我们在论坛上也经常遇到朋友提出这样的问题"没有学习过美术,能制作出优秀的Flash动画吗?",答案非常明确"不能".因为,Flas

Flash入门教程:给任意照片添加雪景动画

本例是Flash入门教程:给任意照片添加雪景动画,学习视频文件的导入.嵌入,影片剪辑的创建操作.先看看效果演示: 准备工作:雪景图片.下雪的视频. 1.打开Flash,新建FLA文件. 2.导入图片:选菜单中的[文件]-[导入]-[导入到库]把图片导入到库中. 3.导入视频:选菜单中的[文件]-[导入]-[导入视频]打开导入视频面板,选文件路径:点击浏览,在打开面板中找到视频文件,点击打开.在导入视频面板中选中:在SWF中嵌入FLV并在时间轴中播放,点击下一步,嵌入视频,点击下一步,完成频频导入

【好书试读】速度与激情:以网站性能提升用户体验

开始试读:https://yqfile.alicdn.com/1d4578a32e3f5120cd35a1e53e2000b5.pdf 天猫购买链接:速度与激情:以网站性能提升用户体验 Web设计师在权衡外观设计与网站性能时总是要作出艰难的选择.良好的内容.布局.图片和交互对于吸引用户来说至关重要,这其中的每一个元素都会对页面加载时间和网站的感知性能造成巨大影响.本书会帮助你在项目过程中将页面速度放在首位,向你展示如何验证最关键的设计决策,从而提升页面加载速度,打造最佳用户体验. 如果你是Web

当当网所提供的公版图书及部分图书的试读章节均为正版

当当网近日就"数字图书馆未经出版社授权便免费向社会提供正版电子书"一事进行回应,称已经与出版商进行沟通,并已初步达成一致,不涉及侵权问题.另外所提供的公版图书及部分图书的试读章节均为正版. 之前接受媒体采访的中南博集天卷数字传媒事业部总监王雅兰和中信出版社数字出版经理初丛达,也表示就此事与当当网达成一致,双方合作在"稳步推进".王雅兰称,自己只对目前存在的网络侵权问题表明态度,无意针对任何渠道,与当当合作在稳步推进并不断磨合的过程. 据悉,当当网数字图书馆是为全国各

【好书试读】前端函数式攻城指南

开始试读:https://yqfile.alicdn.com/5b9a3f747101a427f4c501288f8cd20e.pdf 天猫购买链接:前端函数式攻城指南 函数式编程可以说是非常古老的编程方式,但是近年来函数式编程越来越受到人们的关注.不管是 Google 力推的 Go.学术派的 Scala 与 Haskell,还是 Lisp 的新 方言 Clojure,这些新的函数式编程语言都越来越受到人们的关注. 当然不仅是后端函数式编程语言层出不穷,前端也不甘示弱.虽然前端浏览器只支持一门语

【好书试读】支付宝体验设计精髓

开始试读: 第1章:https://yqfile.alicdn.com/df14aa365c3391303738401588a9b402.pdf 第2章:https://yqfile.alicdn.com/9b2264164e00fd0dde185788780d9eee.pdf 天猫购买链接:支付宝体验设计精髓 此书凝聚了支付宝从工具产品走向生活服务平台的设计实战精华,推荐阅读! --樊治铭 蚂蚁金服支付事业群总裁 在企业,设计为商业服务,因此设计和商业服务一样,对象也是用户.众所周知,用户体验

【好书试读】大数据思维——从掷骰子到纸牌屋

开始试读:https://yqfile.alicdn.com/7af5e5487689f2d32df37ac54ebb6335.pdf 天猫购买链接:大数据思维--从掷骰子到纸牌屋 本书立足于大数据之上的思维模式的普及,让你轻松理解大数据分析的基本模式与方法. 数据分析不在于你掌握了多少先进的软件工具,也不在于你拥有多么高智商的头脑,而是要靠更大视野.更宽角度和更具有逻辑性的思维.本书不是一本介绍大数据概念的流行读物,也不是开讲编程工具高深理论的专业教材,而是立足于大数据之上的思维模式的普及.读

【好书试读】架构即未来:现代企业可扩展的web架构、流程和组织

开始试读:https://yqfile.alicdn.com/3ff554317b7d8280a4ad75c3abad3ebb.pdf 天猫购买链接:架构即未来:现代企业可扩展的web架构.流程和组织 这是一本教你如何建设一个世界级工程组织的实战手册,包括领导.架构.运维和过程.就像一本驾驶手册教你怎么起步.如何上路一样,本书告诉你如何扩展业务.有了这本书,就可以少犯错误.换句话说,如果你有什么疑问,那就去读这本书吧! --郎·班德,Warby Parker技术副总裁 我在AKF公司一直负责解决

《Visual Basic.net 2005 数据库编程技术与实例》提供部分试读章节及代码下载

问题描述 为使NET程序员了解本书的编写风格和实用价值,现提供本书中的"第4章Windows功能部件设计"中的"4.1Excel透视表报表生成组件ExcelPivot设计"内容及源码给大家试读.详情请见: 解决方案 解决方案二:看看解决方案三:看过~解决方案四:楼主写的书?还是转的?解决方案五:看了,是楼主写的书.我好像买了一本.正在研究数据库配置那个部分解决方案六:不错,顺便说一下,楼主网页上的很多内容在我的22'液晶屏上模模糊糊看不清,特别是评论部分.解决方案七