Adobe Edge下载安装 创建动画 详细使用教程(图)

  次阅读 作者:智能小宝 来源:互联网 2016-01-19 11:20 我要评论(0)

自Adobe Edge的第一个预览版于8月1日发布以来,此应用程序已被下载了超过150,000个副本。从这一事实看来,Edge不再是一个beta版本,它从那时 起已经历了3个主要版本。它赢得了如此多的关注,我们完全可以想象,Edge一定会成为Web设计人员工具箱中不可缺少的一部分。

自Adobe Edge的第一个预览版于8月1日发布以来,此应用程序已被下载了超过150,000个副本。从这一事实看来,Edge不再是一个beta版本,它从那时 起已经历了3个主要版本。它赢得了如此多的关注,我们完全可以想象,Edge一定会成为Web设计人员工具箱中不可缺少的一部分。

出于某种原因,本教程主要介绍预览版3。预览版1专注于用户界面、图形和动作。预览版2是对预览版1的反馈的直接结果,进行了诸多实用性增强和错误 修复。 预览版3是在Edge发展过程中引入交互式的版本,这使本文成为了介绍教程,演示如何应用和使用应用程序的各种动画和交互式功能的不错地方。事实上,本教 程的目的在于让您在非常短的时间内快速上手使用Edge。开始之前:

下载并安装Edge(免费,仅英文版)。

下载并解压范 例文件。

入门

下载并打开范例文件后,您将看到一个Exercise文件夹,其中包含ramen_rahko_begin.edge文件和其他许多文件(参见图 1)。这些文件不应移动或更改,除非您被要求这么做。原因在于,简单来讲,.edge文件只是一个 shell ,指向并使用您在使用Edge时创建的各 种JavaScript、HTML、CSS文件。如果删除其中一个文件,您将遇到故障。

记住这一点后,您就可以深入使用Edge并获得一定的乐趣了。

图1. .edge文件是在任何Edge项目的创作阶段创建的一个文件集合。

双击ramen_rahko_begin.edge文件启动Edge。当该文件打开时,您将看到Edge界面,如图2所示。界面的各个区域包括:

舞台(Stage):这是动作发生的地方。如果一个项任何时候都在舞台上可见,那么用户会在浏览器中看到它。请注意,舞台现在是居中的(这是预览 版2中添加的一个功能)。

属性(Properties)面板:就像它的兄弟产品Flash Professional一样,每个事物(包括舞台)都有属性。这些属性包括基本的属性(舞台的宽度、高度和颜色),也包括复杂的属性,比如圆角矩形、旋 转和在舞台上操作的对象的比例值。此面板也是上下文敏感的。例如,如果您选择一段文本,该面板将显示文本属性。如果选择舞台,您将看到舞台属性。

时间轴(Timeline)面板:如果您使用过Flash Professional或After Effects,您一定熟悉时间轴面板。左上角的按钮确定关键症过渡以及甚至舞台元素如何显示。时间代码是 可拖拽的(scrubbable) ,这意 味着您可以拖动时间代码来在舞台上移动播放头。时间轴基于时间,而不是基于帧,如果您滑动时间轴底部的缩放工具,会将您的视图从1/4秒的增量放大到几毫 秒。这意味着您可以严格地控制动画的时间。

您也可以在时间轴上拖动播放头(一种称为 拖拽(Scrubbing) 的技术),以转到特定的时间点或预览动画。

在紧挨着播放头的下面是另一个有用的工具,称为 标记(Mark) 。如果您是Flash Professional或视频制作者,最初很容易将标记视为时间轴上准确表示发生更改的位置的提示点。但标记稍有不同,因为它与播放头关系紧密,可用于 设置动画的开始到结束点的持续时间。

元素(Elements)面板:此面板同时用于两个用途。它公开文档的DOM,并充当着您项目中的各项的 库 。元素在此面板中显示的顺序就是它 们在时间轴上出现的顺序。如果您在图层顺序中上下移动时间轴图层,这一更改会在元素面板中迅速反映出来,反之亦然。

图2. Edge工作区。

创建第一个动画

现在您已熟悉了界面,可以开始在动作中添加内容了。首先将Airstream拖车从舞台左侧移动到它现在的位置。方法如下

1.选择Modify > Enable Smart Guides关闭智能参考线。智能参考线是在预览版2中引入的,是一种确保相对舞台和其他对象来准确放置对象的不错方法。在本例中,不需要它们。

2.打开Auto-keyframes,方法是选择时间轴面板顶部的秒表图标。当秒表变为红色时,Auto-keyframing就会开启(参见图 3)。

图3. Auto-keyframes已开启。

3.放大时间轴,直到看到时间轴上的0标记和1秒标记之间出现0:00.500。

4.按住Shift键,将拖车的两部分都选中。

本站文章信息来源于网络以及网友投稿,本站只负责对文章进行整理、排版、编辑,是出于传递更多信息之目的,并不意味着赞同其观点或证实其内容的真实性。如果您有什么意见或建议,请联系QQ28-1688-302!

人工智能实验室
相关文章相关文章
  • 未来两年人工智能要怎么走?看这篇就够了

    未来两年人工智能要怎么走?看这篇就够了

  • 英国研发“杀生”机器人 通过生命体获取能量

    英国研发“杀生”机器人 通过生命体获取能量

  • 韩春雨称已能重复实验结果 近期将有消息公布

    韩春雨称已能重复实验结果 近期将有消息公布

  • 无人驾驶汽车如何改变城市生活?听听他们怎么说

    无人驾驶汽车如何改变城市生活?听听他们怎么说

网友点评网友点评
阅读推荐阅读推荐

据国外媒体报道,在过去两年内,聊天机器人(chatbot)、人工智能以及机器学习的研发和采用取得了巨大进展。许多初创公司正利用人工智能和...

霍金 视觉中国 图 英国著名物理学家霍金(Stephen Hawking)再次就人工智能(AI)发声,他认为:对于人类来说,强大AI的出现可能是最美妙的...

文|郑娟娟 今年,人工智能(AI) 60岁了。在AI60岁的时候,笔者想要介绍一下AI100,一个刚刚2岁的研究项目,但它的预设寿命是100年,甚至更长...

AlphaGo与李世石的人机大战,为大众迅速普及了人工智能的概念。 但对谷歌而言,除了下围棋,现在的人工智能进展到哪一步了?未来,人工智能...