交互原型工具全收录
原文发表于 Medium 2017年5月16日
原文链接:《 All The UX Prototyping Tools Ever 》
本文由 shengbanx 翻译整理,原文版权归属原作者所有。关注「伴星流形」公众号(ID:designforward),获取优质设计内容推送。
可能是目前最全的交互原型工具清单? 或许你看过很多原型工具推荐,但这次的数量应当会让你惊讶。
当前数: 62+3
—
Adobe 对 Sketch 作出的回应产品,集设计和原型功能的强大工具。目前处于测试阶段(支持Mac 和 Win10),但发展迅速,正式发布的时候应该会更加强大。
Anima 已经推出了一系列不错的 Sketch 插件,其中最新的是 Launchpad 插件。 虽然是用来快速制作发布网站,但是可以用于原型设计和概念认证。
较少人了解的原型工具,具有响应式布局、导出和导出代码等功能。
iPad App,可以直接在设备上制作原型。
基于浏览器,易于分享以及功能也不错。支持从 Google 表格导入数据,以及直接通过URL分享原型。
Avocado是Ideo做的一套工具, 配合 Quartz Composer(QC)一起使用。
Axure是经典成熟(2003年)的原型设计工具,包括设计、原型、图表、文档等制作。
流行的线框原型设计工具,闻名于“餐巾纸草图”。
Briefs是一个 Mac 和 iOS 结合的原型工具。
Bubble 可以通过可视化界面构建后台逻辑。
虽然还处于测试阶段,但其目标是成为对应 Sketch 的“After Effects”制作动效软件。
这个工具将原型设计和可用性测试结合起来,包含了任务提示和热图(heatmap)等功能。
Codiqa (Creator Classic) 是基于 jQuery Mobile 的原型工具,现在已经成为 Ionic Creator.
导入图片,链接设计稿,注释说明,十分简单。
仍然是测试版本, InVision 收购 SilverFlows 后可以直接设计在 Sketch 上制作交互原型,快捷使用真实数据, 期待以后会和 InVision 结合一起。
iOS App,可以导入图片快速制作原型。
免费开源的跨平台原型工具。
“下一代” 原型工具,支持常规动画、手势,以及导入 Sketch。
网页版原型工具,将设计稿创建为 iOS 和 Android 原型。
(该网站已失效)
设计或上传设计稿, 链接起来, 并且可以直接用于用户测试。
网页版的原型工具,亮点是具有导出代码和协作功能。
直接在设备上完成原生的原型。被 Google 收购.
功能强大的设计工具, 结合 Javascript 代码,可以完成流畅的动效。也可以从设计软件中 (Sketch, Figma, Photoshop) 导入设计,完成高保真原型。
采用一种叫做 “UX code” 的原型标记语言来构建原生 iOS 和 Android 应用的工具。
基于浏览器的线框和原型工具。
Mac 上的原型库,通过 Xcode 软件。把 Sketch上的 UI 快速实现原型,无需代码也可以,另外直接编译为 Swift语言,快速用于 App Store 上架。(有中文介绍页面)
行业巨头的存在,从简单的屏幕转换原型工具,拓展到导出代码,Sketch 插件等许多功能。
屏幕切换原型工具,支持用户测试分析和追踪功能.
通过拖拽操作即可创建真实代码原型的工具,使用流行的 hybrid app 开发框架, Ionic。
拖拽简易操作的工具,亮点是使用真实数据。
成熟的原型应用,拥有成熟的协作功能。
是的,Mac上的PPT演示软件. 也可以完成惊人的动画和原型。
被誉为“After Effects + Principle + Javascript”的软件。
也是拥有用户测试提示和热图(heatmap)功能的原型工具。
创建用户流程图原型的图表工具。
被 InVision 收购后,已停止更新。 :dizzy_face:
用于制作动画和交互原型的网页版工具,结合 Sketch 十分好用。
比较少人知道的动画原型工具,基于 Framer,可导入 Sketch,而且是免费的。
Mocking Bot(墨刀)
基于浏览器的网页版原型设计工具,功能不错,还可以导出为手机应用(安装包)。
原生的Windows和Mac应用, 设计的原型支持在 iOS 和 Android上预览。
网页版工具,支持用户流程图功能。
支持可视化界面构建 React App 的 Mac 软件,
支持可视化界面构建移动端原生应用的 Mac 软件。
使用节点式设计逻辑和功能的原型工具。
Zurb 框架中的一部分,支持用户反馈、用户测试等功能 (以前软件叫做 Solidify)。
经典的流程图工具,同样可以制作原型。
Facebook 推出的应对 Quartz Composer 的 Mac 版原型设计工具。
被 Marvel 收购,这个 App 因可以直接拍照制作交互原型而出名。
依据简单的组件,制作原型用语用户测试。
被 Google 收购,已不能使用。 :dizzy_face:
流行的动画原型设计工具。
也是出名的网页版原型工具,可以制作动画,只支持 Sketch 和 PS 文件。
比较特别的原型工具,可以使用手机传感器陀螺仪,目前支持 Mac 和 Win 10。(支持中文)
支持分享的网页原型工具。
网页版工具,拥有一套 App 可以支持多设备间测试原型。
拖拽式操作的原型设计工具,支持导出 html5。
出名的网页版原型工具,已经支持许多功能,包括导出至开发。
原本用于快速制作网站的工具,其 拖拽式操作让其成为一个快捷的原型工具。
旨在无需代码,有点像Webflow+UI设计功能。
—
工具太多了?
希望了解这些软件工具的对比介绍?
可以前往 uxtools.co网站 查看特性对比表格,也可以 填入邮箱 订阅每月的 UXtools 推送。
—
补充:
腾讯ISUX出品的免费原型工具,导入设计稿快速呈现DEMO原型,支持QQ扫码全屏预览。
专门针对移动端H5的制作工具,可以制作简易原型。
免费在线原型工具,具有云端组件库。
—
虽然原文列举了多达62个工具,大多都是可以快速制作原型、动效、导出到开发等。
但个人推荐影响力比较大的几个:Adobe XD、Principle、ProtoPie、Axure、Flinto、Framer、InVision、UXPin、Kite Compositor、墨刀、Origami Studio、Craft、Launchpad、Webflow。
不妨从这些开始尝试使用。
来源:知乎
关键字:原型设计, 原型工具, 产品经理, 产品原型
版权声明
本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处。如若内容有涉嫌抄袭侵权/违法违规/事实不符,请点击 举报 进行投诉反馈!