神器一箩筐!交互设计师必备的装机软件大全(Mac系统) - 优设网 - UISDC

神器一箩筐!交互设计师必备的装机软件大全(Mac系统)

2017/04/07 24373评论区

@Sophia的玲珑阁 :作为交互设计师具体的工作内容包含几个方面,一是绘制线框图,二是制作动态Demo,三是团队协作。网络上每天都会推出新的工具,能留在电脑里面的不过几款,能经得住时间考验的才是最好的。

小伙伴咨询工具类的问题也不少,于是罗列出一些,不定期进行更新吧(我自己的偏向,供参考,网站链接很多需要搭梯子访问)。

我按照工作需求分类,将电脑上的工具分为这几类:方案绘制、图片处理、动效原型、视频相关、思维整理、储存、Mac系统相关。

方案绘制

Sketch

在方案绘制这个环节,大家应该不陌生。首推的是Sketch,配合它使用的还有插件CraftManage,在绘制图片时使用它custom这个功能,可以随机更换填充图片,在做用户头像和APP里面的图片时特别方便。

Photoshop

Photoshop的功能在这里不再强调,在交互设计中,用来绘制方案没有sketch高效(原因我在之前的文章强调过多次)。但它强大的处理图片的功能,让人也忽视不了,经常能帮忙解决一些关于图片的裁切、格式调整、颜色等等的一系列问题。

图片处理

这里的图片处理主要是指在导出供程序员使用的APP图片资源。为了降低图片所占内存大小,需要进行压缩,ImageOptim 是个不错的选择,但它有时候压缩的大小并不是很大,因为是对图片基本是无损压缩。另外一个是在线工具TinyPNG,但对图片耗损比较大,适合图片透明区域比较多的情况。

gif制作主要是将一些小视频(主要是APP的demo)其中的某一小段做成图片,方便和运营的童鞋们进行沟通,他们在发文时有时候需要用到。GIPHY Capture,操作简便,对录制的gif也可以进行编辑,使用非常方便。

动效原型

Flinto

动效原型我试过很多种,最后剩下的是这三种,当然只供大家参考。Flinto是制作demo非常高效的工具,支持sketch导出。只要在sketch做好原型图然后通过插件就可以导入到Flinto。但Flinto的缺点在于,它缺少逻辑判断的功能。比如说点击一个区域可能有两张状况出现,此时Flinto并不能表现出这种逻辑关系,于是有了Origami作为补充。

Origami

Origami是Facebook开发的一款动态工具,它的优点是能很细致地表达一款动效的状态出来,支持各种逻辑的跳转,并且可以调动手机摄像头,模拟拍照功能,可以调用JS代码。但它的缺点在于不能做太多的页面,二十个页面以上的效果就会卡,不支持sketch的导入,需要手动拷贝文件夹。对设计师来说,因为代码思维操作,学起来也稍微显得有点困难。

Framer

Framer比Origami更接近代码。兼容sketch和ps的文件导入,熟悉以后按照适合Framer的操作来组织sketch图层在导入Framer的话,非常便捷。有些重复的事情用结构控制使用代码更方便,可实现的效果跟Origami差不多。程序员学起来特别容易上手。这个我也才刚接触,很感兴趣,希望有一天也能成为大神。

视频相关

1. 视频制作

动效demo有时候需要输出视频文件,想我做视频类的APP也经常接触到视频,所以这一块也有些鸡肋。视频制作软件功能最强大的就是Adobe After Effects,简称AE。学习成本不太高,跟其他视频制作软件的原理比较相似,就是在某个时间段内,将每个元素每个属性的变化进行拆分,一个个进行实现。

Final Cut 是Apple公司开发的视频软件,它更偏向于视频的拼接与合成,作为交互设计师,并不像动画师那样去制作,在视频这一块很多功能它就可以搞定。但Final Cut做出来的视频内存会非常大,一般5s左右1280x720px的视频可能就有200MB。

