We're sunsetting PodQuest on 2025-07-28. Thank you for your support!
Export Podcast Subscriptions
cover of episode 35. Wireframing & Prototyping (feat. Leon Barnard, Content Manager, Balsamiq)

35. Wireframing & Prototyping (feat. Leon Barnard, Content Manager, Balsamiq)

2024/2/2
logo of podcast NN/g UX Podcast

NN/g UX Podcast

AI Deep Dive AI Chapters Transcript
People
L
Leon Barnard
T
Therese Fessenin
Topics
Therese Fessenin:尽管原型设计工具日益强大,线框图仍然是设计过程中不可或缺的环节,它能够帮助设计师释放创造力,这是在专注于制作像素完美的原型时无法获得的。线框图作为一种低保真原型,可以帮助设计师在早期阶段快速迭代和试验不同的设计方案,从而降低设计风险,并节省时间和资源。 Leon Barnard:线框图是用户界面的草图或示意图,类似于建筑师的蓝图,它用于沟通基本信息,而非最终产品模型。线框图的优势在于创建和丢弃都非常快速简单,方便在早期阶段进行错误尝试和学习。线框图、原型和模型在设计过程中的作用和目的不同:原型用于测试和验证最终产品;模型仅用于视觉展示;线框图则用于构思和探索解决方案。Figma等工具对线框图和原型设计产生了积极和消极的影响:积极方面是为UX设计师提供了合适的工具,并具有良好的协作性;消极方面是过于关注UX设计师,对非设计师参与度不高,且不利于早期阶段的探索和迭代。高保真工具更适合在确定解决方案之后使用,而线框图更适合早期阶段的创意发散和迭代。线框图可以使用白板等简单工具完成,降低了参与门槛,方便团队协作。线框图可以帮助设计师理清思路,在早期阶段发现并解决问题,从而节省时间。线框图可以在需求收集和编码开始之间任何阶段使用,用于探索想法,不必等到正式设计阶段。线框图是有效的沟通工具,可以更有效地传达软件产品创意,比纯文本更直观。线框图不应局限于特定角色,而是应该被视为沟通和协作的工具,各个角色都可以参与其中。是否向用户展示线框图取决于与用户的沟通方式和关系,在非正式场合和定性研究中,线框图可以作为有效的沟通工具。将线框图视为设计流程中独立的部分,而非简化的原型工具,可以帮助设计师更好地利用线框图。要充分利用线框图,应将其视为独立的流程部分,从最高层次出发,关注用户问题而非解决方案,并在不确定性中探索更多可能性。 Leon Barnard: 线框图是沟通和提高设计工作效率的有效方式,有助于设计工作的实施和产品的构建。作者曾担任UX设计师近十年,后加入Balsamiq公司,致力于推广UX和线框图设计。

Deep Dive

Chapters
Leon Barnard discusses the relevance of wireframing in the design process, explaining what wireframes are and how they differ from prototypes and mockups.

Shownotes Transcript

线框图是一种非常有用的设计技巧,可以充实概念性想法并将其传达给他人。然而,随着强大的原型设计工具的出现,一些设计师可能会认为这些是不相关的或过时的做法。Balsamiq的内容经理Leon Barnard以及《人人线框图》(Wireframing for Everyone)一书的合著者讨论了为什么他认为线框图不仅仍然相关,而且对于最大限度地提高创造力和创新思维至关重要。

Balsamiq线框图学院人人线框图 (由Michael Angeles、Leon Barnard和Billy Carlson合著)

</context> <raw_text>0 你有点偷偷地只想让他们签字批准,这样你就可以发布了,你知道,有时在流程进行得太晚了。然后也许你会得到很多反馈,表明你错过了一些重要的事情,你会想,哦,天哪,现在我们得重新编写我们的原型之类的东西。所以不要走得太远,展示一些几乎完成的东西,并假设一切都是

好的,你知道,所以你总是要对用户的建议和反馈持开放态度。是的,我很欣赏这一点。你提到这就像一项定性任务,这是一种避免让自己陷入太深的方法,但是,是的,

我认为它不一定是量化的,对吧?事实上,也许它最好不是量化的。一部分原因是正确的。当我们考虑定量与定性技术时,对吧?定量,

研究就像A/B测试一样,我们将看看,哪一个表现更好?哪一个任务时间更短?在这个阶段,我认为从预算的角度来看,这样做是没有意义的。再次强调,我们倾向于使用线框图来查看许多不同的想法,查看15个不同的概念可能并不划算,对吧?但是,如果我们将其用作一种快速

定性方法来弄清楚,好吧,也许在内容方面,这是否说得通?或者用户是否在寻找一些东西,这也降低了压力,哦,我们需要招募一百个人来看这个草图吗?本质上,什么是标记草图,对吧?与,嘿,让我们只找几个人来和我们谈谈他们认为,什么样的

活动将会做,这会帮助他们吗?我认为这种对话,将其更多地定义为一种对话,可能特别有用。是的,是的,当然。是的。现在,我想我还有另一个问题,很多团队可能习惯于根据需要非常快速地制作非常高保真度的屏幕。这并不是因为,你知道,线框图本身就具有,你知道,

我认为人们只是不知道它们。那么,对于那些希望开始将这一步骤纳入其中以最终改善其最终结果的设计师,您能提供什么建议呢?他们如何向他们的主管或团队成员证明这一点?是的,这是一种范式转变。所以我认为最难的部分是不同地思考它们,并且

我会说,也许甚至不要把它们当作设计过程的一部分。我的意思是,就像你并不一定

