主流原型设计工具

Posted 2023-05-23 koy-newnew

1.Axure是一款功能强大的原型设计工具，它被广泛用于用户体验（UX）和用户界面（UI）设计领域。Axure可以帮助设计师和团队快速创建高保真度的交互原型，以便评估和改进产品设计。

Axure具有以下主要功能：

1. 原型设计：Axure提供了丰富的UI组件库和交互元素，设计师可以使用这些组件来构建界面原型。它支持拖放式的操作，轻松创建页面布局和设计交互效果。

2. 交互设计：Axure允许设计师创建各种交互效果，如页面切换、弹出窗口、滚动效果等。通过添加条件、动画和触发事件，设计师可以模拟用户与产品的交互过程。

3. 数据驱动：Axure支持使用变量和数据集来模拟真实的数据交互。设计师可以创建动态的原型，演示不同数据状态下的界面效果，以帮助用户理解产品的功能和交互方式。

4. 团队协作：Axure支持多人协作，设计师可以共享原型文件、注释和反馈，以促进团队之间的沟通和合作。此外，Axure还提供版本控制功能，方便团队进行版本管理和迭代。

举例说明：

假设你正在设计一个电子商务网站的注册流程。你可以使用Axure创建一个包含多个页面的原型，其中包括注册表单、验证步骤和成功提示等。

首先，你可以使用Axure的UI组件库拖放创建一个注册页面的基本布局，包括用户名、密码和确认密码等输入字段。

接下来，你可以为输入字段添加验证规则和交互效果。例如，当用户输入密码时，你可以通过添加条件，实时检查密码强度，并在不符合要求时显示相应的提示信息。

然后，你可以创建一个模拟的验证步骤，模拟用户接收验证码并输入的过程。通过添加触发事件和动画效果，你可以模拟用户接收验证码的等待时间和输入过程。

最后，在用户成功完成注册流程后，你可以添加一个成功提示页面，展示注册成功的信息，并提供登录链接或其他操作选项。

通过Axure，你可以将这些页面连接起来，创建一个交互流程，并模拟用户与网站的实际交互体验。你还可以分享原型链接给项目团队或客户，收集他们的反馈意见，以便进一步改进设计。

总而言之，Axure是一款功能强大的原型设计工具，能够帮助设计师创建高保真度的交互

原型，并促进团队协作和用户反馈。它在用户体验设计和界面设计中扮演着重要的角色。

2. OmniGraffle:
OmniGraffle是一款流程图、线框图和图表设计工具，常用于信息架构、用户流程和界面设计。它提供了丰富的绘图工具和预设模板，可以快速创建各种图形和图表，帮助设计师表达和传达复杂的设计概念。

举例说明：假设你正在设计一个移动应用的用户界面。你可以使用OmniGraffle创建一个应用程序的线框图，包括主屏幕、导航菜单和各种界面元素。你可以使用OmniGraffle的绘图工具绘制按钮、文本框和图标，并使用线条和箭头表示页面之间的导航关系。通过OmniGraffle的布局工具，你可以调整元素的位置和大小，创建清晰的用户界面设计图。

3. Quartz Composer:
Quartz Composer是苹果公司开发的一款视觉编程工具，用于创建动态图形、数据可视化和交互式效果。它基于图形节点和连接线的可视化编程模型，设计师可以通过拖放和连接节点来创建复杂的动画和特效。

举例说明：假设你正在设计一个展示活动的网站，并需要一个动态的背景效果。你可以使用Quartz Composer创建一个背景特效，比如流动的色彩渐变或动态的粒子效果。通过将不同的图形节点连接起来，并设置参数和动画效果，你可以实现各种独特的视觉效果。最后，将Quartz Composer生成的动态特效嵌入到网站中，使用户在访问页面时能够欣赏到精彩的背景动画。

4. Liveview:
Liveview是一款用于原型交互演示的应用程序，它允许设计师将设计原型实时投射到移动设备上，以便在实际设备上演示和测试交互效果。通过Wi-Fi或USB连接，设计师可以在设计工具中进行调试和修改，同时在移动设备上查看和操作实时更新的原型。

举例说明：假设你正在设计一个移动应用的用户界面，并想要测试交互效果。你可以使用Liveview将设计原型实时投射到手机或平板电脑上，然后通过模拟用户的操作，观察和评估交互体验。例如，你可以点击按钮、滑动页面或填写表单，以测试界面的响应性和用户友好性。通过实时预览和交互测试，你可以及时发现和解决设计中的问题，并提供更好的用户体验。

