您还没有专辑

开始创建自己的专辑吧

创建
您可在个人中心-我的专辑处查看
当前位置:首页 > UI设计 > UI-游戏APP简单动效制作

UI-游戏APP简单动效制作

手机观看

扫一扫下载虎课app

支持离线缓存,随时随地学习

VIP优惠升级 21大分类,畅享50000+设计教程特权!

为自己充值升华学习
今日剩余学习次数:1

按住画面移动小窗

UI-游戏APP简单动效制作

播放卡顿?建议切换线路

宽屏取消宽屏

学设计上虎课网

学习意犹未尽?成为VIP,继续提升

免费学习即将结束

关闭继续学习>

发表评论
收起宽屏
分享给朋友:
手机观看

扫一扫下载虎课app

支持离线缓存,随时随地学习

添加到专辑收藏已收藏收藏成功,可进入个人中心-课程收藏 查看!
艾伦
艾伦

关注人数:173

目录信息笔记
图文教程学员评价 (16条评论)视频字幕查看优秀作品>

1.交互动画制作的软件有哪些。

2.本课主要的内容如图示。

3.【打开】Sketch软件,【打开】素材文档。具体效果如图示。

4.【打开】Flinto软件,【返回】Sketch软件,单击【插件】-【Send to Flinto】,具体参数如图示。

5.单击【Send】,【切换】至Flinto。具体效果如图示。

6.【选择】图片组,单击【滚动组】,【重命名】。具体效果如图示。

查看更多
课程综合评分:10
课程难易程度:太简单(2)简单(1)适中(10)有点难(1)太难了(1)
您需要学习后才可以评价,立即学习
课程综合评分:10
课程难易程度:太简单(2)简单(1)适中(10)有点难(1)太难了(1)
您需要学习后才可以评价,立即学习
评论列表
仅显示有内容的评论
仅显示带图评论
排序方式:

大家好 ,欢迎来到虎课网 ,我是艾伦 ,今天的教程 ,是用FLINTO制作简单的交互动效 ,比如这个视频中简单的动效 ,包括向上推的时候顶部消失 ,和搜索框向上移动 ,那还有简单的轮播啊 ,横向、纵向的滚动效果 ,如果你以后想往交互设计师的方向发展 ,或者说你想拿到更高的薪水 ,就得掌握基本的交互动效设计 ,那如果你只是想做纯的ui设计师 那么后面的视频就可以忽略 ,好 ,开始之前我们先了解一下市面上比较常见的交互工具 ,AE ,专业的非线性特效合成软件 ,与Adobe出的Premiere ,Photoshop、illustrator等软件无缝衔接 ,在影像合成动画视觉效i果,非线性编辑 ,设计动画样稿、多媒体和网页动画方面都非常厉害 ,也是目前使用人数最多 ,学习和培训课程最多的交互工具 ,它的缺点是不能做交互操作 ,只能通过视频的方式展现出来 ,Adobe的XD ,是刚推出不久的新设计工具 ,是Sketch的竞争对手之一 ,它可以做UI ,也可以做基本的交互动效 ,而且还是跨平台的 ,如果没有苹果电脑或者不熟悉MAC系统的同学可以选择XD来作为设计 ,而Sketch再不发力开发Windows的话 ,这个市场空间会会慢慢的被稀释掉 ,那还有着名的Invison公司也将推出自己的设计软件 ,Invison Studio 在这儿也替Sketch的发展前景担忧啊 ,好 下面是Axure ,Axure是个原型工具 ,产品经理经常使用的软件之一 ,做原型啥的没的说 ,可作为动效真得不好用 ,嗯 不推荐大家使用这个软件来做动效 ,而墨刀 ,是国人开发的 基于原型交互一体的工具 ,

