谈一个好的交互设计背后的叙事性

2022-11-07 18:03 作者:UXD尤克斯国际艺术中心 0人读过 | 我要投稿

故事讲述是一种我们可以与其他人交流想法的方式，让这些想法在情感上产生共鸣，这一点非常重要，尤其是作为设计师，我们需要分享我们的想法，并将其传达给我们的合作伙伴和用户。

当我们讲故事时，会与用户产生情感共鸣，从而更加了解我们的用户。因此，通过故事讲述，我们可以找到方法来帮助用户，了解用户的观点，并向其靠拢。下面我们将介绍几种讲述故事的常用手法：

分享人

• Alex Cook

Asana 设计主管，前 Google Lens 设计主管，拥有佐治亚理工大学信息设计和技术硕士学位以及佐治亚大学英语学士学位。

01

| 叙事技巧

The skills of storytelling

Narrative Arc：

这是一种模式，几乎所有的故事都遵循这种模式。从 Exposition 开始，有冲突，有需求，有紧急事项，有高潮或下降的行动，最后通过决议达成解决方案。

举个例子，某个博览会即将开始，如何在社交媒体上分享照片呢？这是人们首次使用社交媒体时遇到的一个非常常见的问题。我们可以考虑的矛盾点是：他们有这张照片，并需要将这张照片放到社交媒体中进行分享，他们可能找不到分享按钮，这时无论是什么按钮让他们能够进行分享，他们就会去这样做。

Hero's Journey：

这是故事讲述的另一种标准方式，当我们想到《星球大战》、《哈利·波特》、科幻小说以及任何幻想作品时，这种方式都很常见。它围绕着一个角色做出重大改变，一般是以一个普通人从一个普通的世界开始。他们接到了冒险的召唤，他们可能会质疑自己，但最终会决定去冒险，他们进入了一个未知的世界，那里的一切都颠倒了，有许多考验和磨难，他们经历了一段强烈的自我怀疑期，最后他们抓住了剑，走上了归途，回到了正常的世界。这种技巧可以让人们思考如何掌握新技术，并真正开始更有效地实现目标。

很久以前，在开发一个叫做 Adwords 的产品时，有很多小企业主想获得更大的影响力，并确保他们可以在更大的范围内做他们想做的事情。

其中一个卖绗缝商品的女人来自平凡的世界，是一名缝纫工，经营着一家小企业，她不认为自己是技术人员，起初她拒接加入 AdWords，但最终她跨过了门槛，注册了，经历了磨难，这是一个艰难的挑战，是一场斗争，她必须学习所有这些新概念，去抓住这把剑。她做了多个广告，进行了多个竞选活动。然后，她提出了新的概念，现在她在她的朋友和家人中被称为技术人员，她正在帮助妈妈在网上宣传她的企业。

02

| 在设计中应用叙事技巧

Using narrative techniques in design

设计就像是在导演一部电影。我们所做的很多事情，尤其是当我们为手机设计时，我们必须考虑到用户在哪里，在做什么，准备去哪里，他们的实际位置，是否在开车，他们在接到通知时是否在打电话，以及他们周围的所有事情。沿着这些思路思考对理解更深层次的体验以及如何真正与用户产生共鸣非常有帮助。

Sidney Lumet 是一位电影导演，这本书是关于电影制作的技术性描述，他的剧本《天才》的每一部分都在抓细节，与演员合作，制定预算，以及如何操作相机和拍摄的技术方面。他虽然没有谈论交互设计、视觉设计，但这是非常相关的，对其进行抽象，并对本书中的技术进行大量思考，你会发现几乎每天都在使用它们。

他在这里引用了一句很好的话："All great work is preparing yourself for the accident to happen." 这一点非常重要，当我们思考设计时试图讲述的故事，我们可能并不知道这个故事的结局，尤其是当我们深入到项目中时。我们会有一个期望的效果，即想给用户带来情感共鸣，但不知道这个故事将如何结束。

Setting the scene：