5. Icon Stricker:
Icon Stricker是一款用于创建和

编辑图标的应用程序。它提供了各种绘图工具和图标库，使设计师能够轻松绘制、编辑和导出高质量的图标。

举例说明：假设你需要为一个新的移动应用设计图标。你可以使用Icon Stricker打开一个空白画布，然后使用绘图工具创建一个独特的图标形状。你可以选择不同的颜色、线条粗细和填充效果，以使图标与应用的风格和主题相匹配。此外，Icon Stricker还提供了预设的图标库，你可以选择合适的图标模板，并对其进行编辑和定制。最后，你可以将设计好的图标导出为标准的图像文件，如PNG或SVG格式，以便在应用中使用。

主流原型设计工具及其优缺点

          主流原型设计工具及其优缺点

我所查到的主流原型设计工具主要有五款，分别是Axure、Balsamiq Mockups、墨刀、Justinmind和iClap。

1. 第一款我要介绍的就是Axure RP，它是美国Axure Software Solution公司旗舰产品，是一个专业的快速原型设计工具，让负责定义需求和规格、设计功能和界面的专家能够快速创建应用软件或Web网站的线框图、流程图、原型和规格说明文档。作为专门的原型设计工具，它比一般创建静态原型的工具如Visio、Omnigraffle、Illustrator、Photoshop、Dreamweaver、Visual Studio、FireWorks要快速、高效。

功能：用于制作快速原型的软件。也可以绘制中保真原型草图。

应用人群：产品经理、交互设计师、UI设计师、网页设计师。

原型分类：低保真（手绘草图）、中保真（使用相关软件绘制出来的）、高保真（包含效果图及原型交互）

优点：

应用灵活，可拓展性强，拥有超级强大的交互制作能力。

高保真的原型设计工具，名声大，专业性高。

缺点：

规范性较差。编辑能力着实强大，变相导致规范性差，管理不便。

难度稍大，入门较慢。鉴于其比较复杂，学习难度较大，新手劝退。

本地型软件，可以下载html文档预览，手机预览不方便。

制作原型的速度比较慢（交互操作太多），常常耽误时间，而且修改较繁琐。

2.Balsamiq

   Balsamiq Mockups出自加利福尼亚州的Balsamiq工作室，创始人Peldi在 2008年6月推出了这款手绘风格的产品原型设计工具，并广受好评。在Web产品设计中，Balsamiq Mockups是产品设计师绘制线框图或产品原型界面的利器。在产品设计的需求阶段，低保真的线框图或者草图设计介于产品流程设计与高保真DEMO设计之间，在Balsamiq Mockups出现之前，流程图可以使用Visio，高保真DEMO可以使用Axure，但并没有好用的草图设计工具；在产品设计管理中，我们通常在产品的业务流程和数据流转已经相当明确时才开始进一步考虑产品的结构层和框架层，虽然此时纸、笔、白板都是非常简单方便的交流工具，但是他们的最大劣势就是——很难将有价值的原型保存下来。Balsamiq Mockups的出现完美的解决了这个问题。

优点和特色：

易用：UI控件支持自动拖拽，并且可以实现自动对齐；

美观：手绘风格，简约清爽；

丰富：从按钮到输入框，从导航条到页面、表格，甚至包括了最潮的Iphone元素；

方便：对元素的修改除了工具栏外，还可以使用隐藏编辑框，支持快捷键；

兼容：可使用XML语言保存元素，也可以导出PNG图片，可以插入到任何项目；

跨平台：Windows、Mac OS、Linux下都可以使用，还有能集成在Confluence，JIRA，和XWiki中的版本，如果没下载桌面版，还可以直接使用网页版的Balsamiq Mockups。

应用范围： Balsamiq Mockups最好用于商用web产品设计中的低保真线框图或者草图设计，相对于纸和笔，它不够灵活；相对于Axure，它不够精确。

基本使用方法：

窗口中间是画布，上方是工具栏（支持拖拽和快捷搜索工具），左侧是在不同的画布间进行切换，右边是显示和调整选中控件的参数。

3.墨刀

墨刀是一款在线原型设计与协同工具，借助墨刀，产品经理、设计师、开发、销售、运营及创业者等用户群体，能够搭建为产品原型，演示项目效果。

适用平台：浏览器注册使用， Windows、Mac 桌面客户端，同时支持 iOS、Android 端预览；

