在线原型设计工具有哪些(移动和前端设计的3款工具推荐)

原型设计是将想法转变为设计过程中至关重要的一环。经常有设计师小伙伴可能会问到,“哪个原型设计工具是最好的呢”?实际上这是一种错误的提问方式,尤其是在当下原型工具种类繁多,针对不同需求各有优势的大环境中更加如此。就设计师而言,更在意的应该是“哪个原型设计工具对我现阶段的目标是最好的”?在这里,笔者列出了在3种常见场景下最合适的原型图设计工具的推荐清单,希望对你有所帮助。

一、设计中低保真、快速的界面原型

中、低保真原型一般指有限的功能和交互原型设计。它们更多被用于描绘设想、设计方案以及界面布局,建立这些原型的目的主要用于想法的初步呈现、沟通和演示。用于此场景的最佳工具应该是可以在短时间内完成,并能直观展示整个体验流程的工具。

场景特点:

  • 想法的初步呈现(APP/小程序/Web/html5)
  • 快速制作

工具推荐:

  1. Balsamiq

主要用于制作低保真、线框草图。 在低保真原型图领域,特别是 Web 原型图设计领域,Balsamig尤其受欢迎。使用 Balsamiq画出的原型图都是手绘风格的图像,看上去美观、清爽。可以说这个产品就是为低保真原型图而生,这一块的体验是其他产品无法比拟的。

如果你想要制作复杂的交互效果,还是算了吧,Balsamiq的交互基本上就一个操作,即“链接到另外一个页面”。

2.POP(Prototyping on Paper)

比较另类的产品,可以手绘草图,然后拍照传入软件,在照片中设置热区添加交互即可。在设计低保真原型图的时候出奇的方便。其基于手机端的玩法在我所列举的这些软件中是独树一帜的。显然,在手机端操作是它的优势,也是劣势。在特定需求场景下,这款产品一定能带给你惊喜。

二、构建响应式体验设计

当你的原型项目、设计稿需要应用于不同的项目尺寸时,这时就需要原型设计工具支持响应式布局。实现响应式布局一直是原型工具产品的一个难点,大多数原型工具操作方法是针对不同屏幕多做几稿,而以下两款产品其独特的响应式布局能力可以帮助你更快、更轻松地实现一次设计同时满足不同平台的原型设计需求。

场景特点:

  • 构建多平台产品原型(APP、小程序、Web、html5、Pad)
  • 省时和高效兼备
  • 具备制作复杂交互的能力(此类型项目,大部分都需要)

工具推荐:

  1. UXPin

在 UXPin 设计原型时,你可以自己设置断点,并为每一个断点区间做样式调整。在预览时,你也可以通过切换断点来观看不同尺寸下的效果。除开响应式,软件还提供了可编程组件,状态和逻辑,版本控制等功能,是一款非常全面的中高保真原型设计工具。

2.摹客RP

摹客RP是国内工具厂商摹客推出的一款全新原型设计工具。它集快速设计、强大交互、矢量编辑于一体,并且完全免费!

摹客RP在响应书布局功能上相比Uxpin更加强大和智能:只需要在制作时打开画板/组的响应即可自动开启响应式布局。开启后,画板/组所包含的组件也会自动开启响应式布局,非常简单就能实现“一稿多用”。

三、高保真原型设计

什么是高保真原型?简单理解就是:类似实际产品的原型设计稿。

它要求具备三个元素:

a.逼真细致的设计;

b.尽可能真实的填充内容;

c.和真实产品一样丰富且全面的交互效果。

该类型原型稿主要用于专业讲解、用户实测等场景。随着原型工具的发展,制作高保真原型所需的时间成本越来越低,我将要列举的三款原型工具,它们是制作高保真原型工具中的佼佼者。

场景特点:

  • 需要极高的保真度
  • 全面的功能支撑及高效的产出能力

工具推荐:

  1. Axure

知名度最高的原型工具,它作为最早、最权威的原型工具让多少产品经理又爱又恨。全面且强大的功能让它在行业里具有无与伦比的竞争力,但高昂的价格、复杂的操作也劝退了不少产品经理或者设计师。当然,如果你是一名追求强交互效果及细节的产品经理,它会是一项不错的选择。

2.摹客RP

再次出现了摹客RP。不必意外,作为一款为产品开发团队量身打造的原型设计工具,摹客RP可以做到快速产出和精细设计两不误。在高保真设计能力上,摹客RP表现的非常优秀:

a.摹客RP预设上千图标资源和组件,可以随意选用,其组件自带交互属性;

b.支持13种交互方式,几乎覆盖所有交互需求,真正实现了“所见即所得”;

c.自带专业矢量绘图功能,支持钢笔工具和布尔运算,配合响应式布局、256倍放大和像素级对齐等设计功能,可以轻松搞定高保真设计.。

除开以上优点,摹客RP支持流程图、PRD文档制作,产品经理可以一站式搞定撰写和创作的需求。最最最重要的是:它不限功能、不限页面、不限时长,绝对免费。

3.Flinto

在Framer、Principle、Pixate等一众国外设计工具中,Flinto是我最推荐的原型设计软件,在界面设计上,你不得不佩服它的设计团队:简洁、大气、精致的感受会在你打开软件的一瞬间扑面而来。但相比前面两款工具,Flinto在国内用户群体太小,学习资料和模板资源等都非常匮乏,所以只推荐给动手能力比较强的用户。

总结:

正如Facebook设计总监Julie Zhuo预测未来十年时所说:“未来的设计思维,就是产品思维”。对于设计师而言,应该更专注于设计而不是工具。设计过程中需要沟通什么、展示什么、测试什么?需要建立怎样的模块?需要什么程度的保真?当专注于设计的目标时,你就知道你要采用何种工具了。

建议所有的设计师,都应当广泛的涉猎目前主流的原型图工具的使用,一旦需要,即可使用。同时,笔者相信最好的工具,应当具备“更快”、“更简单”的特质,服务于设计思维,让设计师不为工具所累。

(0)
打赏 微信扫一扫 微信扫一扫

相关推荐

本文内容由互联网用户自发贡献,该文观点仅代表作者本人,不代表万网时代立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 qulianxi@foxmail.com 举报,一经查实,本站将立刻删除。