动效给程序员⽤什么格式_Principle：做动效，选对软件很重
要
你有多久没做动效了？平时的⼯作主要是终端视觉设计，功能需求加运营需求，静态稿件加动效设计，从⽐例来看，动效设计其实不会占很多空间，但偶尔也会来⼀波。⽽实际场景往往是：需求是排满的，项⽬是紧急的，时间呢当然是很少的。⼀旦有了概念，落地当然是越快越好，效率⾄上。因此，做动效选对软件很重要。
⽬前市⾯上已经有很多动效原型设计的软
件，AfterEffects，Keynote，Flash，Hype3，Flinto，Proto.io，Pixate，Origami，两只⼿已经快要数不过来惹，数不过来也学不过来。
学习⼀款新软件的过程并不轻松，新软件是否真的⾼效，很多软件与静态稿设计软件(PS、Sketch等)不能⽆缝衔接始终是⼀道坎，⾯对新的逻辑想要从初学者到轻松驾驭，时间也是个问题。看过上⾯提到的部分软件，也很想尝试，但⼀看见陌⽣的界⾯和新的逻辑内⼼就⾮常拒绝，始终难遇真爱。
痛并⽤着的After Effects
虽然After Effects软件很强⼤，拿来做动效很多⼈说是⼤材⼩⽤。但作为学渣我只会这⼀款，掌握的也都是⾮常基本的功能。在此之前我⼀直使⽤AE 来完成所有的动效相关的⼯作，但始终磕磕绊绊，⼼情略沉重：
1.简单的动效⽆法敏捷设计
⽇常忙碌的⼯作中，做出的动效质量不⾼，因为精调成本太⾼，想要获得流畅、弹性的动效，需要各种精调布塞尔曲线、图像缩放。另外，使⽤AE渲染出的mov⽂件导⼊ps转化为GIF整个过程⾮常缓慢，如果是10秒以上的视频⽂件在ps打开每次都要等1分钟以上，如果是macbookpro还会因此开始呼吸，⼼疼...
2. ⽆法交互始终是痛点
作为视频处理软件，AE最终⽣成的是⼀个动效视频演⽰，更像是讲述了⼀个故事。⽽在界⾯的动效设计中，我们更需要的是(⾯向PM、开发者、⽤户测试的)基于真实场景的交互和使⽤体验。
3. 最终沦为纸上谈兵
没有具体的数值给开发，很难被完美落地实现。你的动效设定很难形容(通常都⽤时间描述＋跑去和程序员⼀起慢慢微调)，感觉跟开发GG的代沟也越来越深...我们宝贵的⼯作时间和对动效的耐⼼与热爱
就这样被这些不⼈性化的缺点给消耗掉。有没有⼀个新型的动效设计软件既能敏捷⾼质量地输出动效，⼜能帮到开发GG获取数值完美实现呢？
前所未有的⾼效－Principle
创始⼈语录
今天推荐⼀款⾮常感⼈的动效设计软件——Principle。前两天因为有个动效需求排期紧急，半夜搜寻新的动效软件⽆意发现，看了⼀下官⽹视频内⽜满⾯地get了，隔天就⽤它出demo了。Principle在今年8⽉份诞⽣，来⾃前Apple⼯程师Daniel Hooper，到创始⼈在Medium 的QA访谈，Daniel Hooper认为A／B test或是客户的评价都不是衡量这款产品的成功指标，⽽是通过花费⼤量时间与设计师交流使⽤感受以获取⽅向，这么为设计师考虑，有点想哭。
了解Principle
官⽹基础教程的5个视频可以帮助快速了解基本操作，和学习Sketch⼀样查看Principle中⽂⼿册，英⽂原⽂可在Principle官⽹到。Youtube可以搜寻到SketchTV录制的视频教程，太基础不推荐，和看完官⽹的5只视频效果⼀样。
(新软件太多，连学习过程也有规律了有⽊有：扒官⽹>中⽂⼿册>教学视频>设计⽹站膜拜⼤神跪
求源⽂件)
没错，接下来就去dribbble搜寻⽤Principle制作的动画，下载源⽂件研究。
如果你是AE和Sketch的使⽤者，会对Principle有更为熟悉的认知：类似Sketch的界⾯＋AE的时间轴动画＋Keynote的神奇移动，外挂⼀个容易理解的联动功能，⽤于触发了某个事件发⽣的变化。
画布预设
预设画布
界⾯如此清切眼熟，和Sketch如出⼀辙。每个画布相当于独⽴的界⾯，也因此只要有联动变化，就需要新建⼀个画布，即使他们之间只有细微的差别。(需要注意的是这⾥屏幕尺⼨是1/2)
⽅便的⽂件拖动
有⽆@2x⽂件拖动对⽐
图⽚可以直接拖进Principle，Sketch内的⽂件也可以直接拖进Principle使⽤，省去了切图的⿇烦，注意拖拽前图⽚或⽂件需加上@2x的后缀(切图同理)。但如果设计稿经常发⽣更变，还是建议切图使⽤，因为可以在Principle直接替换切图⽽保留其动效设定。
⽀持的交互动作
包括点击、拖拽、长按、滚屏、⾃动循环等，可模拟3Dtouch。ps切图软件有哪些
窗⼝实时预览
提供⼀个预览窗⼝体验操作，运⾏效果界⾯跟设计界⾯本来就应该分离，开发者坚持这点真是太好了。
元素间⾃动⽣成补间动画
如果两个画布中⽂件名称⼀样但发⽣了变化，Principle就会⾃动像Flash⼀样为它创建⼀个补间动画。这⾥演⽰的动画除了画布间的Tap触发事件，对图形没有任何额外的操作，Principle根据4幅图之间的元素形状变化⾃动⽣成了补间动画。另外，可以快速调整补间动画的效果为缓⼊、缓出等或直接调整曲线。
导出mov、gif甚⾄追波稿
可以通过预览视图的录制⼯具录制视频并导出视频或GIF，导出时提供各种⽅便的尺⼨设定。⽬前点击形状只能在圈和⿏标之间切换，分别适⽤于移动终端和web。
在⼿机上即时体验
如果是终端界⾯动效，在Apple Store下载Principle并⽤数据线与mac相连，打开principle⽴刻镜像出你的动效demo，拔掉数据线依然有效，可以欢乐地在⼿机反复体验，甚⾄拿去⽤户测试。⽽且任何修改都是即时呈现的。
⼿动获取动画数值
虽然暂不⽀持直接输出动画数值，但可以通过时间轴⼿动获取曲线的具体数值交给开发者去实现我们的设计。
好的软件会影响使⽤者
如果说Photoshop的原配是AE的话，Sketch的最佳拍档未来很有可能是Principle，⾄少⽬前为⽌他们⼀样⾼效、敏捷。
优点：
1. 交互友好，可视化操作，易上⼿，零代码。逻辑是继承性的，适⽤于有AE、Keynote、Flash的任何使⽤经验者
2. 轻松输出⾼质量的动效demo，预设动画曲线⾮常精妙，调节⽅便，适⽤于简单快速的动效需求
3. ⾼效精准，让你的想法快速落地进⾏⽤户测试，更直观地与开发分享动效细节
4. 爱上做动效这件事，因为做动效从未变得如此简单
改进的空间：
1. 每⼀次的变化都需要新建⼀个画布，如果是复杂的交互将带来多画布和繁琐的逻辑，整个动画地图会⾮常复杂(⽐如⼿上另⼀个抽奖场景动效，从抽奖过程到结果展⽰，这种故事性的⾏为还是需要⽤AE来完成)
2. ⽬前⽀持的动效功能⽐较少，只有xy轴位移、透明度、⼤⼩、旋转(已经可以做出很多精彩的效果)。初期版本肯定不如其他动效软件完整，⽐如z轴位移、重⼒插件、修剪路径这种(原来我知道的也很少...)
btw：本⽂没有进⾏软件对⽐之意，因为并没有深⼊了解⽂中提到的除AE之外的其他软件，勿撕。有时间的话最想⼊⼿了解的应该是Hype3和Flinto吧，欢迎交流学习。
以上

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。