静电说:其实Flinto并不算一个新鲜的工具了,但是感觉在设计师中的流行程度并不高,可能是这个工具一直很低调的原因吧。在16年初,Flinto还只是个可以做连连看的工具,跟其它同类型的工具并没有太多的区别。但是随着开发者对flinto的改善,特别是Behavior Designer加入后,Flinto终于可以有自己的核心特色了。通过后续的更新,不需要一行代码,通过Flinto来完成一个高保真的交互原型,也已经不再是什么难事儿。
那有些小伙伴可能要问了,Flinto与同类型的交互工具相比,区别到底是什么呢?我们应该如何选择呢?别急,且听静电慢慢道来。
01
好用的连线功能
交互工具最基本的功能就是连线,将多个交互设计稿通过超链接的形式链接起来,这好像并不是什么新鲜事,但是Flinto为我们提供的多种屏幕间的过场功能给了我很深的印象。如果我们使用普通的方式,在屏幕过场的时候,上部的状态栏也会随之发生效果,但在真正的应用中,这是不应该出现的。在Flinto中内置了原生的iOS状态栏,完美了解决了这个“假”的问题。
02
可以滚动的页面
如果希望高保真原型更真实,那页面一定是需要滚动的。毕竟不可能只有跟屏幕高度一样的页面,Flinto的滚动功能可以提供多种效果,支持横向,纵向,分页,以及滚动驱动其它内容进行变化的功能。总之,这样会显得更加真实了。如下图,我们用来模拟iOS真实的操作效果,和真的几乎一模一样哦。
以及滚动驱动的状态栏变化
03
Flinto中绘制矢量图形和文本
在之前的版本中,Flinto只支持最简单的矩形和原型,那么现在你可以用Flinto来绘制除了矩形圆形之外的形状,比如矢量路径,这一点非常酷。一些简单的形状我们直接在Flinto内部就可以搞定了,不需要再转到Sketch中导图片了。同时,矢量图形还可以做更炫酷的形变,最近Flinto还加入了可编辑的文字功能,想想都有点小激动呢。
04
Behavior Designer(行为设计)
行为设计功能是Flinto中的王牌功能,以往,我们在使用这些连连看的工具的时候,只能做到在同一个界面进行一次交互,然后就会跳转到另一个界面。但是通过Behavior Designer,你可以完成更多炫酷的操作。比如,在一个界面中控制多个开关的打开和关闭,并且这些开关的状态会被记录。就像真正使用一个应用一样。
同样我们可以用其制作弹层效果。
当然,在《不一样的UI设计师》这本书中,我们还详细讲解了无缝轮播图效果的实现原理 。
05
手机上进行真实的演示
安装Flinto手机应用后,你可以将自己做好的应用效果传到手机端,这个时候你会发现,他们做出来的效果真的跟实际的手机应用几乎一模一样。同时,我们也可以对自己的操作过程进行录像,并发给其他人观看。
06
完全中文化
很多小伙伴比较担心英文不好,但Flinto已经是原生的中文应用,使用起来简直没有任何障碍。
07
更好与开发工程师配合
Flinto内置了符合开发规范的曲线模型,我们可以很方便的将这些运动效果声称公式给开发工程师使用。
08
与Principle有什么区别?
Principle更专注于细节,比如一个Loading的动画过程,而非整个应用的演示。相比Principle,Flinto在这一方面更加在行。当然,要完成如下图这样的效果,Flinto也是不在话下的。
要了解更多Flinto的原创例子,欢迎大家阅读静电的新书《不一样的UI设计师》,里边提供了十几个静电原创的动效交互例子,并附赠了29集视频。同时我们也对交互过程中常用的动效曲线进行了深入浅出的讲解,相信大家在读完之后很快就可以掌握。总之干货满满,不容错过哦。
还没有购买《不一样的UI设计师》的小伙伴,欢迎猛戳下方的阅读原文购买哦。
有竞争力的设计师,更与众不同
UI中国创始人董景博老师强烈推荐
从现在开始,不一样
点击阅读原文-购买《不一样的UI设计师》
往期文章推荐
帮UI设计师处理繁杂事务的神器-Sketch Material插件
Sketch导出的图片为什么发虚?答案就在静Design·真相实验室
不一样的UI设计师都在关注我们(长按关注)
原创文章,作者:Tinadmin,如若转载,请注明出处:https://www.iamue.com/33547/