起初只有Windows吧 现在有MAC上 ,也可以使用啊 还是不错的 ,好 下面是MAC系统中独有得 ,Flinto——本次课程的动效部分就是用Flinto完成的 ,也是与Sketch配合最完美的交互软件 ,与Sketch无缝地连接 ,操作界面 快捷工具都和Sketch一模一样 ,还有刚刚推出不久的Principle也和Sketch配合的不错 ,这两款软件的特点是上手容易 ,你不用学习代码 ,然后软件也比较轻 ,价格也比较适中 ,那其他的几款呢 是什么 ,Origami、Framer、Form、Pixate ,等这些软件需要懂得代码知识 ,上手也较难 ,而且这个Pixate这款软件已经停更了 ,好像Google收购之后就就没有再用 ,Keynote其实是最优秀的幻灯片软件 ,它比起office中的ppt工具好用的太多了 ,有兴趣的同学可以找找相关教材 ,当然它是可以做交互动效的 而且效果还不错哦 ,好 本次课程设计的内容我们提一下 ,课程目的是使用Flinto制作简单的常见的动效 ,那重点是一 ,纵向交互以及横向交互的实现 ,这就是最简单的操作 软件中能自动地实现这些交互功能 ,二 理解遮罩的用途 ,就是说你在做左右和上下动效的时候 ,要需要注意一下他们溢出的问题 ,这边有遮罩的一些内容吧 到时候会讲 ,好 三是交互的关联性 ,在制作的时候需要考虑好相互之间的关联 联动 ,做出的动效也不至于太生硬,对吧 ,课程难点就是Flinto2.0以后新增的一个工具叫行为 ,那这个工具掌握后其实很好理解以及运用 ,不过作为新入门的同学可能比较不好理解吧 ,

包括手势的操作也是一样 ,好 我们打开Sketch ,这是我上一次教程的设计稿 ,而之前的设计稿尺寸是iphone10 ,刚刚听课的那个界面上,右边有个原文件,下载本次课程的设计稿 ,轮播的图片组我也加上了 ,内容没什么变化 大家看一下 ,那我们怎么导入到Flinto里面呢 ,我们打开Flinto看一下 ,在Flinto这软件上边菜单中 ,有一个导入按钮是吧 ,点击一下看看 ,这是不是已经出现了你Sketch的文件啊 ,嗯 对 点击确定导入就行了 ,但是呢 ,这种方法其实不太好 ,为什么呢?如果你用Sketch ,如果你Sketch中的界面很多啊 就是画板很多 ,那就麻烦了 它会把全部都给你导进去 ,对吧 所以我推荐大家使用Sketch的插件 ,把它叫做“Send to Flinto”这个插件 ,在官网可以下载得到 ,或者通过我的素材包里去找到这个插件 ,好 我们准备导出 ,在Sketch中选中好 ,选择好你想要导出的界面 ,然后点击此插件导出到Flinto里面就好了 ,导出选项大家注意一下 因为我的Sketch中是按一倍的途径设计的 ,尺寸是375×667 ,所以缩放这里要选择200% ,也就是2倍 ,好 导出 ,那我们之前 ,我们之前打开过Flinto 所以这里要选择合并就行了 ,看 ,是吧 已经导过来了 ,嗯 我们看一下左侧的图层是不是跟Sketch一样 ,所以说它们之间的无缝衔接是对的 是吧 ,

嗯 预览的界面也没有什么太多的变化 ,那么 我们在开始之前 ,大概介绍一下Flinto这款软件吧 ,左上角 ,这个插入可以新建一个屏幕 ,那还有简单的矩形啊、椭圆形啊 ,文本工具等 这些都是在Sketch中一样的 ,包括快捷键也是相似的 ,那还可以把你设计稿的图片 ,导入进来 就分层导进来 ,那还有说 ,

登录后查看更多
换一批

为你推荐

每周一练

