线框不仅适合设计师 "Product people - Product managers, product designers, UX designers, UX researchers, Business analysts, developers, 使rs & entrepreneurs January 01 2020 真正 产品开发,产品开发流程,产品管理,用户体验,线框, 注意产品 介意产品有限公司 1755 产品管理 7.02

线框不仅适合设计师

通过 ON

线框通常在产品开发过程中使用不足,但正如我’在这篇文章中将进行解释,它们对于促进交流和知识转移是非常宝贵的。

使用笔和纸来勾勒出软件的概念和设计始于1980年代图形用户界面(GUI)的诞生。这是有远见的人,制造商和销售人员用来传达产品和功能想法的简单而强大的技术,’t yet exist.

但是随着时间的流逝,随着数字用户界面设计工具的激增和复杂性的提高,UI设计已成为专门设计人员的领域,通常会剥夺大思想家和产品人员展示自己想法的能力。早期的数字设计技术之一 用户界面线框,坚持,因为 they can be 创造d (and understood) by anyone.

线框用于将需求和想法转换为视觉语言
线框用于将需求和想法转换为视觉语言

线框作为产品经理的工具

线框图的目的不是为了自己而绘制用户界面的图片。线框图并不是一种创建技术,而是用于 将需求和想法翻译成视觉语言 这很容易理解。这种翻译角色向软件团队传达并解释了客户的需求,是产品经理所做工作的很大一部分。

让我们看一下线框可以帮助产品经理更有效地发挥这一作用的两种特定方式。

线框作为交流工具

您’我们可能听说过成功的产品创意的故事,这些故事以餐巾纸上的谚语草图开始。在那里发生的火花在 正确的人之间进行沟通,例如从思想家转移到构建者或由创新者引入连接器的想法。

人们经常被告知,最好的交流方式是展示而不是讲述。或者说一张图片值一千个字。瞬间“Oh, I get it now”线框可能产生的反应是产品经理(可能会严重依赖书面和口头交流)使用它们的最佳理由。

线框是解决开发人员在销售和营销会议期间不阅读大型功能规范文档或进行分区的问题的解决方案。这是在所有人的脑海中获得相同图像的一种具体方法。

线框作为思维工具

一旦开始将线框视为一种交流工具而不是一种设计工具,就可以很容易地将其视为一种工具。但是,为什么它们通常看起来粗糙且未完成?不会’提出看起来像您要创建的最终产品的设计建议会更好吗?

回到画纸的想法,想一想有人一直随身携带的笔记本或素描本。这会让人想起所有者有时会不合时宜地记下便条或快速鸡抓痕的异象。–排队,在火车上,走上楼梯。将笔放在纸上 化解思想 and then 创造s a jumping off point to continue it.

线框的粗糙特性具有相似的效果。使用可在纸上进行素描的工具可以鼓励探索和开放性。您多久一次对自己不完整的想法’想失去吗?只是 显示想法的种子可以帮助您了解下一步。线框是一种用于捕捉不完整的思想并提供思想的工具。

线框可以鼓励产品经理和其他非设计人员 在过程中的适当时间发挥创造力,如果问题很明显但尚未找到最佳解决方案。

打造线框的5个步骤

在知道为什么作为产品经理的人应该进行线框设计以及如何实际进行操作之间存在很大的差距。一个好的开始是将其分解为不同的阶段。

第1步:清晰表达

做任何类型设计的最高提示是 知道你的问题’re trying to solve。我看到的最大错误是当人们 认为 他们知道,但实际上不知道’t, or don’不太了解。解决方案是花一些时间 在您做其他事情之前先阐明问题.

线框可能是存储此信息的好地方,仅因为它们存在于笔记本和视觉设计工具之间。

这里’s是我们希望使用的问题模板 巴尔萨米克:

  1. 谁会使用它?
  2. 他们的目标是什么?该产品或功能为他们解决了什么问题?
  3. 它们可能会执行哪些动作或操作? (如果有帮助,您可以尝试为此绘制图表或流程图。)

这里’s an example:

这看起来可能不像线框,但通常是创建它们的起点。开始设计时,花在回答这些问题上的时间会花很多时间。

步骤2:产生

