五天Principle从入门到精通02-Sketch的导入(2)

来源:网络   作者:热心网友   发布时间:2018-06-06    浏览次数:178
收藏到:

接下来我们来完成上文提到的:

“购物车选择栏下移至底部消失”

垂直移动画板2的最顶层“选择栏”至画板2外,如图:

然后将黑色遮罩的透明度降低到0,如图:

做到这一步我们就可以看到一半的动画已经完成了。

但是这里的速度比较快,我们来学习下一个知识点,时间轴的调节。

时间轴在哪里呢?我们选中红框示意的那条线,屏幕下方就会出现一个时间轴。

我们拖动时间轴上的两个蓝色的柱子,可以调节动作什么时候开始,什么时候结束。蓝色柱子前的菱形就是动画启动的时间,尾部的菱形就是结束的时间,两个菱形可以单独调节。

然后按照我动画分解中题要的步骤一步一步做,加工一下Toast层,缩放的动作修改的是它的scale属性。

这是最后的版面。

动画效果如下

源文件地址:https://pan.baidu.com/s/1pLSEdYj

 

总结:

第二天,我们学习了:

· Sketch文件的导入

· 补间动画逻辑

· 透明度动画

· 【案例】淘宝Toast

· 缩放动画

· 时间轴的控制

 

预告:

第三天,我们将会学习

· Principle中对象的四个交互属性

· Principle动画触发条件

· 动画的分解

· 符合现实物理世界的动画


12共2页

资源不存在?点我报错

文件格式:RAR 大小:未知 所需学币:0学币(VIP免学币)

素材介绍:Principle,从入门到精通,Sketch,导入,交互设计

下载地址:百度网盘下载  

联盟广告
×

感觉还不错,那就赞助一下吧!您的鼓励就是我们坚持的动力!

打赏说明:您的赞助我们将用于购买网络带宽和优质设计资源,提升用户体验!

相关推荐

http://www.shejixf.com/shejijiaocheng/uisheji/7326.html
×

一键快速登录后才能下载本站资源

新会员登录即可获取5学币奖励,超爽下载!

×

一键快速登录后才能下载本站资源

新会员登录即可获取5学币奖励,超爽下载!

×

充值学币 立即开通