你知道,如果你只是在纸上画一些东西,你不会想,哦,我不能这样做。我需要在我的高保真工具中这样做,对吧?所以把它们当作一种在你的脑海中澄清事物的方法,你知道,把它们当作理解过程的一部分,以及你进行高保真设计之前所做的预先设计、预先工作。你知道,如果你

如果它们能帮助你弄清楚要构建什么,它们就能为你节省时间。这确实是,你知道,你想要的地方,很多时间都花在了构建东西上。但是如果你不知道你在构建什么,那么你就不想走得太远。所以这只是一个让你能够

探索、澄清和理解你自己的想法的方法,因为有时你不知道自己不知道什么。是的,对,对。我认为这种提醒很有帮助,因为这不是一个工件,对吧?这是

这只是一个沟通技巧。对。我认为这样做,即使在你的,你知道,在你的沟通中,比如说有人说,好吧,我们现在要进行设计了。我们还没有做线框图。对。即使只是说,好吧,在我们开始设计之前,对,即使是将它与我们这样做之前分开的心理模型。

我想检查一下,比如,这是我的一些想法,对吧?这将它定义为不同的东西,对吧?因为我认为挑战之一是,如果我们将其定义为我们正在开始设计,然后我们发送它,然后利益相关者或高管看到它就像,那不是一个设计,对吧?他们将其解释为发生了什么。我们的通常高保真度在哪里?或者,我们的通常漂亮的设计在哪里?

概念艺术,本质上。所以,我认为能够将其更多地定义为我正在向你传达一个想法,我认为这肯定非常有助于它们更容易被接受。是的。如果你说,你知道,我们真的想创新,我们想有创造力。所以我们需要一些时间来探索、迭代,你知道,获取反馈并进行一些思考。

在我们直接开始构建之前。绝对的。那么,对于那些已经进行线框图设计一段时间的人,您能否分享一些关于如何充分利用线框图实践的技巧?因为我觉得很容易说,哦,是的,只是草拟概念。但是如果你能给出一个提示,比如,这将使你的线框图对你更有用,你会给出什么提示?

是的,我会说,把它当作流程的单独一部分。它不仅仅是一个简化的原型设计工具或步骤。所以不要马上考虑UI。你知道,你甚至可以从在页面上写下一些文字或一些想法或一些基本形状开始。你知道,从最高级别开始,最远的缩放级别开始。

这样你就可以真正专注于什么,你知道,记住用户的难题,真正关注问题而不是解决方案。你知道,你并没有试图立即设计出最终的东西。我知道这很难,因为你想得到一些东西,当你处于那种中间不舒适的阶段时,这有点不舒服,你知道,但是你必须在那种不确定性中徘徊,你知道,超出你的舒适区

领域去探索,因为我认为最好的想法就是在真正进入未知领域时产生的。所以在我们的书中,我们有很多关于如何做到这一点的技巧。所以我认为不要只是想,哦,我正在为你构建一个用户界面,而是想我正在探索想法,保持非常非常高的层次,并且只是比你通常可能做的更长一点时间停留在那个空间中。

绝对的。然后,所以这将是一个很好的建议,我认为,对于任何人来说,无论你是否有经验进行线框图设计,或者你是否是新手,但是我想对于那些对这方面非常陌生的人,或者说,这是我第一天听到关于线框图的任何信息。你能指导这些人去哪里寻找资源吗?嗯,这正是我们写这本书的原因。所以我将推荐我们的书《人人线框图》。嗯,

然后另一本书,我会说,选择像《别让我思考》这样的书,你知道,另一本面向非设计师的书,它真正专注于进入可用性和用户体验的思维模式,并且

你知道,是什么让用户感到沮丧,你知道,是步骤太多或者一些没有意义的东西。你知道,这不是视觉层。是,你知道,缺乏对解决实际问题的深思熟虑。所以,你知道,这些,这些面向非设计师的书,让你进入正确的思维模式,我认为非常有帮助。

嗯,而且在Balsamiq网站上,我们有一个完整的Balsamiq学院,它全部是关于学习线框图和这种思维模式的,balsamiq.com/learn。我们有文章、课程、访谈,以及各种各样的东西,嗯,你知道,补充书中的材料。绝对的。好吧,我们肯定会包含这些链接。当然还有你书的链接在节目说明中,嗯,

以及我们,你知道,我们也有在NNG的一些资源,我们也会链接到。但是Leon,非常感谢你抽出时间分享你所经历的冒险,基本上为社区创建了这个令人惊叹的资源。我真的很为你兴奋,也很兴奋地看到它帮助了多少人。否则,我想如果人们想亲自关注你和你的工作,你有什么社交媒体账号或网站可以推荐给人们吗?

我在Twitter、X(无论你称之为什麽)上用我的全名Leon Barnard。我认为我最近在LinkedIn上发布的内容可能更多一些,关于这类事情。所以那将是一个好的开始。好的。再次感谢你。感谢你的时间,祝你今天剩下的时间愉快。那是Leon Barnard。

查看节目说明中我们到目前为止提到的任何链接。但是请记住,我们的网站上有数千篇关于用户体验设计、研究、策略甚至用户体验职业的文章、视频和报告。该网站是www.nngroup.com。那是N-N-G-R-O-U-P.com。如果您特别喜欢这个节目,请在您选择的播客平台上关注或订阅。

本节目由我Therese Fessenden主持和制作。所有视频编辑和后期制作均由Laramore Production Company完成。今天的节目就是这样。直到下次,记住,保持简单。