立即参与
虎课网为您推荐UI-游戏APP简单动效制作视频教程、图文教程、素材源文件下载,学员课后练习、作品以及评价等内容。UI-游戏APP简单动效制作教程讲师:艾伦,使用软件:Flinto,难度等级:初级练习,视频时长:18分30秒 查看全部
入门教程:
PS (CC2017)教程Illustrator教程After Effects教程CorelDRAW 教程SAI教程Sketch教程Indesign教程Lightroom教程Dreamweaver教程AutoCAD(室内)教程Maya(玛雅)教程SketchUp教程C4D教程Premiere教程3DS MAX教程Axure教程ZBrush教程DaVinci(达芬奇)教程Animate(Flash)教程Lumion教程Keyshot教程Excel教程虚幻4引擎教程AutoCAD(机械)教程PPT教程Word教程Principle教程SolidWorks教程Audition教程C#游戏开发基础教程Hype 3教程Unity3D引擎教程Rhino(犀牛)教程Substance Painter教程Mockplus教程Nuke教程Pro/Engineer教程Vegas Pro 14教程墨刀教程Final Cut ProX教程Unigraphics NX教程Xmind 8教程EDIUS Pro 9教程PAINTER教程酷家乐室内设计教程蓝湖教程xiaopiu教程Keynote教程Houdini教程MUSE教程PPT教程PS (CC2018)教程Adobe XD教程Twinmotion教程Realflow教程图怪兽教程SPSS教程Python教程Acrobat Pro DC教程VBA教程Mastercam教程Numbers教程Pages教程会声会影教程WPS(2019)教程Axure(9.0)教程Visio教程R语言教程JDBC教程Maven教程Servlet教程AJAX教程Rhino(6.0)教程Revit教程Amos教程PHP教程Creo(5.0)教程C4D(R20)教程CSS教程HTML教程Dimesion教程Java教程JavaScript教程Maya(2019)教程Blender教程Oracle教程SQL Server教程OBS Studio教程AE(CC2019)教程PR(CC2019)教程Camtasia studio教程CATIA教程FL Studio教程Cubase教程Redis教程AutoCAD(建筑)教程SQL教程Vue.js教程JQuery教程VideoScribe教程C++教程PowerMill教程Alias教程

同学,小虎知道你非常努力的想学习!

老师录制课程真的也很辛苦

赞助一下吧
限时新手任务
额外获得 4 次学习教程次数

确定学习吗?

您每天可免费学习一个教程。

成为VIP可无限学习 !

成为VIP吧!

成为VIP吧!

您已经免费学习 1 个教程 !

我们录制教程很努力的,赞助下吧 !

升级VIP吧!

您已经学习 5 个教程啦!

我们录制教程很努力的,赞助升级下吧 !

您已经累计下载5个源文件


您在当前分类下不是VIP,赞助VIP享受无限下载


您已经累计下载5个素材文件


您在当前分类下不是VIP,赞助VIP享受无限下载


您已经累计下载5个源文件


您在当前分类下不是VIP,赞助VIP享受无限下载


您已经累计观看5个图文教程


您在当前分类下不是VIP,赞助VIP享受无限观看


学习后才能评价哦!

学习后才能提问哦!

获得30虎课币

评论提交成功,将在审核通过后显示

×

下载素材/源文件:

收藏成功
取消成功
特惠
充值
客户端
虎课桌面客户端
置顶播放器,边看边学习
虎课移动APP
支持离线缓存,随时随地学习
领福利
微信扫码关注领5G 2019年全新素材包
建议意见
官方客服

官方客服

您可以与在线客服进行沟通或者拨打客服热线获得帮助

客服热线:021-80344319工作日:9:30-18:30

在线咨询:联系客服工作日:9:00-22:00

节假日:9:00-18:00

虎课积分
免费学习50000+个教程!
配套素材、源文件一键下载!
昨日学员已学习了171,973
并提交了2,021份作业!
登录后立即学习!
loading
微信扫码关注即可登录
登录后立即学习!
手机号
验证码
立即登录
您需要同意协议才可以进行登录
已连续签到0
第一天
5个虎课币
第二天
10个虎课币
第三天
15个虎课币
第四天
20个虎课币
第五天
40个虎课币
第六天
20个虎课币
第七天
20个虎课币
立即签到
已签到
每周一重置签到奖励
已连续签到0
本周斩获110个虎课币,下周也要来哦
我知道了
已连续签到0
哎呀,签到失败了!
再次签到
哎呀,系统出现错误,请稍后重试!
上上签 · 今日宜学习
恭喜!签到成功,获得 10 个虎课币
.
书山有路勤为径,学海无涯苦作舟
— 唐代文学家 韩愈
虎课网 · 每天进步一点点
分享到
全站50000+课程免费学!昨日已有41614位学员免费领取~点我领取