人类是高度视觉化的动物,我们的大脑皮层 30% 所有区域都作用于视觉处理,所以当你看到一个好的交互原型时,它可以更快、更直观、更有效地展示产品的形式。

在 UX/UI 在设计过程中,我们将使用各种原型工具,然后设计大量的线框图。从某种意义上说,线框图相当于UI界面说明书。在真实的设计项目中,线框图的制作是为了设计和研发,所以线框图需要足够清晰,易于理解和传达。
然而,在某些情况下,您可以选择完全跳过线框设计阶段。在项目的早期阶段,以高保真的方式处理视觉或交互可以为整个项目过程节省大量时间。高保真当原型测试给团队或利益相关者时,不仅可以测试产品的功能交互,还可以评估产品的视觉感受。
以下是为什么线框图有时会出现问题,何时可以跳过这一步,以及如何适应无线框图设计的过程。
线框图问题
第一,线框图太抽象了
设计过程通常从研究问题开始。桌面研究、用户访谈等只是为了对问题有更深入的了解。经过研究,你可以开始发散一些想法和概念,以帮助找到最好的解决方案。
当一个概念或想法变得越来越成熟时,产品设计团队会拿着大量的线框图来找客户进行评审。问题是线框图太抽象了。
用线框图解释方案时,会有一些模棱两可的描述,比如指着这个框说我们的功能大概这么长,我们的图片就放在这里。
就像下图一样,线框图充满了各种占位图和不确定的东西。线框图旁边将添加各种关于功能交互和错误提示信息的注释。此外,通常没有足够的时间与客户讨论各种问题。

在评估线框图的过程中,客户可能想知道线框图是否是最终版本,或者想在产品中看到真实的图片,或者其他一些问题。线框图对客户来说可能太抽象,无法有效评估。因为线框图需要大量的想象力和联想,构建产品的原型。我们的客户可能不擅长这样做,也不能指望他们通过线框图想象产品的完整外观。
第二,线框图并不总是适合用户测试
部分用户可以测试线框图,但不能覆盖所有情况。缺乏线框图 UI 视觉元素,视觉风格对用户行为的影响不容忽视。在用户测试过程中,很难孤立地看待交互、视觉和文案。
例如,对于国际产品,需要处理多语言场景。不同的语言有不同的语法、不同的字符宽度和不同的排版规则,这些因素会影响整体设计。线框图往往忽略了这一部分,导致文案或翻译在测试过程中对实际体验没有影响。
何时可以跳过线框图设计
显然,有时需要完整的线框流程,但有时可以跳过线框图,直接进入高保真设计阶段。以下列出了一些可以跳过线框图并直接进入高保真设计阶段的场景。
一是现存 UI 设计稿
如果在当前版本的基础上制定改进方案,不需要线框图设计,可以直接使用设计好的视觉手稿,重复使用一些组件或样式。这可以为您节省大量时间进行高保真原型设计。
摹客协作平台它可以很好地支持这一点,它可以上传现有的 UI 设计稿,支持 Figma、Sketch、PS、XD格式。

二是有构建原型组件的意识
如果你从一开始就有意识地组织你的原型文档并使用设计组件,很容易在现有高保真原型的基础上添加新的东西,并将更新组件库纳入原型设计工作流程中。为自己节省大量精力,不需要做线框图设计。
这样可以一石二鸟,在获得用户体验反馈的同时获得视觉反馈,调整整体设计。
我一般在摹客RP 这部分工作。它有丰富的组件库,可以一键调用,节省了大量的绘图时间。


第三,被测用户文化教育程度低
当你给这些目标用户测试一个抽象的线框图时,你可能会发现他们很难理解抽象的概念。例如,我以前正在测试金融 App 当时,用户首先会怀疑各种金融概念,需要有具体的例子来理解一点。否则,他们很难顺利完成用户测试。
因此,有必要有一个高保真的原型,让用户了解产品是如何工作的,让用户看起来像一个真正的产品,让他们有一种直观的感觉。App项目中的原型可以实时预览,就像产品已经开发出来一样。

如何做无线框图设计的过程?
首先,无论是田野调查、用户访谈、竞争产品研究还是桌面研究,都要做好调查;
第二,在做研究的过程中,随时记录爆发的想法,无论是界面布局还是某个过程,都可以在纸上快速记录;
第三,用抄客RP设计图形、颜色、按钮等需要重复使用的组件;
第四,开始设计高保真原型。尽可能使用真实的文案、图片等,模拟真实的用户使用场景;
第五,用抄客设计静态图RP 做一个可以互动的原型草案。用户不仅可以看到真实的产品界面,还可以体验到它,从而测量更多的维度和更详细的问题。
结尾
因此,并非每个项目都需要线框图。我们的最终目标是让设计决策真正满足用户的需求,更有效地实现我们的目标。
参考链接
The Vision Thing: Mainly in the Brain:
https://www.discovermagazine.com/mind/the-vision-thing-mainly-in-the-brain
The Prototype Mindset:
https://medium.com/galleys/the-prototype-mindset-396c979a356f
Is this a Prototype or an MVP?:
https://medium.com/innovation-machine/is-it-a-prototype-or-an-mvp-well-its-a-proof-of-concept-f8df5bb8940a
摹客:
https://www.mockplus.cn/rp
今天的文章就分享到这里,如果你也网赚副业项目感兴趣,可以添加 维信:beng6655 备注:副业!
如若转载,请注明出处:https://www.haoxue2.com/13743.html