当前位置:首页>ps实例教程>ps制作实例>广告包装>教程内容

Photoshop设计动态APP演示动画(4)

来源:uicn 作者:MartinRGB 学习:8244人次

触控点

步骤1

创建新图层,命名为“Tap”,画一个白色形状,不透明度70%

Photoshop制作流畅的动态APP演示动画

步骤2

复制这个圆形,扩大,去掉填充,描边设置为3pt白色

继续复制,扩大,描边2pt

完事后居中对齐

Photoshop制作流畅的动态APP演示动画

隐藏tap图层组,因为刚加载完界面是不会显示触控点的,但是当选择元素产生转场时会出现。

滚动效果

步骤1

现在,终于开始做UI动态演示效果了,打开时间轴面板,创建帧动画

按下图那个红色划线按钮,创建新帧

Photoshop制作流畅的动态APP演示动画

Photoshop制作流畅的动态APP演示动画

步骤2

显示Tap图层组,隐藏两个描边圆,用来代表滚动手势。当开始滚动时,两个描边圈也出现,涟漪效果能够突出滚动手势。

Photoshop制作流畅的动态APP演示动画

步骤3

第一帧1s,第二帧开始帧延迟设置为0.2s

Photoshop制作流畅的动态APP演示动画

步骤4

添加帧

Photoshop制作流畅的动态APP演示动画

学习 · 提示

  • 一定要打开PS,跟着教程做一遍,做完的图到这交作业:提交作业
  • 建议练习时,大家自己找素材,尽量不要用教程提供的素材。
  • 教程有看不懂的地方,可以到论坛发帖提问:新手求助
  • 加官方微信,随时随地,想学就能学:ps_bbs,或扫右侧二维码!
  • 关注我们学更多,每天都有新教程:新浪微博 抖音视频 微信小程序
- 发评论 | 交作业 -
最新评论
暂无评论,交个作业支持一下吧~

关注大神微博加入>>

网友求助,请回答!