为什么要使用原型工具？
俗话说：“一个原型值得一千次会议”。原型为您提供了试验想法并将其转变为可以测试和建立的有形东西的机会。由于设计师必须设计客户描述给他们的东西，因此并不是所有人都真正了解需求的真正含义。随之而来的是一系列会议，电子邮件等，以达到其最终设计的目的，这很麻烦。所有这些问题都可以通过使用原型工具来克服。
原型工具使设计人员和客户可以在相同的环境中更好地协作，而不会出现观点冲突。客户可以直观地了解实际要做的事情。它可以帮助团队建立理解，探索在构建和测试某些东西时才可见的选项和障碍。
原型工具的最大好处是风险，我们越早失败，我们就会越快学会。当您的模型失败时，您可以轻松着陆-总是有机会验证有效，迭代和改进的事物。否则，一旦我们以错误的坐标开始乘船航行，我们将永远不会到达海岸。
我们如何使用原型工具？
我们相信 通过用户体验推动客户参与 很重要准备应用程序的模型或线框会浪费我们设计人员的大量时间，还会与客户产生很多来回关系，这可能会损害我们与客户之间的关系。
马鲁蒂技术实验室的我们正在使用原型工具来摆脱与设计相关的数百个问题。它有助于我们 设计师将创意变为现实 这样我们就能为客户提供交互式原型。我们将这些概念付诸实践，并帮助他们了解他们的想法将如何形成。
以来 用户体验是品牌塑造的强大指标 我们经常使用原型工具向客户展示他们要求的产品模型的不同迭代。它使我们的UI / UX设计师可以生成“概念证明”，这可能是开发人员与其客户之间的商业关系的关键因素。
如何选择合适的原型制作工具？
选择正确的工具是描述您的想法并与客户更好地合作的关键。拥有如此众多的在线原型制作工具，选择合适的工具并非易事。每个工具都彼此不同，因为它缺乏或具有新功能以使其与众不同。
为了选择合适的原型设计工具，有一个 几个需要评估的因素 该工具可以检查其是否符合我们的需求。
1.学习曲线：
首先，我们必须分析该工具采用起来有多容易。我们将其称为学习曲线，即设计师掌握工具所需的时间。由于所有工具都彼此不同，并且提供各种功能，因此设计人员学习该工具将花费大量时间。
2.分享：
由于协作是设计的关键，因此我们检查团队协作的适用性。该工具应提供协作能力，以使多个人彼此同步。由于每个设计师对项目都有自己的观点/想法，因此必须将所有人都放在同一页面上。
3.用法：
选择原型工具时要考虑的另一点是，它与您的设计过程以及您经常使用的其他工具的适合程度。例如，如果您是在Photoshop，Illustrator或Sketch中进行设计，那么您的原型制作软件可以直接使用这些应用程序生成的文件，而无需您单独导出资产，然后从头开始构建所有内容以创建交互，那将是很好的选择。
4.易于使用和舒适：
使用原型工具的易用性对于设计人员节省时间和帮助增加产量至关重要。它应该减少设计人员完成任务所需的步骤数量，而不是增加任务数量。
5.费用：
那里有许多原型制作工具，其中许多具有利基功能。但是这些工具有一个问题，那就是它们不适合我们的预算。因此，我们在选择工具时应该小心，不要被功能所蒙蔽。
6.保真度：
原型的要求是什么？您是否只需要应用布局的模型，还是需要支持更多细节和复杂交互的功能？对于项目可以有不同的要求，可以分为低保真度，中保真度和高保真度。 低保真度 就是说我们只想测试一下这个想法。另一方面， 中等保真度 当我们专注于布局，信息和交互设计时。最后， 高保真度 最重要的事情是视觉设计，动画和微交互。
让我们看一下UX的前11种原型制作工具：
1. 视觉:
成本：
- 单个项目–免费
- 3个项目（入门）–每月$ 15
- 无限项目（专业）–每月25美元
运行：
- 网页
原型：
- 安卓
- 的iOS
- 网页
迄今为止，Invision是世界上最受欢迎的原型制作工具。他们的团队不断增加新功能，以帮助设计师更有效地进行原型设计。通过InVision的项目管理页面，您可以将设计组件组织到状态工作流程中。您可以为“待办事项”，“进行中”，“需求审查”和“已批准”设置列，并将设计组件拖放到适当的列中。您可以向静态图像添加交互和动画。您可以上传多种文件类型，包括JPG，PNG，GIF，AI和PSD。它具有与Slack，Dropbox，Box，Trello，JIRA等应用程序的推拉集成。
它简化了我们工作流程的各个方面以及设计与开发之间的协作。人们可以实时地更好，更快，更协作地进行设计，并且它是浏览器内的设计协作和演示工具。无缝启动会议并与客户进行有指导的参观，并向利益相关者展示设计。许多独角兽都使用此原型设计工具满足我们的UI / UX需求，例如Uber，Salesforce，Twitter，Linkedin等，这证明该工具是原型制作的最佳工具。
2. Adobe Experience设计:
成本：
- 自由
运行：
- OS X
- 视窗
- 安卓
- 的iOS
原型：
- 全部
使用Adobe XD，您可以在同一应用程序中绘制，重用和重新混合矢量并生成图稿，以创建线框，屏幕布局，交互式原型和可投入生产的资产。我们可以在应用程序内轻松地从设计切换到原型。另外，添加交互和过渡并与队友和利益相关者共享以测试设计的外观。Adobe的产品允许与Photoshop和After Effects的几种产品集成，这是一个很大的优势。
只需从Adobe的工具中导入文件即可轻松提高设计效率。当您直接共享时，客户可以在原型上发表评论，并在实际设备上实时查看设计。
3. 折纸工作室:
成本：
- 自由
运行：
- OS X
原型：
- 安卓
- 的iOS
折纸最初是由Facebook创建的，旨在帮助团队构建和设计产品。借助此原型工具，我们可以使用Origami Live在移动设备上实时预览模型。此外，我们可以在许多不同的设备上以全屏演示的形式展示我们的设计，草图和Photoshop设计可以导入到折纸中，并且您的项目层将被保留，可以根据需要进行链接，动画和转换。
您还可以一键导出原型组件（包括动画），因此工程师可以将其复制并粘贴到项目中。但是，最严峻的缺点之一是缺少协作功能。评论和查看版本历史的方式很少。这种原型工具似乎更适合刚开始从事这项业务的自由职业者或个人。
4. 草图:
成本：
- 免费试用
- 完整版$ 99
运行：
- OS X
原型：
- OS X
- 的iOS
- 网页
网页Sketch在许多方面类似于Photoshop，允许您编辑和处理照片。 Sketch的Vector形状可轻松适应不断变化的样式，大小和布局，从而避免了很多麻烦的手动操作。 Sketch的完全基于矢量的工作流程使从头到尾轻松创建精美，高质量的艺术品成为可能。在UI设计中，重复元素非常常见：按钮，条形图，气泡……各种各样的东西；这些可重复使用的元素可以使用素描应用自动复制和粘贴。
5. 阿克斯雷:
成本：
- 30天试用版-免费
- 专业版–每月$ 29 /美元（可购买$ 495）
- 团队–每月$ 49（每位用户购买$ 895）
- 企业版（包括本地解决方案）–每月$ 99
运行：
- OS X
- 视窗
原型：
- 所有操作系统
阿克斯雷无需编码即可提供强大的原型制作。它提供以下功能：
–用于提供悬停功能的动态内容（如果存在）。
–用于检查条件的条件流语句
–数学功能，例如添加或从购物车中删除以反映金额
–数据驱动的排序
–用于根据屏幕尺寸调整屏幕大小的自适应视图
–也可以提供原型动画。
只需单击一个按钮，也可以非常轻松地共享供您的团队或客户查看的原型。此外，Axure RP还将在云端或本地将您的图表和原型发布到Axure Share。只需发送链接（和密码），其他人就可以在浏览器中查看您的项目。
6. 网络流:
成本：
- 2个非托管项目–免费
- 个人-每月$ 16
- 专业版–每月$ 35美元
运行：
- 网页
原型：
- 全部
网络流的主要卖点是，它无需编写一行代码即可提供如此强大的功能。 Webflow专注于Web动画，交互和响应式Web设计。尽管您只能使用基于视觉的UI来构建，设计和发布整个网站。按照自己的喜好优化UI原型后，只需单击即可将其转换为可投入生产的网站。这些功能吸引了独立的设计师，他们现在可以选择导出原型而无需开发人员。
您可以使用Webflow托管原型，也可以使用干净的HTML，CSS和JavaScript导出代码。您也可以从空白画布开始，然后在数百种准备就绪的Webflow模板中选择一种。
7. 成帧器:
成本：
- 免费试用（14天）
- $ 15 /月
- $ 159 /年
运行：
- OS X
- 的iOS
- 安卓
- 视窗 10移动版
原型：
- 全部
成帧器是最流行的原型制作工具之一。它基于这样的前提，即只要有了代码，就可以对任何东西进行原型设计，从而产生新颖美观的设计。它提供了一个无缝的工作流程，并通过设备预览，版本控制和轻松共享进一步完善。如果您不了解，Framer的文档结构非常好。另外，还有很多有关UX原型制作工具的有关Udemy和O’Reilly的方法视频和课程。它提供了有关如何灵活灵活地编写代码的第一手资料。
与其他工具一样，Framer支持Sketch，Photoshop项目，并且还将保留您设计的图层。此外，Framer的Mac App设计精良，可以在您编写代码时提供实时预览，这对于那些为该代码编写代码的人来说是鼓舞人心的第一次。您也可以直接从Sketch，Photoshop或Figma导入图形。
8. 原子:
成本：
- 免费– 1个原型（30天）
- $ 19 –无限原型（1个用户）
- $ 39 –无限原型（10个用户）
- $ 59 –无限原型（无限用户）
运行：
- 网页
原型：
- 全部
原子是基于网络的工具，需要Google Chrome。由于它没有桌面应用程序，因此对于使用Firefox，Safari或任何其他浏览器的开发人员来说是一个缺点。它为您提供了微调交互所需的灵活性和控制力：只需单击“播放”按钮即可查看您所做的更改和动画效果。Atomic通过提供易于共享的原型开发系统，可轻松访问所有开发人员。
因此，无需下载任何用于协作的应用程序。该工具的最佳功能是历史记录选项，它使您可以后退以查看以前的迭代并从任何位置创建新版本。
9. 原则:
成本：
- 免费试用
- 完整版$ 129
运行：
- OS X
原型：
- 的iOS
- OS X
- 观看操作系统
原则是为OS X构建的，并带有一个iOS应用程序以镜像实时原型。无论您是设计多屏应用程序的流程，还是设计新的交互和动画，Principle都可以使您创建外观令人惊叹的设计。该应用程序看起来非常类似于Sketch的UI，包括对齐，画板创建和屏幕连接等其他熟悉的方面，以及实时预览。您也可以在iOS设备上镜像设计。
虽然Principle不提供团队协作功能，但此缺点可能会因其脱机功能而被掩盖。由于您不必依赖可能不可靠或缓慢的连接，因此提高速度进一步突出了脱机工作的灵活性。
10. 请记住:
成本：
- $ 19 /月
运行：
- OS X
- 视窗
原型：
- 网页
- 的iOS
- 安卓
另一个流行的原型制作工具JustInMind以创建高质量作品而闻名，尽管成本很高。另一个很大的优点是，可以将其下载到计算机上以便在任何地方进行脱机工作。如果您是此工具的新手，则它随附了教程和指导视频，供从初学者到专家的每个人使用。将您的原型导出为功能全面的HTML文档，并使其可随时在任何网络浏览器中查看。此外，它还提供访问UI库中的项的用途以及下载大量加载项的权限。
11. Balsamiq样机:
成本：
- 30天免费试用
- 网络应用–每月12美元
- 单用户– $ 89
- 批量许可–因用户数而异
运行：
- 网页
- OS X
- 视窗
原型：
- 网页
- 的iOS
- 安卓
我们将使用另一个功能强大的原型工具“ Balsamiq Mockups”结束列表。它复制了在纸上（但在数字媒体上）创建模型的速度和便利性。设计人员可以从500多种预制的图标和项目中进行选择，也可以从自己绘制的组件中进行选择。交互是基本的，最终的低保真原型感觉更像是交互式的高保真线框。
如果您是“ UX新手”，则此工具非常易用，因为它非常易于使用。 Balsamiq的最佳选择是UX构思阶段。它为原型提供了非常好的原型粗略草图供客户查看，这对于集思广益的会议来说是一大优势。采用非常简单快捷的键盘快捷键，以提高用户的工作效率和创建模型的速度。凭借其所有低保真功能，我们可以将其更多地视为线框图工具，而不是原型工具。如果您不是专业设计师，并且正在寻找一种工具来创建简单且静态的线框，则可以使用Balsamiq。
综上所述， 这些原型工具各自具有自己的特殊优势并适合不同的需求。诚然，我们没有为UI / UX设计人员提供许多其他原型设计工具。还有很多其他工具以及 参考网站设计 那里，大多数具有与上述原型工具中提到的功能相同的功能。值得一提的是Moqups，UXPin，纸上原型，Proto.io和Flinto 与上述相比，它们具有一些独特的功能和易用性。
我们来自纸质模型制作并向客户展示的时代，如今，随着技术的飞跃，我们能够做得更多。超越技术的界限，未来将进一步显示出不仅在UX原型制造领域中的增强，而且在整体设计上的增强。现在，借助这些工具，设计变得不再那么忙碌，节省了数千小时的生产力。
继续阅读
寻找免费咨询吗？让我们连接。我们很乐意听取您的意见。
联系我们