场景设置确保我们为故事创造了正确的基调。谷歌有一个特别鼓舞人心的项目叫做城市丛林。我们想做的是打破湾区思维，不一定要考虑如何设计行车路线图，而是如何为各种交通工具设计地图。

研究团队想出了一个计划，他们决定在全球范围内瞄准四个地点。他们进行了非常广泛的实地研究，选择这些地点是因为它们有些相同，而且这里的大多数人都依赖公共交通。

他们在进行实地研究时拍摄了一些电影片段。这在场景设置方面确实很有帮助，因为当他们谈论这项工作时能够让人们参与进来。

团队还做了一些特别令人惊讶的事情，他们创建了一个每个人都可以了解研究的画廊。因为虽然我们可以制作视频，可以通过电子邮件将它发送出去，但这并不总是联系人们的最佳方式。

他们创建了这个房间，这是一张全景照片，里面播放了所有的视频剪辑，有很多关于地点的信息和照片。他们还做了一件很巧妙的事情，把这个房间放在大楼的入口处，几乎每个人都必须穿过这个房间，他们会花很多时间在那里，这比制作视频更吸引观众的注意力。

然后设计阶段开始了，团队制作了这些共享的设计元素，确保它们在整个项目中具有连续性，并确保它们遵循自己创建的设置。

设计师们制作和创造的所有东西都被用于设计模拟。

这一项目在内部取得了巨大成功，将重点从湾区转移到了更多的地区，并通过设置场景做到真正贯穿始终。

Immersion：

意思是像浸没在水下一样。当我们从故事讲述的角度来考虑 Immersion 时，它可以指你看了一部非常迷人的电影或读了一本非常迷人的书，你感觉完全融入了其中的世界。沉浸感能够推动好的故事讲述，这也是人们真正开始联系甚至改变他们的视角的时候。

当我们最初推出 Material Design 时，我们很难将它用于搜索，因为这是个非常美观的新设计系统，而当时的搜索有一个非常严格的设计系统。对于我们来说，思考如何将我们现有的设计系统和 Material Design 的系统合理化，使之成为具有吸引力的东西，确实是一个挑战。

我们所做的一件事就是与团队中的动效设计师合作，我们在网上买了一些 B-Roll，制作了一个剪辑。我们真正想做的是将其与更大的用户旅程联系起来，因为我们不想仅仅展示一堆动画或新的设计概念，我们想展示的是，有了它，人们可以在谷歌的界面之间流畅地移动。

我们预想了一个计划露营旅行的场景，并认真研究了人们在进行露营活动时可能会做的所有活动：他们可能会如何选择地点？最终导航到哪里？以及当他们真正去露营时会有什么影响等等。

由于我们建立了一个依赖于网络动画工程的东西，我们非常担心在搜索上的严格设计系统无法提供很大的灵活性。因此，我们创建了一组原型，并与工程师分享，让 Chrome 团队参与进来，他们喜欢网络动画，因此通过引入他们，我们能够真正让事情进行下去，从制作原型到制作更真实的第二版，实际上运行了一个我们试验过的现场演示，以便我们能够完全验证设计。

我们创建了这个原型的第一个版本。它实际上比我们预期的要好得多，并在后期成为了我们的设计规范。

沉浸式设计体现了我们行业的发展方向，以及我们作为设计师将要谈论的内容。特别是当我们离AR越来越近的时候，思考一种更电影化、更情感共鸣的体验是非常有必要的。

更多知识干货以及其他海外留学的资讯可以关注UXD交互工业产品设计分享或者添加小助手，还可获取讲座直播哦~

|福利大放送 | WELFARE
对于设计初学者，完成从0开始创作几乎是不可能的，就像学习过程中书读百遍其义自见一样。有了大量的积累，才能在脑海里建立素材库，这些素材库能帮助同学们完成最初的设计想法积累，基于这样的基础再进行个性化的创作，最终才能做出高质量的作品集。全球院校最新作品集免费拿！添加小助手即可获取：