使用这些顶级UX工具掌握你的手艺

本文概述

设计+原型+设计移交工具
设计与原型制作工具
原型制作工具(仅)
原型设计+设计移交工具
设计移交工具(仅)
线框图+原型制作工具
线框图工具(仅)
UX研究与测试工具
分析工具
总结

拥有合适的UX工具可能是协作, 无缝, 整体高效的设计工作流程与缓慢, 无效率且不负责任的工作流程之间的关键区别。
重要的是要了解最新的工具和技术, 并了解设计师可以使用它们有趣的方式来更有效地创建和协作。根据团队的规模, 设计过程的阶段以及已经包含在工作流程中的任何其他工具, 某些工具比其他工具更有效。
让我们看一下顶级的UX工具, 从线框图和原型制作到UX研究和分析, 这些工具都可以帮助团队在2018年做出令人难以置信的事情。
设计+原型+设计移交工具 InVision / InVision Studio
平台：Web(与Sketch和Photoshop集成)和macOS
价格：个人每月13美元起, 五个团队的每月89美元起
注意：价格适用于核心InVision Web应用程序, 而不适用于免费的InVision Studio。

文章图片
InVision Web应用程序显示各种应用程序屏幕的状态
InVision可以说是迄今为止功能最强大的UX工具。它允许Sketch和Photoshop设计师导入其静态屏幕并将其转换为动态原型, 并让涉众提供建设性的反馈, 然后将其转换为可操作, 可管理的任务。将其与用户测试和协作白板技术相结合, InVision Web应用程序将成为非常宝贵的工具, 给人留下深刻的印象。
InVision在2017年交付了新的设计移交功能, 现在到2018年, InVision已成为一套完整的多合一解决方案, 因为他们推出了自己的UX设计工具Studio。该工具是免费的, 包括高级动画和原型制作功能。
对于希望在一个订阅下拥有完整库存工具箱的团队, InVision在这里。

文章图片
Studio, InVision的新UX设计工具
成帧器/成帧器工作室
【使用这些顶级UX工具掌握你的手艺】平台：macOS
价格：个人用户每月12美元, 三人一组每月250美元起

文章图片
就产品而言, Framer是最类似于InVision的工具, 因为它们都将成熟的Web界面与全新的UX设计工具结合在一起。这两个因素都取决于个人喜好, 但是Framer对于个人而言便宜一些, 而InVision在设计协作方面显然是个大兄弟。
菲格玛
平台：Web, macOS和Windows
价格：入门团队免费, 或每月12美元

文章图片
Figma作为多人游戏设计的领先工具, 在开发初期就脱颖而出, 使多个设计师可以一次处理同一个设计文件。由于能够创建响应式设计并添加了移交功能, 因此他们在产品的Web, macOS和Windows版本中提供这些功能的方式令人印象深刻。
如果你喜欢精力充沛的协作式设计工作流程, 那么Figma将非常适合你。
Adobe XD
平台：Windows和macOS
价格：1个原型免费, 或者无限量原型每月20.99美元

文章图片
当Sketch成为用于线框图和界面设计的＃1工具时, Adobe几乎别无选择, 只能承认Photoshop永远不是设计师所需的UI设计工具。 Adobe决定向没有Sketch的Windows用户提供Adobe XD, 并且还内置了对用户流程进行原型制作和检查设计的功能, 以帮助熟悉Adobe生态系统的资深设计师坚持熟悉的工作流程。
UXPin
平台：网络
价格：一位用户每月8.10美元起, 团队其他选项

文章图片
UXPin是一个完整的产品设计平台, 可在单个Web应用程序中提供从设计, 线框图, 原型制作, 协作, 用户测试到切换的所有功能。缺点是, 由于功能很多, 界面混乱以及(有时)性能滞后(通常困扰着庞大的Web应用程序), UXPin是更难使用的工具之一。但是, 需要令人印象深刻的功能(例如设计系统)以及能够利用Web框架和技术(例如Bootstrap和Google字体)的能力的企业团队不应太过忽视它。
设计与原型制作工具草图
平台：macOS
价格：99美元/年

文章图片
当Photoshop在2015年成为线框和界面设计的领先设计工具时, Photoshop荣crown头衔；到2017年, 它们仍在引领潮流。 Sketch的屏幕设计创新方法引入了诸如画板, 符号和导出之类的宝贵功能, 从而激发了Adobe XD, Framer Studio和InVision Studio等新设计工具的浪潮。这个非常直观(轻量级)的矢量工具可帮助UI设计人员以前所未有的速度进行迭代。
但是, 这是” but” (但很大)：Sketch在Windows上不可用, 他们决定在游戏后期实施原型设计师的工具, 这意味着他们的竞争对手已经通过InVision迅速占领了这个市场。可以说是当今可用的最动态的原型制作工具。尽管可以通过令人印象深刻的插件目录(包括与Flinto, Zeplin, Marvel, Principle甚至是InVision本身的集成)来定制Sketch功能, 但有些设计师可能会喜欢这些功能, 而这些功能可以从中轻松获得。框。
总而言之, Sketch非常适合进行构想和线框图设计, 也适合那些不介意添加工具箱以添加更好的原型设计和协作工具的人。
网络流
平台：网络
价格：针对单站点个人, 多个站点和团队的多种选择