是时候开始制作线框了。但是不要’不要将其视为从头到尾的构建过程。我用这个词“generate” over “make” or “create” because it 使s me 认为 of ideas rather than tangible products. The goal here is to 生成 visual ideas, not 创造 the final product.

因此,请放心,脱下以决策为重点的PM帽子,进入创意区域,并开始在画布上添加形状和控件。如果卡住,不要’转动车轮,继续前进。完全尝试其他方法或新概念。

结果应该是 一堆半生不熟的概念,只有你会明白。那’这里的成功是什么样子!此结果应该可以帮助您了解哪些解决方案 韩元’t 工作以及哪些值得进一步研究。

这里 are four variations on a mobile to-do app:

 

步骤3:重复

下一步是寻求和完善。

首先,呼唤您大脑的另一部分,即缺乏创造力,更多目标驱动力的部分。您可以重新戴上PM帽子。让它帮助您有潜力地完善和改进想法。添加一些额外的细节,例如按钮或菜单项的实际名称,以帮助使其更加具体。

接下来,请认识问题和/或用户的同事或合作伙伴。解释您的想法(此时您仍然应该有多个想法,最好是3-5个),并与他们讨论工作流程。让它成为一个合作过程,您在其中使用共享的知识来想象最终用户使用这些屏幕。捕获任何打h或丢失的碎片,然后将其固定在那里或之后’我一起经历了整个事情。

步骤4:沟通

不会’如果我们能在屏幕上画一个产品并按下一个按钮使其真实,那会很好吗?还是我们有能力自己独自设计,设计,创建和分发软件?如果有人声称能做好所有这些事情,请当心。

在几乎所有情况下,下一步都是将您充实的想法传达给将要构想的人或团队(可能还会有另一个将进行营销的团队)。

如果您在一家小型公司工作,则该过程可能与上一步类似,在该步骤中,逐步引导开发人员了解您的想法。不管你’我可能想花一些时间让不熟悉用户及其目标的人容易理解您的解决方案。

这可以通过向线框添加注释和注释来解释特定的用例和场景,以及在屏幕之间添加链接以演示预期的工作流程来完成。

步骤5:验证

取决于您的公司’在运输方式上,您可能已经在软件流程中包含多个验证阶段,例如质量检查测试,甚至是正式的用户测试。在这里也使用它们。

您想要验证线框的原因是您可以 尽早发现潜在问题。在设计阶段解决问题是 许多 比在开发过程中修复它们快。

最关键的是 要验证的两个关键事项:

  1. 这实际上可以解决我的用户遇到的问题吗?
  2. 可以建造吗?

的危险“playing designer”就是您可以采用与设计师负相关的习惯,即为自己设计事物而不是考虑整个上下文。

所以, 使 sure that you haven’t overlooked who you’re designing for and that you haven’t become too attached to your 线框 just because you 创造d them! A feature that doesn’t solve a real problem can’不能通过软件更新进行修复。

二,确保自己已经避风港’t 创造d an idealized vision that can’不能在指定的时间范围内或使用当前技术堆栈进行编码。 向开发人员展示线框 并与他们进行现实检查。如果他们退缩了,您可能需要将其缩小一点,以便更快地将最重要的功能掌握在客户手中。

您 can always add the remaining features later. The great thing is that you already have the design for them!

如果您拥有大量的用户研究或用户体验团队,则可以让他们使用非正式/折扣可用性测试方法(例如(数字)纸质原型,5秒测试或走廊测试)来测试设计的可用性。

简而言之,线框的美在于任何人都可以轻松理解它们,所以不要’不要羞于向关心您产品的所有部门或团队展示它们’重新设计。向他们表明您认识到他们在过程中的作用。如果没有别的,他们’当他们第一次在屏幕上看到真实的东西时,请不要感到惊讶。

概要

线框经常在软件过程中被误解和使用。它们占据了一个灰色地带,对于商务人士和开发人员来说似乎过于艺术化,而对于设计师而言却不够详细。这么多软件解决方案失败的主要原因之一是 大多数工具和过程的孤岛性质 这些角色使用的。可以 弥合这些差距 迫切需要。

线框图是一种 促进沟通 and knowledge transfer in order to help 创造 better solutions and experiences for the end user. And by following a repeatable recipe for creating them, they are an easy and effective way for product managers to do what they do better.