2. 视频压缩

别担心,与它配套的有视频压缩和格式转化软件,即 Compressor,压缩完成之后恢复正常,成了1~2MB。另外一款视频压缩软件叫HandBrake,该软件量感较轻,压缩速度比较快,操作更简便,功能没有Compressor强大,也是一个不错的选择。

3. 音频处理

对,声音的事情也会遇到,比方说按钮在按下去的时候有类似“咔哒”声音,这些也需要接触到声音的编辑。Adobe Audition 就是最强大的声音处理软件,对声音的时长、高低、格式、批量处理等都非常强大,操作也不难。

思维整理

脑图试用过很多种,最后锁定在MindNode 不换了,它是我见过最好的脑图绘制软件,没有之一。但没有Windows版,Windows的用户可以使用Xmind,也是很好用的一款工具。

邮件接收我也归类为思维整理这一块,推荐Spark,它能帮助用户自动分类邮件,颜值也高,还支持emoji的回复,可以体验一下。

储存

储存类我分为记录和保存两大块。记录呢,主要是印象笔记Evernote,国内的为知笔记WizNote也做得不错,两者选其一就行。大家都很熟悉,功能我就先不介绍了,主要来说说用法。两个笔记选一种就行,分散到两地笔记不统一,不方便进行整理。主要用于浏览网页时一些有用的材料收集。但能把Evernote玩出花的教程网上也有不少,可以搜搜看。

保存这方面,Dropbox 的对团队协作更为有利,企业版的Dropbox方便将一个文件夹分享给团队所有人,并且分配不同的权限,同时APP也行进行本地的同步,体验流畅,爱不释手。百度网盘作为国内一些资料的补充。

系统相关

OmniDiskSweeper

用来清理系统内存,我Mac是250G的空间,系统就占了将近100G,说起来都是类,这个我也上网查过,貌似没有什么特别好的方法去解决,通过这个软件能有所缓解。再就是在用sketch的时候将自动保存的功能关掉会省不少空间的。

Sublime Text

在与工程师交接的过程中有项任务是整理好APP里面的多语言翻译文件。即,一个button上中文是“完成”,英文变成“Done”,整体进行整理完善后再发给对方,有时候这项工作由PM(产品经理)来完成。但多方进行沟通的过程中免不了要打开或者编辑一些这样的文档。Sublime Text对于批量查找和编辑来说,对设计师是比较友好的。

总结,每款软件和工具都有它主要的特色,基本上没有一款软件能解决所有问题的情况,所以我在某一个方面的软件时,经过时间的沉淀都会剩下两到三款。这两到三款就是精华所在了。但市场瞬息万变,长江后浪推前浪,所不定会有更好的适合阶段性的工具存在。但咱们的宗旨是,主要的还是自己的想法,能实现自己目的的工具就是好工具,在上面所费的时间适可而止。

作者简介:Sophia的玲珑阁,一枚爱折腾,爱健身的交互设计妹纸。

职场设计技能,更多教程抢先看,请关注作者的微信公众号:「Sophia的玲珑阁」

「设计师必备软件合集」

  1. 动效设计丨《新人手册!动效设计几乎都是这10个软件做的(内附教程)》
  2. 工作流程丨《毕业生必备软件!6套APP构建我的产品设计工作流》
  3. 软件学习丨《从零基础到高手!教你一个快速学会软件的万能方法》

【优设网 原创文章 投稿邮箱:yuan@uisdc.com】

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

优设大课堂

非特殊说明,本文版权归原作者所有,转载请注明出处
本文地址:https://www.uisdc.com/interaction-design-mac-tools

发表评论 加载中....

评论加载中....

uisdc

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

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

您还没有登录

优设启用更安全省心的 微信扫码登录

微信扫码

300万设计师聚集地!优设网是极具人气的设计师平台
2012年成立至今,一直专注于设计师的学习成长交流

把好文章收藏到微信

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