干货!所有常用的原型设计工具都在这里了

标签: 原型 设计 工具 | 发表时间:2016-11-22 10:05 | 作者:
出处:http://www.iteye.com

本文列举了20余款当前国内外比较火爆的原型设计工具。我把它们分为以下五类:

1. 交互原型设计工具(仅限页面交互)

2. 手机原型工具

3. 网页原型工具

4. 静态原型工具

5. 动态原型工具(组件和页面交互)

交互原型设计工具(仅限页面交互)

这一类工具主要是建立页面之间的交互。其本身不能进行组件的制作和设计,需要从其它地方(例如:PS,本地)导入设计图,对已有的设计图创建热点,进行交互设计。

Invision - 一款很好的制作原型交互演示的工具。你可以从本地、Dropbox、Google Drive和Box上传图片。使用拖拽快速创建热点。它的分享、协作、评论功能也很方便。

Chianco- 一款轻量级的交互原型设计工具。拖一拖鼠标, 快速创建交互;内置多种转场和触发效果,点一点就可以使用;扫一扫,直接在手机上预览效果,也可以导出HTML,分享给同事。

Marvel - 一款简单易用的原型工具。只需几次简单的点击,就能将静态的设计图链接起来,变成可点击的原型图。

Flinto for Mac - 一款Mac端的交互原型设计工具。支持一键将 Sketch设计稿导入, 添加热点配合相应的交互动作生成原型通过网页或者手机端展示给客户观看。

Atomic - 可以用来快速设计交互和动画的原型工具,无论是手机原型还是桌面端原型,都是不错的选择。

手机原型工具

这类工具内置了制作手机原型的组件,可以创建和编辑组件。设计时,可以选择不同的手机模型。在手机预览很方便。

Proto.io - 用Proto.io做手机原型是一个比较好的选择。有默认手机的组件库,拖出来进行简单的属性设置就可以用了。也支持交互设计,支持的触发和动作比较丰富。

Mockplus - Mockplus提供了大量的手机组件和图标,能够快速上手进行设计。设计前可以选择不同尺寸的手机模型,可以通过多种方式在手机上进行预览:发布项目,然后在手机浏览器中查看、手机端输入原型码、扫描二维码。设计手机原型十分快捷。

Fluid - Fluid 是一款在线原型设计工具,比较适合移动App原型的制作,包括iOS,Android以及穿戴设备。

Pixate - 用Pixate可以实现复杂的交互和动画,它也只能用于手机端原型的制作。

Justinmind - 可以自制高保真手机原型。支持复杂的交互、动画和手势。同时也是需要投入较高学习成本的工具。

网页原型工具

这类工具比较适合网页原型的制作。

Axure - 功能全面的原型设计工具,可以实现复杂的交互,需要投入较多的学习时间。

Webflow - 一款可以生成代码的原型设计工具,适合网页原型的制作,中等学校难度。

Webydo - 可以自制高保真网页原型的工具,不过学习难度也很高。

Indigo Studio - 这款工具即可以让你导入设计图进行交互设计,也提供了组件设计的功能。

Protoshare - 中等学习难度的在线原型设计工具,可用于设计具有交互效果的网页原型。

静态原型

这些工具整体来说操作比较简单,功能也比较简单,只能用于设计静态原型。

Fluid - Fluid是一款简单的在线原型设计工具,不能设计交互,可用于静态原型的设计。

Balsamiq Mockups - 手绘风格的原型设计软件,操作简单,初学者可以尝试用来设计静态网页原型。

Mockflow - 一款比较简单的静态原型制作工具。

动态原型工具(组件和页面交互)

这些工具功能比较全面,可以实现或简单或复杂的交互。学习难易程度也因工具而不同。

Axure - 老牌原型工具,能够实现复杂的交互。

Mockplus - 新兴的原型设计工具,Mockplus封装了常用的交互组件,实现了交互的可视化。无论是页面交互还是组件的交互都可以通过拖拽的方式完成。

UXPin - UXpin是一款在线原型设计工具,可用于制作网页和手机原型。自带了组件库,拖出来就可以进行基本的编辑,可实现简单的交互效果。

Proto.io - 一款在线原型设计工具,支持组件的交互。

Framer - Framer是一款基于代码的原型设计工具。如果你懂编程,那么Framer可以帮你实现复杂的动画和交互。

HotGloo - 在线原型设计工具,能够实现常用的交互设计。

Origami - Facebook旗下的一款原型设计工具,可以实现复杂的交互和动画。

Principle - 一款只能用于Mac上的交互设计软件。

Justinmind - 可以自制高保真手机原型。支持复杂的交互、动画和手势。

这么多原型设计工具, 总有一款是你的菜。如有遗漏,欢迎补充。



已有 0 人发表留言,猛击->> 这里<<-参与讨论


ITeye推荐



相关 [原型 设计 工具] 推荐:

网页设计师的新宠,可以触摸的网页原型工具

