导言：提升界面品(pin)质和体验是游戏UI设计师不(bu)断追求的目标，而纵观人类艺术发展，无(wu)论艺术形态如何变化，其抒发情(qing)感，讲述故事的本质没有(you)改变。村上春树在他的处女作中这样(yang)说”存在既表达，假如不(bu)能表达什么，就等于并(bing)不存在，文明就会归(gui)零“。作为游戏设计师，我(wo)们又该如何表达呢？
一、从游戏场(chang)景化设计说起
场景化设计已经是游戏设计行业(ye)中的一大共识，2009年当玩家在(zai)《Dead Space》中(zhong)通过手臂上的全景投影来(lai)查看地图时，第一次被这种效果(guo)震撼。也是从那一刻开始，世界观、代(dai)入感、场景化设计、3DUI都成了游戏设计行(xing)业中的高频词汇。早在2000年初，主机游戏就已经开始了(le)游戏界面场景化的发展。在2009年一篇名为《Beyond HUD》论文中，正(zheng)式提出了Diegetic Representation（剧情UI）这一概念，同时还将UI以“是否在(zai)剧情中”和“是否在游戏空间中(zhong)”这两个维度，将(jiang)游戏UI分为四大(da)类。
《Dead Space》（2008）第(di)一次将场景UI带到了游戏中
Fagerholt, E., & Lorentzon, M. (2009).
UI的情景分类
场景化UI设计几乎成为了高品(pin)质UI的代名词，诚然它有着(zhe)更好的表现力，更好的代入感。但另一方面它(ta)也面临着制作难度大、成本高的(de)问题。同时场景化设计也并非适用于(yu)所有的游戏类型或界面，例如游戏(xi)子系统、弹窗类界面等等。
二、真正打动(dong)人的是故事
并不是每个(ge)界面都能场景化(hua)，所以当我们在设计一个由于(yu)各种限制而无法进行场景化表述的界(jie)面时，我们该如何(he)增强它的表现力和(he)代入感呢？
场景(jing)化只是一种设计方(fang)法，而其目的才是我(wo)们需要关注的本质。从(cong)人类艺术诞生以来，虽然艺术的载(zai)体和形式一直在变化，但是其(qi)核心都是讲述故事和表述情感。就好比(bi)描述生动的小说，虽然没有强烈的(de)视觉冲击，但是依(yi)然能够让你产生强烈的临场感(gan)。真正打动人的是故事。
三(san)、将叙事融入游戏界面
既然故(gu)事本身才是那个(ge)有趣的灵魂，那我们(men)应该如何将其融入到(dao)我们的界面设计中呢？
叙事要素(su)
叙事要素想必大(da)家都不陌生，人物、时间、地点、事件(jian)。一句话概括就是谁在哪里做什(shi)么。所以，我们只要在界面中表(biao)现或交代清楚这些要素，游(you)戏界面就能够给人带来故事的(de)沉浸感。
1.角色
角色是目前游戏中运用(yong)最多的代入方式，无(wu)论是活动海报还是主界面(mian)的“看板娘”，都能起到很好的吸引(yin)玩家眼球的效果。除了展现游戏内(nei)容，角色还能够向玩家传递(di)情感，引导情绪(xu)。例如《古墓丽(li)影：暗影》中的存档点设(she)计，当玩家触发存档操作(zuo)后，劳拉会蹲坐在篝火(huo)旁，玩家在调整装备和技能的时候能够(gou)看到劳拉疲惫但坚定(ding)的神情，这与玩家(jia)完成战斗之后的状态产生了很(hen)好的共情。
《古(gu)墓丽影：暗影》存档点设计
角色的运用并(bing)不限于模型或是大幅插画，也可以是很(hen)小的一个装饰形象。例(li)如百闻牌中的小猫咪，会在提示引导(dao)的内容边上出现，当玩家(jia)看到她就知道这里有内(nei)容需要注意了，给人非常友好的(de)感觉。
《百闻牌(pai)》中的猫咪会在所有引导和提示的地方(fang)出
2.物件(jian)
人物的表(biao)现是最能够让玩家带入剧情的(de)方法，但通过对(dui)其他物件、环境等要素(su)的展现同样能够起到叙事的效果(guo)。例如我们经常能够看到的以(yi)书本为载体的UI设(she)计，以及GTA5中独具风味的手机操作（之后被各类游戏争相(xiang)模仿）。
《哈利波特：觉醒》中的图鉴系统
《GTA5》玩家手机界面
《永远(yuan)的7日之都》中(zhong)通过手机来展现玩家的收集(ji)系统
1003.环境
同样的，使用(yong)环境氛围也能够增强界面叙事感。这(zhe)种方法的好处是不会对显示(shi)内容造成过多的干扰，能够适用于更(geng)多的通用界面。例如《第五人格》中的起雾效果，就能运用在很(hen)多界面之中，甚至成为游戏的一个记(ji)忆点。
《第五(wu)人格》中使用玻璃起雾的效果来制造(zao)恐怖感
《Dishonored 2》中(zhong)大量运用破碎玻璃来渲染紧张(zhang)和危险
《刺客信条：起源》中不断浮(fu)动的光点，也是刺(ci)客信条系列所使(shi)用的环境元素
环境要素(su)的运用可以贯穿整个游戏(xi)，这是其他要素（人物、物品、事(shi)件）无法做到的。它可以是光(guang)影、HUD的显示效果、烟雾或是火焰(yan)等等。
4.事件
最(zui)后一项是事件，它在某种程度上可以说(shuo)是前三者的结合体。运用事(shi)件能够让UI有很强的(de)互动感，让玩家血脉偾张。
《底特律：变(bian)人》中的UI小姐姐
《底特(te)律：成人》中当玩家进入游(you)戏、暂停、完成任(ren)务时，都会有小姐(jie)姐在画面中和玩家互动，留下了令人深(shen)刻印象。在游戏(xi)结尾你还可以选(xuan)择是否“放生”她。
《蝙蝠侠：阿卡姆骑士》互动(dong)菜单
《蝙蝠侠：阿卡姆骑士》的菜单(dan)选项也采用了事(shi)件设计，当玩家在选项中来回切(qie)换时，背后的蝙蝠侠Pose会来(lai)回变换。这一设计在后来的《古墓丽(li)影：暗影》的主菜单中(zhong)也有同样的运用。
《非人学院》中将举报设计转(zhuan)化为“留校观察”，一下就有趣很多
事件(jian)的表现并不是一定要非常具(ju)象，例如《非人学院(yuan)》中的举报设计，就用漫画的形式(shi)来表达了校园举报这一事件(jian)，同样让互动变得有趣。
手游中我们经(jing)常能在抽卡中看到互(hu)动事件的设计，例如《阴阳师》、《百闻牌》的画符抽卡(ka)，《街霸：对决》的连招抽卡等。合理地运用叙事设计能够增强游(you)戏的魅力，让游(you)戏变得更加鲜活。
叙(xu)事原则
既然我们(men)已经了解了UI叙事设计是(shi)什么，那在实际运用(yong)时我们该注意哪些呢(ne)？
1.贴合(he)游戏世界观
好的叙事设计需要贴(tie)合游戏的世界观和内容(rong)，要将玩家行为转化成游戏(xi)剧情的一部分，这样玩家才能真(zhen)正融入游戏世界。
将玩家行为转变为剧情
2.贴合玩家情绪
“伤心的人别听慢歌”就是这么(me)个道理，当我们设计叙事时也要思考(kao)玩家在当前界面所处的(de)情绪，以及我们希望让他感受的氛围(wei)。当界面所表述(shu)的故事与玩家产生情(qing)感共鸣时才能真正刺(ci)激到玩家。
《使命召唤16》中的匹(pi)配大厅设计为前往战场的情景，充分(fen)调动玩家情绪
3.平衡交互可用性
经济学(xue)中有一个不可能三角理论，用于描(miao)述资本自由流动(dong)、货币政策独立和汇率稳定三者之(zhi)间的特殊关系。UI设计也存在一(yi)个不可能三角理论，功(gong)能全面、界面简洁和交互便捷这(zhe)三者无法同时达成，必须至少(shao)舍去其中一个。
设(she)计中的“不可能三角”
当我们在设计叙事化界面(mian)时，同样需要考虑这个“三角”。物品的装饰是否影响了玩家的信息阅(yue)读，互动的模拟带入是否让玩家原本(ben)的操作变得糟糕？
再好看的艺术(shu)品看久了也会让人厌倦，有时设(she)计本身足够惊艳，但(dan)是若频繁被触发也会带来负面的体验(yan)。最典型的例子就是抽卡时必须要提供(gong)连抽的机制，因为此时老(lao)玩家注重的是结果，而非过程(cheng)中的仪式感。
同(tong)样的问题也出现在《炉石(shi)传说》的自走棋玩法中。《炉石传(chuan)说》的打斗环节非常有看头，每张卡(ka)牌的打斗表现都做的非常生动，还会有观众的呼喊。但(dan)是由于自走棋玩法中打斗的时间(jian)越长，玩家拿牌的时间(jian)就会越短。所以有很多玩家都选择在(zai)开始打斗回合后强行重登游(you)戏，以跳过打斗阶(jie)段。
四、用叙事(shi)做体验设计的步(bu)骤
首先，在开(kai)始设计之前我们需要了解(jie)设计需求以及系统的功能框架和流程，只有将功能链路都细化(hua)整理清楚之后，我们才能(neng)开始对体验和表现力进行(xing)优化。
Step 1 整理系(xi)统结构，找到核心界(jie)面
这一步主要是(shi)对系统功能和策划案内容进行梳理(li)，并确定我们需要设计的内(nei)容。在功能设计的阶段我们更多的关(guan)注这个界面上应该具备(bei)哪些功能和信息。
清晰的功(gong)能划分和流程梳理是叙事(shi)设计的必要前提
Step 2 设计故(gu)事剧情
确定了各个功能(neng)和流程之后，我们就需要为完整的(de)操作流程设计一个合理的游戏剧(ju)情解释。这个剧情需要(yao)与功能相对应。
案例(li)：在《机动战士阿(a)尔法》中，将吃鸡中的(de)选点+跳伞操作改变成了(le)玩家进入驾驶舱选择(ze)目的地，然后机甲弹(dan)射的剧情。这一设计就很好(hao)的将游戏玩法转变为了游戏故事中的一(yi)段剧情，非常符合游戏的特色。
《机动都市(shi)阿尔法》中的“跳伞”设计
当(dang)我们在设计故事剧情时，需要将(jiang)其与功能点有机的(de)结合，将功能串联在(zai)游戏之中。这里将叙事元素和设计(ji)时需要考虑的内容(rong)结合在一起总结了8个要素。当我们(men)在设计方案时，按照这样的链路来思考(kao)，能够确保方案在故事性和功(gong)能性上取得平衡。
叙事界面设(she)计8要素
Step 3 设(she)计界面叙事
当我们得到了一个(ge)剧情之后，第三步就是(shi)运用界面中的元素来表现它。将8个(ge)叙事设计要素展现在界面之中，不(bu)断衡量和强化他们之间的关系。
案例1：《机动都市阿尔法》的新手选择界面，虽然没有使用场(chang)景化的设计，但是却通过对叙事元(yuan)素的表现，让玩家能够一下理解这(zhe)里的操作含义和剧情内(nei)容。
《机动都市阿尔法》中(zhong)的门票设计
相比传统游戏通(tong)过弹窗来让玩家选择新手(shou)难度，《机动都(dou)市阿尔法》的设(she)计就要生动很多。
一般游戏中的新手熟(shu)练度选择设计
案例2：《昆特牌》的角斗(dou)场界面:。玩家的视角是站在(zai)公告栏面前的猎魔人，而每一场战斗都(dou)是一个契约。玩家(jia)击败9个对手便是(shi)完成9个契约，最后拿到报酬。界面中(zhong)使用火漆来表现玩(wan)家的成败，挑战失败火漆就会裂开。我们可以在界面中很好的找到叙事设计(ji)的要素。
《昆特牌》角斗场界(jie)面
总结
场景化只是游戏设计趋势的表(biao)象，实际上它代表了游戏行业越来越重(zhong)视游戏世界观和故事的设计。游戏叙事(shi)与界面设计能够有(you)很多结合的可能，其表现形式(shi)也是丰富的。我们(men)在游戏界面设计中其实不单(dan)单是完成策划的功能需求(qiu)，更重要的是去创造吸引玩(wan)家的游戏魅力。希望我们能够一起在(zai)未来的设计中不断探索(suo)和创造真正打动人心的作品。