文章图片
Webflow是面向现代设计师的WYSIWYG编辑器, 他希望构建无需代码的自适应网站, 甚至托管这些网站, 并且只需订阅即可。 Webflow可以输出干净的语义代码, 从而使你不必使用, 并提供强大的功能, 使Web设计人员可以创建从静态网站到电子商务商店的任何内容, 甚至可以从同一仪表板管理内容和库存。
原理
平台：macOS
价格：129美元/年

文章图片
受到好评的Principles应用程序虽然比原型设计工具更多, 而不是设计工具, 但它是为专注于高保真原型的设计人员而设计的, 它使用时间轴动画来帮助设计Sketch和Adobe XD不需要的高级微交互。如果设计功能不够复杂, 无法满足你的需求, 则Principle将与Sketch集成。
原型制作工具(仅) 弗林托
平台：macOS
价格：99美元/年

文章图片
Flinto使用先进的动画工具(包括弹跳和缓动, 3D旋转, 滚动效果)将过渡和微交互提升到了一个新的水平, 甚至允许时尚设计师将动画导出为视频, GIF和Dribbble镜头。
虽然Flinto仅专注于原型交互, 但它做得很好。与Sketch配对可获得最佳效果。
折纸
平台：macOS
价格：免费/开源

文章图片
Origami是由Facebook设计团队开发的应用程序原型工具。尽管它与Flinto相似(减去价格标签), 但是却没有像类似的工具那样经常维护, 并且其基于逻辑的交互设计方法可以使学习曲线更加陡峭。
对于预算有限的设计师, Origami非常值得一看。
原型设计+设计移交工具奇迹
平台：网络
价格：个人每月$ 0-12 /, 团队每月$ 42-84
需要SSO和切换功能的企业团队应__直接查询_。_

文章图片
Marvel是一种在线原型制作工具, 以最容易掌握而著称, 但是, 要权衡的是, 它在动态原型制作功能方面不如InVision复杂, 并且需要与Sketch集成才能成为完整的设计+原型制作解决方案。。话虽如此, 它确实与Lookback集成在一起, 将用户测试带到了桌面, 并且包括设计切换功能。
Marvel还允许团队(甚至是非设计人员)选择画板并使用形状和文本说明低保真度的想法, 使其成为设计冲刺的理想选择(尤其是因为它还允许用户将纸张原型转换为低保真度Marvel原型)。
设计移交工具(仅) 策普林
平台：网络
价格：一个项目免费, 三个月和12个项目分别为$ 17 /月和$ 26 /月
对于大型组织, 他们的$ 7.65 /用户/月选项提供更高级的用户权限, 并能够在项目之间复制颜色和文本样式。

文章图片
Zeplin的性能始终优于竞争对手Sympli和Avocode, 最近在Zeplin上添加了Adobe XD和Figma集成以及已经存在的Sketch和Photoshop CC集成。尽管许多多合一工具在其功能列表中添加了设计切换功能, 但Zeplin填补了那些尚未使用的工具(Sketch, Photoshop)以及仍在尝试切换功能(Adobe XD, Figma)的工具的空白。
线框图+原型制作工具阿克斯雷
平台：Windows和macOS
价格：Pro / Team / Enterprise用户分别为$ 29/49/99 /用户/月
一次性购买Axure RP 8的价格也从495美元起。

文章图片
Axure专为线框和粗糙原型的设计而构建, 并具有可轻松创建数据驱动, 动态和自适应模型的功能, 你会忘记它是没有高保真UX原型功能的工具。对于仅专注于线框和原型设计的设计师而言, Axure是首选, 被《财富》 100强公司中的87％使用。
贾斯汀敏德
平台：Windows和macOS
价格：$ 19 /用户/月, 或$ 39 /用户/月, 企业团队

文章图片
Justinmind对其提供的产品并没有获得足够的热爱, 这些产品包括高级UX原型, 协作, 一些基本的设计工具以及500多个用于线框图的Web和移动小部件。线框图并不是许多竞争性原型应用所关注的东西, 这使得贾斯汀敏德成为少数几个UX工具之一。
线框图工具(仅) OmniGraffle
平台：macOS
价格：100美元, 专业版许可证200美元

