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