本文是在protoo .io的帮助下提供给您的
Proto.io是创建完全交互式移动应用程序原型的一种愚蠢而快速的方法。它的用户可以在几分钟内创建高保真的移动原型，外观和工作方式都和真正的应用程序一样。注册并使用Proto。io是免费的。
尽早发现设计问题
我们在头脑中概念化的那些看起来很棒的东西，当我们把它们放在更具体、更视觉的媒介上(比如一张纸或电脑屏幕)时，往往会变成糟糕的想法。
想象一下这种情况:你正在设计一个网页表单。您已经得到了需要包含的输入字段。
你在脑海中想象这个设计。然后，你决定在笔记本上画出草图。在几分钟内，你就能发现你最初设计概念的问题。
也许你可以删去设计的某些部分。也许您意识到应该调整一些输入字段的布局，以创建更好的用户流。也许在输入字段的顶部设置错误验证消息可以使它们更容易被看到。
网页表单的第一张纸草图。
一个简单的原型可以立即暴露我们设计概念中的缺陷。这样，我们就可以在做出更重要的生产承诺(例如创建高保真模型或为设计编码)之前解决这些问题。
更快速地迭代设计概念
创建原型可以让你快速改进设计概念。你可以在几分钟内反复修改和完善你的想法。
让我们回顾一下前面的例子。
我发现我的概念有一些设计问题。现在我可以通过移动和调整一些内容来直观地验证我对这些问题的解决方案是否比我的最初想法更好(或更差)。如果没有，我可以继续画出另一个版本。
第二纸草图的一个网络形式。
快速比较设计变化
用户界面(UI)设计从根本上来说就是为用户创造实现其任务的最优方式。在大多数情况下，为了确定最佳解决方案，您必须想出各种各样的想法。通过原型设计，可以更容易地比较不同的设计。
更好的解决方案是:选项卡式导航菜单还是垂直排列的链接列表?
这个问题唯一确定的答案是:视情况而定。
这取决于内容的信息体系结构。
这取决于用户在使用UI时的目标和主要任务。这取决于链接的数量。这取决于你的链接的措辞。
比较几个想法的一种方法是制作原型。
下面是一个如何快速比较和对比网页布局的例子(我使用Gliffy)：
比较两种网页布局。
更好地收集设计反馈
通过简单地描述你的用户界面想法，其他人可能很难理解你想要达到的目标。这可能会因为误解而导致糟糕的反馈。
然而，有了一个原型，人们可以快速和方便看到你的想法，给了你更大的可能性，他们会更有效地回应。
如果你与开发人员和工程师合作，他们可以告诉你他们是否从自己的角度发现了原型中的任何问题，他们甚至可以根据自己的经验提供替代解决方案。
原型可以是一种演示工具
通常情况下，构建基于web的产品是一个协作的、多人的工作。除了纯粹为了自我实现而创建的个人项目，你很可能会发现自己与客户、员工、同事、用户、涉众等一起工作。
设计概念原型是阐述你的想法并获得上级批准/批准的有效方法。
然而，也有一些设计师认为，向客户展示线框图或低保真度的原型可能会导致混淆。
例如，数字设计机构Imulus的界面设计师Aida Zilic写道，她的公司决定不向客户展示线框图，因为这会导致混淆和其他事情，“最终可能损害项目及其目标”。
最好在展示原型时保持谨慎。有一些高保真的交互式原型工具可能更适合于向客户进行演示。
看看这个例子:
GetLost学生地图是一个交互式的，高保真的移动应用程序原型的演示。
能够尽早进行用户测试
在以用户为中心的设计中，最有价值的反馈来源是用户。
原型可以将用户测试放在项目的开始，而不是项目的末尾。
但要记住的一点是，一个低保真度的原型无法捕捉到成品、润色设计所具有的细微差别。
例如，如果用户在找到他们需要点击的网页按钮时遇到了问题，这可能是因为视觉重量在低保真度的原型中还没有正确地表示按钮。
然而，我认为可以肯定地说，在原型上进行用户测试可以有效地解决广泛的可用性问题，如用户流、内容分类等。
原型鼓励协作
正如我所说，构建基于网络的产品很可能需要几个人的参与。原型可以让所有人尽早参与到过程中。
你的客户和雇主可以大致了解你要为他们做什么，他们可以在你做出需要大量时间修改的重大承诺之前给你反馈和决定。
在设计完成之前，您的团队成员可以提供反馈并分享他们的担忧。
设计变得越来越复杂
用户界面设计师面临的挑战是，如何设计出能够被人们以多种方式看待的产品。
我们需要解释大部分(如果没有的话)所有)的观看场景类型:桌面显示器，笔记本电脑屏幕，智能手机，平板电脑，等等。
响应网页设计是在不同观看媒介下实现最佳布局的方法之一。
但它也增加了编码和网页布局的复杂性。我们需要知道网页的不同组件在尺寸上是如何变化的，以及如果我们在iPhone和宽屏显示器上浏览网页，它们会在哪里移动。我们可以通过原型来解决这些问题。
在不同的观看场景下快速创建网页布局的示例。(原型创建使用wireframe.cc)。
原型让你有更多的机会同时工作
通过创建原型，你的团队成员可以开始处理UI的某些组件，即使设计还没有完善。
例如，如果应用程序需要向用户报告信息，服务器端程序员可以开始创建数据库以及数据库查询，从而提取所需的数据——甚至在最终确定UI之前。
一个允许并发工作的基本线框的例子。
原型给你一个成品的视觉指南
当你对最终结果(大致)的样子有一个坚实的概念时，制作东西就容易得多了。
当目标清晰明确，当每个参与的人都同意预期的结果，当设计概念在早期得到验证时，你会发现通向终点的道路会更加直接。
原型甚至可以成为最终产品的重要起点。
有些工具允许您创建可以转换为HTML/CSS代码的原型。尽管我不建议你在没有(至少)专业且有经验的前端web开发人员审查的情况下使用任何软件的自动生成代码，但它们可能被用作起点。
原型制作是廉价、快速和简单的
也许你应该创建设计原型的最明显的原因是几乎没有理由不这么做。
它与大多数设计过程无缝集成。可以肯定地说，所有UI设计师都是从某种形式的原型开始的——即使它只是在30秒内完成的纸上草图。
有很多工具可以很容易地集成到你现有的设计过程中——从已经使用了几个世纪的纸笔组合，到在浏览器中运行的网络工具。
其他关于原型的文章
- UI原型的艺术(scottberkun.com)
- 快速原型设计更快更好(www.smashingmagazine.com)
- 纸上原型(www.alistapart.com)
- 在代码中绘制草图:原型的魔力(www.alistapart.com)
- 网站线框图的终极指南(sixrevisions.com)
设计原型的其他好处是什么?
- 我错过了什么好处?
- 关于原型如何帮助你完成一个特定项目，你是否有过相关的故事?
- 你为什么要设计原型?
请在评论中分享你的观点!
