Hype

Hype中文官网 > 使用技巧 > 实例:用Hype制作飞机飞行效果(下)

实例:用Hype制作飞机飞行效果(下)

发布时间:2020/06/12

在之前的文章中,给大家带来了素材准备的相关教程,接下来小编就给大家介绍一下,该如何实现飞机飞行的动画效果。

如果想要了解上一篇教程,请点击查看:实例:用Hype制作飞机飞行效果(上)

动画效果实现的教程如下:

Hype界面的上方有个缩放按钮,可以将场景画布进行缩放,这里我们可以选择75%的缩放比例。

缩放
图1:缩放

将飞机和白云素材拖移至场景画布外,我们先将这两个素材都进行缩小处理,只要选中该元素,然后按住command键选中一个小圆点向图像中心拖动即可进行同比例缩小。

将素材移至画布外
图2:将素材移至画布外

将时间线通过拖移游标的方式拖至2秒钟处 ,或者我们可以直接在时间框内进行对应数字的修改操作,在选中飞机素材的前提下点击“记录“按钮。

记录
图3:记录

将飞机拖移至如下图所示位置,然后单击行动轨迹,我们可以在此轨迹上添加锚点,拖动锚点修改运动路径,这里可以一边修改一边查看效果,调整到自己满意的位置即可,设置完成之后再次点击“记录“按钮结束关键帧的录制。

修改运动路径
图4:修改运动路径

接下来我们处理白云素材,将白云移到画布中,然后在复制出一个新的白云出来放在远处。

复制白云素材
图5:复制白云素材

一般,我们看远处的东西都会比较小一点和模糊一点,这里我们也将后面的白云进行缩小和模糊处理,选中该元素,在元素检查器中找到滤镜效果,将其中的模糊度进行相应修改即可。

模糊度
图6:模糊度

如果你觉得面的云朵也需要这样的处理,进行同样的操作就可以了。

接下来将两个云朵也进行动画效果处理,方法可以参考飞机部分的操作,我们可以边处理边看效果,以便进行调整。

云朵进行动画处理
图7:云朵进行动画处理

处理完成之后,我们可以在览器中进行查看,如果觉得没问题,那么按照自己需要的格式进行导出就可以了,这样就可以和你的朋友们分享自己的小作品了。

导出为影片
图8:导出为影片

以上就是使用Hype制作的飞机飞行效果的全部教程了,如果想要了解更多关于这款动效软件的使用方法,欢迎大家关注Hype中文网站的教程页面。

作者:Shirley

标签:动画时间线

读者也访问过这里:
Hype中文版
创建漂亮的HTML5网页内容
立即购买
QQ 群
官方交流群:1046763737 立即加群
400-8765-888 kefu@makeding.com
热门文章
Hype制作矢量形状动态变形的动画效果
相信大家都看过一些网页动画,就是从一个矢量图形慢慢变成另外一个矢量图形。其实这个效果利用Hype可以非常简单地实现,下面小编就利用Hype 4版本,教大家如何快速简单地实现这一功能。
2020-06-09
实战:使用Hype绘制动态旅行路线(一)
小编今天给大家介绍一款HTML5动画制作软件——Hype 4。Hype 4是一款不需要使用Flash就可以进行HTML5动画制作的软件,让完全不了解代码的大家也能够轻松使用并制作自己的动画。
2020-05-22
Hype中触发事件的使用
一个优秀的网页绝不仅仅是一个静态的页面,在网页当中,还应该存在着一些点击或者触摸等主动触发事件,当用户点击页面上某处的时候,页面会相应的发生一些动态变化,这就是网页的触发事件。Hype作为一款专业的Mac端网页制作软件,同样支持触发事件功能。
2020-06-08
H5制作软件Hype导出功能详解
Hype是一款Mac端网页制作工具,它可以通过时间线录制功能制作各种各样的网页炫酷动画效果,同时也支持使用物理引擎制作动画。当然,它的强大不仅仅体现于动画制作方面,它的导出功能同样也是功能齐全,下面小编就通过使用Hype 4版本,为大家详细介绍下这款H5制作软件的导出功能。
2020-06-05
使用Hype进行动画制作的入门介绍
在一个网页中,如果多了一些动态元素的呈现,会使页面看起来更显得高大上一些。而Hype使用功能强大的动画系统,利用时间线录制功能,使制作者制作动画变得轻而易举。
2020-05-21
在Hype中手动编辑关键帧
在Hype中,制作动画是基于关键帧来实现的,通过时间线录制功能,Hype将为用户自动添加关键帧,不过添加关键帧以后,可能还会进行微调,那么用户该如何手动编辑关键帧呢?
2020-05-21