文章图片
OmniGraffle是具有图表绘制功能的线框图工具, 对于可能需要更多关注用户流或信息体系结构的应用程序和网站很有用。作为本机macOS应用程序, 该界面非常友好, 使其成为易于掌握的UX工具。
OmniGraffle具有一个非常方便的功能：” 模板” , 它们是” 模板库” 中的即用型, 拖放式可重复使用的设计组件, 设计人员可以使用它们来构建线框, 模型甚至最终的视觉设计。用户可以创建自己的库, 网络上也有数千个模板库可供下载, 其中许多是免费的, 从而节省了时间和精力。
Graffletopia是网络上最大的模具存储库之一, 其中包含免费和收费的库。 Graffletopia拥有1100多种模板, 可满足各种用途的模板-设计移动应用程序, 网站, 网络图, 流程图等。
Balsamiq工作室
平台：Web, macOS和Windows
价格：每位使用者每年$ 90美元起, 云端应用程式则为$ 89美元起

文章图片
Balsamiq与Justinmind相反, 他更多地关注线框图而不是原型。他们的内置UI元素使用草绘的视觉美感来鼓励集思广益, 并且专门针对产品经理和开发人员以及线框图设计师, 从而使整个团队尽早成为设计过程的一部分。
UX研究与测试工具回望
平台：网络
价格：$ 49 /用户/月或$ 99 /用户/月, 具体取决于功能

文章图片
回溯将实时, 适度的用户测试引入到UX设计过程中, 使设计人员可以记录世界上任何人的面部, 屏幕和声音。对于使用Marvel作为其原型制作工具的团队, Lookback与它无缝集成。
用户测试
平台：网络
价格：$ 49 /测试(最少15个测试), 提供企业级选件

文章图片
UserTesting在功能方面类似于回溯。尽管它是一个了不起的独立用户测试工具, 拥有大量经验丰富的用户测试员(使用Marvel, 你需要自己找到用户测试员), 但UserTesting也可以与InVision无缝集成。
Eyequant
平台：网络
价格：个人$ 499 /月, 十人团队$ 999 /月(+企业选项)

文章图片
Eyequant使用机器学习来帮助团队做出更好的设计决策并改善他们的CRO工作。其高昂的价格标签可能会吓阻某些客户, 但那些进行投资的客户会接受有关如何模拟用户, 分析指标, 充分利用其A / B测试等方面的培训。
霍贾尔
平台：网络
价格：可变价格, 取决于每日的网页浏览量

文章图片
Hotjar通过将用户反馈与分析, 热图, 点击图, 滚动图和访客记录相结合, 使团队轻松优化用户体验。热图和点击图分别说明用户正在移动和单击鼠标的位置, 滚动图表示用户可能在哪一点失去兴趣。
疯狂的鸡蛋
平台：网络
价格：$ 29 /月/月, 可浏览20, 000次

文章图片
与Hotjar相似, Crazy Egg用于通过使用热图和访客记录分析用户行为来优化用户体验和转换率, 尽管它还包括易于使用的A / B测试工具, 以帮助你了解有效和无效的内容。
最佳车间
平台：网络
价格：$ 166 /用户/月, 有免费和企业可用选项

文章图片
Optimal Workshop是一个用户研究工具包, 专注于卡片分类, 调查, 树木测试, 首次点击测试和定性数据发现。
分析工具谷歌分析
平台：网络
价格：免费

文章图片
虽然Google Analytics(分析)没有提供最富启发性或最实用的界面, 但它确实为免费工具提供了大量数据, 使其成为用户研究和获取你可能想在其他工具中进一步探索的见解的合适起点。
混合面板
平台：网络
价格：每100万个数据点99美元起, 提供免费和企业版本

文章图片
Mixpanel允许从高管到简单贡献者的任何人使用数据做出更具战略意义的决策。与Google Analytics(分析)相比, 界面更友好, 设计人员可能会发现, 分析用户旅程, 了解用户如何与产品互动以及使用Mixpanel解密复杂的行为分析更加容易。
爱
平台：网络
价格：价格取决于用户数量和所需功能

文章图片
与大多数其他分析工具相比, Pendo的界面要简单得多, 它使设计人员可以跟踪NPS(净发起人得分), 细分用户, 优化渠道和用户旅程以及你希望从顶级网站分析工具获得的任何其他功能。除此之外, 设计人员还可以根据跟踪的数据提供有针对性的公告, 上下文帮助和量身定制的体验。
总结选择正确的UX工具需要仔细考虑。我们需要考虑成本, 与其他设计师和利益相关者的协作水平, 平台以及我们可能需要与之集成以维持无缝工作流程的任何其他工具。缩小选择范围后, 请注册免费试用, 并考虑运行5天的设计冲刺来测试水域。