适用范围：墨刀为企业级用户提供权限控制、项目管理及基础项目数据统计等功能。

功能介绍：

操作简单：简单拖拽和设置，即可将想法、创意变成产品原型。

演示：真机设备边框、沉浸感全屏、离线模式等多种演示模式，项目演示效果逼真。

团队协作：与同事共同编辑原型，效率提升；一键分享发送给别人，分享便捷；还可在原型上打点、评论，收集反馈意见，高效协作。

交互简单：简单拖拽就可实现页面跳转，还可通过交互面板实现复杂交互，多种手势和转场效果，可以实现一个媲美真实产品体验的原型。

自动标注及切图：将 Sketch 设计稿墨刀插件上传至墨刀，将项目链接分享给开发人员，无需登录可直接获取到每个元素宽高、间距、字体颜色等信息，支持一键下载多倍率切图。

素材库：内置丰富的行业素材库，也可创建自己的素材库、共享团队组件库，高频素材直接复用。

优点：

非常容易做交互，操作简单，效率极高，适合初学者。

界面优美整洁。简洁的界面在一定程度上有助于提高开发人员的效率。

强大的演示能力。墨刀在轻量级的移动端原型制作更加迅速，展示更加方便。

分享方便。反馈及时。墨刀不仅上手快，还可以快速分享，快速查看应用在手机上的效果。反馈回复很及时，产品改进速度也很快。

缺点：

应用局限性。墨刀专注于app原型设计,在后台和网页稍有乏力。

需要收费。墨刀本地下载功能需要注册购买，无法直接分享给他人。

归档能力不足。墨刀更倾向于链接、二维码形式输出，不能以文档输出

4.Justinmind

 

Justinmind是由西班牙JustinMind公司出品的原型制作工具，可以输出Html页面。

JustinMind的一些特性：

使用JustinMind，你可以在几分钟内利用其广泛的组件和交互绘制高保真原型。它提供了一些基本的形状，如矩形和文本，还有特定的组件，如菜单，表单或数据列表。

关于手势的交互效果：JustinMind提供了多种触屏的交互效果，例如滑动、缩放、旋转，甚至捕捉设备方向等等。在需要产生效果的部件中选择对应的手势即可。

可以创建自己的组件库，JustinMind为iPhone ，iPad，黑莓，Android提供了多样的组件。你可以创建自定义组件库，方法是将排列好的单个组件放在一起，并将它们集体框选拖动到组件库。

更为便捷的定义样式：相比Axure，JustinMind更好的提供了属性窗口，并且更好的支持捕获PS等软件的图像属性。

JustinMind可以导出原型的所有信息到Microsoft Word，能够一键生成及其规范的文档。

共享原型进行测试：JustinMind支持将原型上传到服务器并提供给他人进行测试，为产品的改进做出了良好的贡献。最为特别的是，基于usernote的服务允许你将原型放到移动设备上进行测试。

更友好的定义交互方式：在JustinMind中，你可以通过拖拽等方式来实现跳转、定向等交互效果，无需像Axure一样每一步都只能通过点击来完成。并且显示更为直观，如进度条。

同时可以通过一些简单的无代码逻辑语句实现更为高级的交互效果。

全球范围内的复用、数据共享。每一个模板都让这一套组件有不同的视觉风格，变量允许将数据从一个屏幕迁移到另一个，甚至使用它们来检查是否满足条件。

5.iClap

iClap是一个以产品为基础，集成员工日常所需工具，打通项目工作流程，实现员工自我工作管理、项目管理和企业管理三个体系协同的管理规范系统。iCLap，以产品自身为出发点，通过不同职位的准数工具彻底串联企业人员，再将工作产生的内容进行沉淀、处理、归档、共享，打造一个沟通与协作的闭环，以实现对产品，项目以及企业的规范化运营管理。

iClap的主要功能：

在线批注：APP运行中直接将批注生成任务，处理任务时将场景还原，直观高效。

语音任务：将语音精确转换为任务，自动识别任务紧急程度与对接人。

即点即用：多个APP项目同一客户端管理，无需逐一下载。

简单发布：版本升级只需后台上传一次数据，客户端自动更新。

Bug跟踪：自动检测APP漏洞并生成报告，让bug无可遁形。

插件管理：多元化模块插件管理，满足企业多方面需求。

会议纪要：项目组进行实时、群组沟通，自动生成会议纪要。

人才培养：以DevStore为平台提供技能培养，智能匹配发送给各岗位人员，有效提高人员综合素质。