上手亲测!资深交互设计师推荐的6大必备神器(附教程) -
亚洲城ca88,ca88唯一官网,ca888亚洲城唯一入口

亚洲城ca88,ca88唯一官网,ca888亚洲城唯一入口

优秀设计联盟-SDC-网-设计师交流学习平台-听讲座,聊设计,找素材,尽在网

菜单

上手亲测!资深交互设计师推荐的6大必备神器(附教程)

2015/09/22in 阅读 39251评论区

6-best-interactive-design-tools-1

编者按:不想在错误的软件上花功夫?花五分钟看完这篇!今天推荐的这6款交互设计工具全是经过 上手研究过的,优缺点都总结出来了,看完相信同学们就有答案了。

1.  After Effects

你想在短时间内制作复杂演示效果。 请使用AE,曲线/锚点等使用MOTION V2脚本进行快速调整(在曲线界面中 鼠标拖动选择关键帧–>拖动脚本上的滑块–>对比缓动曲线 获得你想要的曲线效果,比其他脚本好用的在于曲线你可以进行自定义,表达式也好修改–>不会改的话学点JS咯),你熟练AE的话能很快得到比较好的效果。AE缺点就是不可交互+精准度很难控制,当然有一个点就是,你想要什么效果 AE都能实现。但是程序上能不能实现就难说啦。

2. PIXATE,图层类交互原型软件

最近被GOOGLE购买了,然后免费了(说实话GOOGLE 可以说是产品杀手,进去的产品。。。我不敢苟同楼上们的那些说法)。

优点:可交互,共享性强,有团队讨论以及回复模块(此处有点像justinmind)【有windows版本】,对GOOGLE MATERIAL DESIGN的支持比较好,MD相关预设会越来越多哦。

具体参见:

缺点:图层类软件你们都懂得,用AE做可交互已经很烦了,更何况再加上一个交互模块,而且没有时间线啊。

用Pixate烦人的一点是,我是用750*1334做的,然后导进去发现,这货是按照375*667啊,而且不能直接从sketch粘贴,能别这么麻烦么。

Form和origami都是支持粘贴的。还有 动画预设较少。不过GOOGLE是动画狂,他们肯定会加预设的啊哈哈。听说以后版本会支持code export,观望中。

UI and Wireframe Kits

3. FRAMER STUDIO.

其实我并不想推荐,不过作为写得起前端扛得起大旗的交互大神必用咯。

优点:你想干什么 就能干什么。而且分享起来特别简单,所以有很多案例,我们可以直接把代码拷过来用。关于这个你们可以去FRMAER的facebook群组看看就知道啦。基于coffeescript开发的你还能导入Sketch、PS文件。很方便。能够精确控制每一个图层的属性。毕竟人家是强大的JS,你还想怎样。

缺点:你是视觉,你是交互,你大学/培训班 研究过JS么。如果不会,请略过。

如果你会JS而且你写代码的速度很快,那恭喜,这绝对好用。其实说白了 就是套代码模板。

4. FORM

节点类软件。如果用过nuke的人 ,那就很熟悉咯,被GOOGLE买了。

优点:节点类软件,原型的可维护性强。GOOGLE的孩子,MD设计规范里的那些动画预设它最新版本里包括了。而且还有好多MD相关的PATCH了。还出了IOS SDK,用来创建自定义PATCH什么的,这块学的其实是QC…准备跟开发快速融合..以后可能能够导出MD 的android代码呢,期待期待。

缺点:不能在电脑上预览。肾六坏了还得跟同事借!还有就是支持从Sketch里粘贴了,结果不支持Retina,我用750 1334做的,结果发现Form是375 *667啊。我都得缩放成0.5才能继续。吓死朕了。还有就是不能共享啊。IOS工程师都是我们的大爷,你这样还要给他装FORM,会把他气shi的!

Android UI Mockup Templates from GUI Toolkits Illustrator, Fireworks, Axure, OmniGraffle, Visio, Keynote and PowerPoint

5.  ORIGAMI+QC

目前比较好用的节点类软件,FACEBOOK的天才们出的。

优点:可导出有一定使用价值的代码。 可维护性强。可在设备+电脑上都能预览。现在靠谱点的就这个啦。用的人也相对多些。你可以直接从SKETCH粘帖过来。不过只有在使用POP ANIMATION 的PATCH时才可导出代码哦。不过开发那边真的能用这些代码。关于和开发沟通这个下面再写吧 。

缺点:有一些BUG不忍直视。

不能分享:有时给你的IOS工程师装了QC也没卵用。为什么?因为QC绝对烧死CPU+吃内存啊。就算你把FPS调到最低,如果图层够多够复杂,会把工程师电脑卡死的。XCODE都死了工程师怎么活嘛。还有就是目前功能上缺陷比较多(比如Swipe不能选择具体方向等,可以用自定义的PATCH进行定义,但是初级人员就用不了啊),有时你需要各种综合各种条件各种patch才能获得一个简单的效果。

