界面如何讲故事
点此关注更多设计好文！
导语 | 好的设计，亦是好的故事。 一个好的故事可以帮助设计师与用户建立同理连接，也可以让用户更容易更深入体会到设计价值。而在游戏界面设计中我们又如何讲好故事呢？故事化界面的设计思路又该如何应用，一起来和作者探讨下吧。
1.为什么界面要讲故事？
故事使人沉迷
哲学家伯纳德·苏茨（BernardSuits）认为游戏的本质就是玩家自愿克服种种不必要的障碍。
那么为什么会产生这种现象？
《头号玩家》中有一句台词也许可以回答：“大家来到绿洲是因为可以做各种事，但是他们沉沦于此是为了不一样的人生。”
虚拟世界所提供的的在平凡生活中体验不到的情绪/情感就是人们耽于此的魅力之所在，而丝丝入扣波澜起伏的故事就是一艘船，将玩家带入名为英雄梦的海洋！
故事营造差异
通过叙述的方式来讲述一个事件称之为故事。如果说游戏是一个完整的故事，那么构成游戏的任意元素都是服务于这个故事的，界面亦然。
《全境封锁》的开头有一段情节，主角在恐怖袭击后萧条的大街上行走，街边车窗倒映出自己的面容，以车窗为界面载体出现捏脸界面，既在意料之外也在情理之中。这个体验是全境封锁独有且很难被复制的，烙印上了它的品牌属性。
故事定义体验
认知心理学家唐纳德·诺曼（Donald A Norman）曾提出情感化设计的三个水平：本能、行为和反思。反思是是跟内容互动后的感受，是升华的体验和情感。而故事所带来的价值，可以帮助玩家和游戏之间构建一种情感的纽带，满足玩家的情感诉求，帮助产品的体验升华。
2.如何通过界面讲故事？
故事的三要素
界面故事包装设计思路可以拆分为两个维度：理性分析和感性包装。
理性分析可以比喻为设计的骨架部分，它包括产品目标、玩家目标、信息架构、流程效率和拓展成本等等因素的分析考虑。画骨还得画皮，感性包装是情感的赋能和体验的定义。
简而言之就是把设计需求看作是一个故事，就需要设计这个剧本，设计这个剧本传递给玩家的感受。
构成故事的关键三要素是背景、角色和情节，界面设计和讲故事的相同点就是都是信息的传达，如果将其映射到设计的三要素可以对应上信息、操作和流程。此时需要打开脑洞，构思在这个剧本发生的时代背景（信息构成）、角色是谁他在做什么（操作）以及主角经历了什么（流程）。
电影《蒸汽男孩》有一个场景，主角从袅袅蒸汽中看到后面的机械装置在有规律的运作，机械规律运作的美感妙不可言。那么假想玩家在这个蒸汽世界中，在操作一个机械装置的情景会是怎样呢？以机械装置作为设计载体，所有的信息展示都围绕着这个机械装置来设计，信息的串联都以纯物理的机械齿轮、电气来演绎。
以“蒸汽梦想”这个案例，通过前期对抽奖需求的理性分析后，就可以来构思这个故事要如何叙述了。
首先是故事的背景-界面信息部分，它是置于一个蒸汽朋克的世界之下，在这个世界里有哪些元素？要找到一个合理的设计载体或者说是概念，当玩家沉浸在故事中的时，任何非合理的元素都容易让人“跳戏”。合理的信息安排也能帮助观者更好的理解逻辑和规则。在明确故事背景后，可从图片和电影中寻找背景下相关的内容构建情绪板。
情绪曲线
电影中有经典的三幕式结构，确保观众在观影过程中代入作品，情绪跟随波动起伏。而跟观众的情绪曲线有着紧密关联的就是故事的情节，情节推动故事的高潮迭起的发展，
譬如看完《少年派》的时候，我们会跟随主角的喜怒哀乐，仿佛也经历了一段奇幻漂流。
在游戏中，情绪曲线是玩家体验一个过程的情感起伏，好的故事都有节奏感。除了流程的效率、顺畅这些基础体验的保证外，玩家跟内容交互的这条流程线上的各个触点的情感体验也需要纳入设计范畴。以一个阵营选择设计思路为例，这是玩家到了新地图后第一个新任务，选择一方势力并加入。玩家在加入后的任务路径是：了解势力-选择势力-加入势力。那设想一个段情节如下：
1.“我”下飞机后跟线人交谈，了解情况
2.他递给我两块身份牌
3.我了解了下两边的情况
4.选择加入警长，身份牌翻过来烙印上“我”的名字，作为警长的使命油然而生
在这段情节中，情绪是有起伏的或者说玩家情绪的起伏是会被设计所影响的，玩家看到线人（感到疑惑）—了解身份牌 （好像有点意思）- 加入势力（强烈的使命感和荣誉感）。
因为玩家在玩游戏的时候就是在体验一个过程，情绪曲线可以被应用到每段故事情节的设计，在此过程体验中通过合理的情绪渲染烘托可以帮助进入心流状态，产生代入感并产生情感共鸣。
结语
如果把界面当作一个故事来设计的话，思路的边界远不局限于一个简单的界面设计，交互设计师更像是一个体验的定义者，也像是一个导演，要讲述一个怎样的故事，要如何讲述故事。曾经看到一句话印象很深刻：“最好的游戏界面就是让玩家感受不到界面的存在”，深以为然。
最后以《头号玩家》中的一句话来结束吧：
“这是“绿洲”世界，在这里唯一限制你的是你自己的想象力”
以此共勉。
参考文献：
[1]《Reality is Broken:Why Games Make Us Betterand How They Can Change the World》Jane McGonigal
[2]《Emotional Design》DonaldA Norman
[3]《Plot Versus Character:A Balanced Approach toWriting Great Fiction》Jeff Gerke
[4]《Flow》MihalyCsikszentmihalyi
END
光子原创，欢迎分享 · 转载请留言公众号授权
让我知道你在看