原型是即将推出的移动应用程序的真实交互模型。它们有助于验证想法并防止团队实施无用的功能或产品。
如果您的客户不了解原型设计的价值,请填写移动应用使用统计数据:28% 的用户在下载后的第一周内卸载应用。此外,21% 的应用在前 6 个月内仅使用一次。
如果你及早了解你的听众,这场灾难是可以避免的。卸载应用程序的最常见原因包括重复错误、令人困惑的用户界面、不必要的功能、不良的入门、隐私问题等。原型和线框图是确保您的应用程序弥补这些差距的最佳工具。
原型比线框图更精细,包含更多的视觉元素和交互组件。因此,它们通常出现在设计过程的后期阶段,代表应用程序的预开发。

什么是原型
术语“线框”和“原型”经常被混淆和互换使用。事实上,它们是不同的东西,在产品设计过程中扮演着独特的角色。
线框和原型之间的主要区别在于它们的保真度。线框通常是低保真到中等保真度的模型,而原型通常类似于最终产品。但是,设计和功能也存在差异:
• 线框给出了页面布局和层次结构的一般概念,而原型通常是交互式的,旨在展示产品的工作原理。
• 线框通常使用灰度调色板,或者有时可能会使用飞溅的颜色来强调元素。在早期阶段,线框图可能会使用 lorem ipsum,以便参与测试的团队和用户只关注功能和结构而不会分心。原型通常具有颜色、字体、图像、动画和实际内容。
• 您可以使用 Balsamiq、Invision Freehand 之类的工具,甚至可以使用笔和纸来绘制线框。然而,原型制作需要设计技能,并且应该使用 Figma、Sketch、InVision 或 Justinmind 等软件来实现。
原型比线框图更具说明性,可以提供对用户需求的有用见解。

原型设计的好处
有时,团队会跳过原型设计阶段并开始开发 MVP 以节省时间和精力。在这样做的过程中,他们花费了更多的时间和精力来实施一个没有经过适当测试并且没有收到足够用户反馈的产品。原型设计有助于防止此类代价高昂的错误。
在您的设计过程中包含原型制作还有哪些其他好处?
• 与线框图不同,原型更昂贵,需要更多的时间和精力投入。这就是为什么线框图应该放在首位,这样您就可以在将设计提供给开发人员之前测试所有想法和假设。
• 原型(尤其是高保真原型)类似于真实产品,并且比枯燥的线框更具吸引力和交互性。他们激励用户提供更多关于他们的移动体验的想法和想法。
• 原型设计涉及所有团队成员,包括高层管理人员。这可确保最终产品满足产品和营销目标,并且不会与用户的需求或技术要求相矛盾。
• 原型展示了最终产品的外观以及将包含哪些功能和交互。它提供了进行最终更新以改善视觉或功能问题的机会。
• 原型的交互性对于测试移动产品至关重要。用户不仅可以查看应用程序的结构,还可以测试移动设备的典型手势和功能。

低保真原型
原型的保真度在交互性、视觉效果、内容、命令和其他方面会有所不同。 低保真原型 不太详细,交互性较差,可以用笔和纸创建。
这听起来很像低保真线框,不是吗?实际上,这些类型的模型经常重叠,两者都更侧重于表示层次结构、页面结构和布局。
然而,低保真线框仍然是灰度模型,由图像和文本占位符和框组成,而低保真原型包含更多的视觉效果和交互。
例如,设计师经常拍摄手绘线框的照片,将它们上传到 MarvelApp、UXPin 或 InVision 等特殊的数字原型工具中,并通过创建热点将它们相互链接。对于最终用户来说,低保真原型比线框更容易测试。

高保真原型
高保真原型包含必要的设计资产和组件,并且非常具有交互性和功能性。它们通常在后期出现,对测试可用性非常有帮助。
低保真原型可能很容易创建,但高保真原型由于与真实应用程序高度相似,可以帮助用户表现得更自然,在测试过程中感觉更放松。因此,用户提供了更有价值的反馈。
此外,高保真原型允许对组件、导航甚至用户参与度进行更深入的评估——这些是您无法用纸质线框测试的。
使用现代原型制作工具,您可以创建高度交互的原型,模拟移动应用程序中的体验,而无需编码技能!此外,高保真原型非常漂亮,让利益相关者清楚地了解应用程序发布后的外观。

你应该做多少原型?
如果您决定为应用程序的每个方面创建一个屏幕, 即使是低保真原型也可能需要时间和精力。保持智能 ,从您最不确定或最需要测试的关键页面或复杂功能开始。
如果您假设某些功能是标准的并且符合通用设计模式,请跳过它们并继续进行不太常见或更具挑战性的部分,例如结帐流程或付款选项的管理

原型制作工具
有多种原型制作工具可供使用,让您可以找到适合您特定需求的一种。选择原型制作工具时应该注意什么?
设计模式
如果您想节省时间或没有设计技能,请确保该工具具有良好的设计模式库(例如,导航元素、表单、菜单、按钮、产品页面、日历选择器等)。
交互式组件
要构建高保真原型,该工具应允许您创建高级过渡、动画和叠加。
学习曲线低
该工具应该直观、简单,并且不需要太多的努力或时间来学习。
测试和演示功能
向客户展示原型或与可用性测试参与者共享它们应该很容易。
代码特征
在一些团队中,开发人员负责准备原型,使用条件逻辑和变量的能力可能是一个不错的功能。另外,它允许更复杂和交互式的原型。
多平台支持
仅在一个平台上测试您的应用程序可能会在您未测试的设备上导致大量错误和可用性问题。因此,请确保该工具允许您跨多个平台测试您的原型。

迭代原型
你失败的越快,你就能越快地改进你的原型并朝着最终产品迈进。避免依附于你的原型并花费太多时间来完善它们——相反,更频繁地测试它们并准备好进行多次修复。
原型不应花费设计师几个月的时间来构建、测试、改进和再次测试。快速或迭代原型设计 意味着在进一步进入流程之前测试您的假设,保留好的想法,并丢弃不适合的想法。请记住,您拒绝的想法并不是坏想法——它们只是对您的用户和您的产品不起作用。
在进行原型设计时,要么关注核心功能和特性,要么关注用户可能不熟悉并且在其他地方没有遇到过的新颖交互和模式。

使用原型进行测试
原型设计的主要目标是测试。在早期阶段,团队成员会花费数小时进行头脑风暴并提供想法。线框和原型可以帮助设计师过滤这些想法和假设,以选择最好的想法和假设,并摆脱那些不起作用或不符合用户期望的想法和假设。
可用性研究使我们能够测试可访问性、交互、导航选择、布局和整体用户体验。此外,一些原型工具允许您在多个设备上测试它们。如果您为大量受众设计了应用程序,这一点至关重要。

向利益相关者展示
移动应用程序原型(主要是中保真或高保真)非常适合向利益相关者(客户、高层管理人员或投资者)展示概念和设计理念。由于高度可视化和交互性,这些原型展示了最终产品的外观,还可以帮助初创公司赢得早期资金。
在谈论产品功能和特性时,您可能会与您的团队成员使用相同的语言,但利益相关者并不了解您的产品的来龙去脉。因此,仅向他们发送指向您的原型的链接并期望他们轻松理解您的所有想法是不够的。
安排演示文稿并引导利益相关者浏览应用程序,解释您的设计决策并用用户研究结果和见解支持他们。
此时,您可能希望以更好的方式展示您的项目,因此请花时间完善您的原型,使它们看起来更美观。
以上内容为转载
网友评论