关于ORIGAMI和开发的结合问题 :

1、ORIGAMI只能够导出POP animation PATCH相关的代码(CLASSIC ANIMATION和BOUNCY ANIMATION都是不能的哦–听说下个版本会有),代码里面的位移(POSITION TRANSITION)信息都是绝对位置,所以适配上你和开发需要进一步讨论解决方案。我的建议是 QC中的定位系统严格统一为TOP LEFT或CENTER等。这个对适配问题很重要,如果你的外部GROUP的定位用的CENTER,而里面图层用的各种各样的其他参考坐标系,那么你导出的位移信息基本没卵用了。

2、如果有DELAY的话,请把DELAY放在POP ANIMATION PATCH的前面,如果不放在前面,代码导出的主要属性变化部分是空的(这应该是个BUG啊)。听说下个版本会导出delay的数值。

现在是我把DELAY用文档形式给开发,开发自己输入。还有一些循环动画也是不可导出的,这些也是以文档形式给的(其实就是让IOS哥哥坐在我旁边,用我的另一个显示给他看效果,一个显示器看我的QC工程直接沟通了,并没有用什么卵文档。如果你是大公司,流程化嘛肯定需要咯)。

3、你的ANCHOR POINT就算是TOP LEFT,图层旋转是不会绕他的左上角旋转的。不过缩放是会缩放的。这个很坑啊。还有代码导出并没有导出ANCHOR POINT信息。

不过解决方案有的。但是都很麻烦。就是AE中的空白层类似的概念,留空切图。

4、很给力的东东叫PAINTCODE. 可以直接把SKETCH粘贴的图层转为代码。并且PAINTCODE的官方提供了能够和ORIGAMI结合的PATCH,稍微研究一下(研究一两个小时,看看PAINTCODE的那个APPLE WATCH教程),就能够从PAINTCODE里解决ORIGAMI的一些鸡肋的问题。

从安装到实战教程:

Android L Icon Grid PSD

6. HYPE 3 PRO. 

人家是做HTML5的啦。不过,如果你不会用Framer,那可以用这个,这个还有时间线,不过我喜欢从SKECTH里直接粘贴过来,然而Hype不支持粘贴过来,直接PASS了。不过做HTML界面确实很给力啊。简直就是神器。不过用来做原型的人还是少数咯。

有夸FORM的,有夸AE的。作为MOTION DESINGER 还是最爱AE。

但从交互设计师的角度,关于哪个更好用,哪个淘汰,关我鸟事,哪个好用时用哪个。从目前看,ORIGAMI还是不错的。不过这些软件更新够慢的。全都有问题的时候,只能选自己爱用的好了。NOODLE我没提是因为它的BUG太多,还不足以有资格跟上面这些竞争。

【动效设计全攻略】

必要的思考:

靠谱的总结:

真实的案例:

原文地址:
作者:

【网 原创文章 投稿邮箱:2650232288@qq.com】

================关于网================
“网“是国内人气最高的网页设计师学习平台,专注分享网页设计、无线端设计以及PS教程。
【特色推荐】
设计师需要读的100本书:史上最全的设计师图书导航:。
设计微博:拥有粉丝量101万的人气微博 ,欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航:全球顶尖设计网站推荐,设计师必备导航:

非特殊说明,本文版权归原作者所有,转载请注明出处
本文地址:/6-best-interactive-design-tools

继续阅读与本文标签相同的文章

发表评论 加载中....

验证码加载中....

评论加载中....

底下还有哟~快放我们出去~
uisdc

评论区都快饿瘪了,看看我期盼的小眼神...

评论就这些咯,让大家也知道你的独特见解 立即评论
以上留言仅代表用户个人观点,不代表立场

相关文章

关于我们

网(uisdc.com)是国内极具人气的设计师学习平台。2012年成立至今,一直专注于设计师的学习成长交流。目前正通过网站、微博、微信(ID:youshege)、各大社群为设计师提供高水准的行业设计讲座和领先的设计资讯分享。为设计师发声、替好作品说话,是平台的运营理念。想更全面了解或联系我们合作,欢迎访问。

我们的团队

微信

设计秘籍 一扫"掌"握!

                  官方 QQ 群:

Copyright © 2018 亚洲城ca88,ca88唯一官网,ca88手机版入口 -官方微信号:

sketch 大课堂 转场动效 设计师 扁平化设计 交互设计师 界面设计 排版布局 职场 平面设计 设计师专访 素材下载 视觉设计 配色 设计流程 web前端开发 AI教程 用户体验设计 设计理论 海报设计 神器下载 字体下载 设计趋势 设计规范 psd下载 动效设计 图标设计 产品设计 logo设计 ICON 神器推荐 职场规划 App设计 字体设计 酷站推荐 交互设计 ui设计 设计师职场 优秀网页设计 用户体验 ps技巧 酷站 PS教程 网页设计 经验分享

上周热门文章

热门专题

把好文章收藏到微信

打开微信,扫码分享
学设计 在这里