- 蕗 - 互联网的那点事
电子书再好,还是有很多人喜欢纸质的书本,喜欢那份书香和质感. 很多设计师也一样,他们喜欢可以触摸得到的设计工具. 譬如下面这款用于网页原型设计的草稿本:. 它如同那些可视化的原型设计软件一样,常用元素都给你准备好了,信手拈来,任你摆放. 不同的是,这可是真正的信手拈来. 搭起一个实体的感觉,是对着屏幕画个界面所难以比拟的,这就是所谓的存在感吧.

干货!所有常用的原型设计工具都在这里了

- - ITeye博客
本文列举了20余款当前国内外比较火爆的原型设计工具. 交互原型设计工具(仅限页面交互). 动态原型工具(组件和页面交互). 交互原型设计工具(仅限页面交互). 这一类工具主要是建立页面之间的交互. 其本身不能进行组件的制作和设计,需要从其它地方(例如:PS,本地)导入设计图,对已有的设计图创建热点,进行交互设计.

Google收购iOS原型设计工具开发团队RelativeWave,旗下工具Form将免费

- - 36氪 | 关注互联网创业
iOS应用设计工具开发商RelativeWave刚刚被谷歌收购,而原先售价80美元的Form for Mac设计工具也将免费对用户开放. RelativeWave在官网声明中表示 他们将继续在Google内部开发Form,可能会推出Android版——目前它只支持iOS系统,并且会在Google的帮助下“专注提升设计开发工具的性能.

基于浏览器的页面设计工具Easel帮你快速制作出产品原型页面

- - VooSee - 拮取生活中的彩虹
很多初入互联网的创业者脑子里可能有一大堆的创意,却苦于不会代码和用户界面设计,没有办法快速把这些想法快速呈现出来. 注意到你的这种痛点,推出基于浏览器的所见即所得Web设计工具,帮助你和你的团队快速制作出产品原型页面. Easel最重要的特点是速度和协作,它支持多人同时在线编辑. 虽然与强大的桌面设计软件相比功能并不完善,但Easel提供的工具却也能够帮用户设计出适合桌面、移动或平板浏览的基本站点.

加速原型设计

- - 腾讯ISUX - 社交用户体验设计 - Better Experience Through Design
在实际使用过程中,由于项目具体阶段、平台特性以及输出物展示对象的不同,并没有哪个工具受到设计师们一致认可,每个都有其各自的优势和缺陷,按照个人经验对比了一下常见的几款. 下面,详细介绍一下每一类软件的优劣. Photoshop 作为设计师的看家技能,理论上可以通过它做出任何图形,但对于交互原型来说制作和改动成本略高,图层和组件的处理上比较死板,软件自身性能和模板库也很受挑战,容易过快进入细节讨论而忘记初衷,并非交互稿首选,当然也有设计师一开始就是朝着高保真 Demo 方向做的,用它最直观.

AXURE在原型设计中的应用

- 超群 - 互联网的那点事
产品原型简单的说就是产品设计成形之前的一个简单框架,对网站来讲,就是将页面模块、元素进行粗放式的排版和布局,深入一些,还会加入一些交互性的元素,使其更加具体、形象和生动. 就我个人而言,目前使用频率最多,最高效,交互效果最好的原型工具是axure. 今天给大家介绍一些我在工作中使用axure的经验.

关于原型设计的一些事

- - IT技术博客大学习
标签:   axure   原型设计.    为了讨论方便,有必要先做一个简单的定义.    这里的原型指的是对最终产品各页面上内容的简单呈现,通常不会设置颜色和字体,也不含图片. 这里的原型,也通常被称作线框图、示意图、蓝图. 在一些极端的情况下,原型图往往可以先被抽象成一个个的模块组合,然后再去细化每个模块中的内容极其展示形式.

原型设计:八大指导原则

- - 人人都是产品经理
原型设计没有你想象的那么难. 而且就像其他事情一样,熟能生巧. 但这其中也有陷阱——搞砸原型设计也很容易. 我自己碰到、看到或者听到的大部分错误并不是因为选择了错误的工具或者方法. 对错误的东西进行原型设计. 有效原型设计就是找到平衡并设定期望. 本文会揭示我们开发的有效原型设计八条指导原则. 无论使用什么方式或者工具,这些原则都适用.

30款基本UX工具 - 思维流程工具 & 原型工具

- - CSDN博客Web前端推荐文章
来源: GBin1.com. 现在的开发人员在建造网站时,注重的是布局和技术特性,但是往往忽略了更重要的一点,那就是用户体验. 如 果用户在使用的时候,不能简单清楚的知道该要如何操作,那么他们一定会选择另一个操作简单,浅显易懂的网站或者应用,绝不会在回到这个复杂难解的应用上 来. 一个令人舒服的用户体验,从另一个方面而言,可以让你的网站变得讨喜且令人印象深刻,这样一来,就比其他同类网站赢了一大截.