游戏界面
Game Interface
界面是分隔玩家(阳)与游戏(阴)那层无限薄的膜;界面失灵,体验之火即熄。界面的目标不是好看或流畅,而是让玩家感到掌控自己的体验。Schell 把界面拆成物理输入、物理输出、虚拟界面三部分和其间的六种映射 (mapping),并讨论透明、反馈、多汁 (juiciness)、原始性 (primality)、信息通道与维度、界面模式,以及十条实用建议(第 3 版第 15 章 Players Play Games through an Interface;第 1 版为第 13 章,无原始性一节,建议为八条)。
拆解界面(第 15 章 Breaking It Down)
从外向内:玩家与游戏世界之间的一切都是界面。
- 物理输入:摆弄棋子、手柄、键鼠。物理输出:棋盘、屏幕、音频等。
- 虚拟界面:既不在物理层也不在游戏世界中的概念层,有输入元素(虚拟菜单)和输出元素(《吃豆人》顶部分数、伤害飘字"10"、3D 游戏的虚拟摄像机视图)。有的游戏这层很薄,有的布满按钮、滑条、菜单。设计师 Daniel Burwen 指出:界面抽象越少,我们对内容的情感联系越强(第 3 版新增)。
- 映射:游戏侧每条箭头都是一段代码,数据不是直接透传,而是按设计变换。
下图对应书中图 15.5(第 1 版图 13.5):
flowchart LR P["玩家"] --> PI["物理输入"] PI -->|1| W["游戏世界"] PI -->|3| V["虚拟界面"] V -->|4| W W -->|5| V W -->|2| PO["物理输出"] V -->|6| PO PO --> P
| 箭头 | 映射要决定的问题 |
|---|---|
| 1 物理输入 → 世界 | 推摇杆跑多快?松开多快停?推得越重越快吗?会加速吗?双击冲刺? |
| 2 世界 → 物理输出 | 看不到全世界时,能看到哪部分?如何呈现? |
| 3 物理输入 → 虚拟界面 | 菜单里单击、双击做什么?能拖动界面吗? |
| 4 虚拟界面 → 世界 | 弹出菜单选择动作后立刻生效还是延迟生效? |
| 5 世界 → 虚拟界面 | 分数、能量条何时变?世界事件会弹窗或切换界面模式吗?进入战斗会出现战斗菜单吗? |
| 6 虚拟界面 → 物理输出 | 显示哪些数据、在屏幕哪里、什么颜色字体?血量很低时闪烁或发声吗? |
- 电子游戏界偶尔会进入"不值得做定制物理界面"的干旱期,但市场靠实验与新奇繁荣,专门打造的物理界面能让老玩法焕发新生。
版本差异:第 1 版此处举《劲舞革命》跳舞毯、《吉他英雄》吉他、Wiimote 为例;第 3 版删去具体例子。
- 还有两条箭头通往玩家的想象:沉浸的玩家不说"我按红键让化身扔钩爪",而说"我冲上山、扔出钩爪、爬上城墙"。人能把意识投射到所控制之物,前提是界面已成为第二天性。
交互回路与反馈(第 15 章 The Loop of Interaction)
信息在玩家与游戏之间循环,像推动水车的水流产生体验;游戏返回的信息即反馈,深刻影响玩家下一步做什么。
- 篮球网不影响玩法,但让进球清晰可见。
- Swiffer 拖把案例:用 #14 问题陈述之镜重新审视扫帚 + 簸箕的五个问题(扫不干净、站着难用簸箕蹲着难用扫帚、扫帚吸附差、手会脏、倒垃圾易洒),Swiffer 的一次性抹布逐一解决;更妙的是它解决了人们不会说出口的问题——问题 6:扫地缺乏反馈,不知道扫得有没有用,于是觉得徒劳、扫得更少("反馈越少,地板越脏")。用完后抹布上的脏污清楚展示成果,触发有用感、净化的乐趣和"掌握别人看不到的秘密"的乐趣,用户还会期待这一刻。问题 7:扫地无聊(重复、必须盯着没有惊喜的灰堆)——Swiffer 底座用特殊铰链连接,手腕轻转底座就大幅转动,像在家里开魔法赛车。
- 反馈缺失的例子:美国人行横道按钮要等近一分钟才知道是否生效,于是有人长按、有人连按、紧张盯灯;英国一些路口按下立即亮起 WAIT 灯,挫败变成掌控。
- 十分之一秒规则:界面若不在 0.1 秒内响应输入,玩家就会觉得界面有问题。新入行的动画师常给跳跃加 0.25–0.5 秒的下蹲预备动作,这是好的动画手法,却让玩家抓狂。
与引擎侧页面的对照:GEA 在 引擎输入系统 中介绍"单键延迟生效"(按下后等 2–3 帧以便识别和弦);在 30 fps 下 2–3 帧约 67–100 ms,仍在 Schell 的 0.1 秒预算之内,60 fps 下更宽裕。两者并不冲突,但提醒实现者:输入缓冲、动画预备、网络延迟会叠加,需整体控制在体感阈值内。
多汁 (Juiciness)(第 15 章 Juiciness)
抹布底座的运动是二阶运动 (second-order motion)——由玩家动作派生的运动。系统能产生大量玩家易于控制、带来力量感与回报的二阶运动时,就是多汁的:像熟透的桃子,一点点交互就带来源源不断的美味回报;反馈很少的界面则被称为"干"。界面应当有趣,否则"干涩痛苦的界面作为有趣体验的大门"会自相矛盾;乐趣是带惊喜的愉悦,界面也应两者兼备。Swiffer 好用到把工作变成游戏,呼应第 4 章"工作与游戏的区别在态度"(见 游戏的定义)。
原始性 (Primality)(第 15 章 Primality,第 3 版新增)
- 手机与平板的触屏常与多汁的乐趣相关,幼儿上手极快。"因为直观"是空话(直观 = 易懂),真正原因是触屏是原始的 (primal):触屏之前的计算机界面都是工具使用——操作一个物体,在远处(不在指尖)产生响应;人类用工具约三百万年,而动物凭直觉触碰东西已有约三四亿年。
- Schell 用"三层脑"结构解释:最底层"爬行脑"能处理触觉,工具使用可能需要新皮层参与。
- 推论:游戏越多调动大脑的原始部分,玩法就越直观有力——这解释了为什么那么多游戏有采集果实类物品、与威胁性敌人战斗、在陌生环境中找路、克服障碍接近配偶(科学家版的"拯救公主")。粗略判断:动物能不能做这件事?
存疑:书中的"三层脑(爬行脑—边缘系统—新皮层)"来自 Paul MacLean 的三位一体脑 (triune brain) 模型,该模型在当代神经科学中已被普遍认为过度简化甚至错误(例如 Cesario, Johnson & Eisthen 2020《Your Brain Is Not an Onion With a Tiny Reptile Inside》,Current Directions in Psychological Science)。"原始性"作为设计启发仍可用,但其神经学依据不宜当真。
信息通道(第 15 章 Channels of Information)
设计信息呈现(主要是箭头 5 和 6)的四步法,以 NES《塞尔达传说》为例:
| 步骤 | 做法 |
|---|---|
| 1 列出并排序信息 | 每时每刻要知道:近处环境;时常瞥一眼:卢比、钥匙、生命、远处环境(地图)、当前武器、当前宝物、炸弹;偶尔:其他物品栏 |
| 2 列出通道 | 屏幕上中、右下、化身、音效、音乐、屏幕边框、敌人胸口、头顶气泡……塞尔达选了主显示区 + 顶部仪表盘,按 Select 切到另一模式:辅助显示区 + 底部仪表盘 |
| 3 把信息映射到通道 | 主显示区放近处环境;顶部仪表盘放 7 项;物品栏放辅助显示区。仪表盘在主副画面都显示;生命占近三分之一;卢比、钥匙、炸弹都是两位数故归为一组;武器和宝物加框并标 A/B 提示按键;物品栏空余处写操作说明 |
| 4 审视维度的使用 | 伤害飘字可用数值、颜色、大小、字体等维度:可冗余强化同一信息(<50 白色小号,50–99 黄色中号,>100 红色大号特殊字体,也更多汁),也可在不同维度承载不同信息(颜色表示敌我、大小表示离死亡多近),更高效优雅,但需要教会玩家 |
界面模式(第 15 章 Modes)
界面模式就是六条映射箭头之一发生了变化(例:按 B 后摇杆从移动化身变为瞄准水枪,箭头 1 变了)。
- 模式越少越好,每个模式都要学习。
- 避免重叠模式:行走(摇杆导航)、投掷(摇杆瞄准)、驾驶(摇杆转向)若可同时处于驾驶和投掷,摇杆会同时转向和瞄准,可能是灾难;不如把瞄准统一放到第二摇杆。必须重叠时放在不同输入通道上:摇杆有飞行/行走两种导航模式,按钮有火球/闪电两种射击模式,可安全组合。
- 让不同模式看起来尽量不同:反例是 Unix 编辑器 vi,启动后处于命令模式,按 i 才进入插入模式,两者看起来一模一样,老手也会弄混。正例:大幅改变屏幕上的显著元素(Halo 与多数 FPS 换武器都很显眼;Halo 的弹药数显示在枪背上);改变化身动作(街机 Jungle King 从荡藤变游泳,连头发颜色都变了);改变屏幕数据(《最终幻想》系列与多数 RPG 进入战斗弹出战斗菜单;第 1 版具体指《最终幻想 VII》);改变镜头视角。
与引擎侧页面的对照:Schell 的"模式 = 输入映射改变"在 UE5 中有直接对应:增强输入 的输入映射上下文 (Input Mapping Context) 可在运行时按优先级增删,"驾驶""瞄准"就是不同上下文;Schell 的"避免重叠模式"对应于上下文间的按键冲突与优先级设计。虚拟界面层(HUD、菜单)在 UE5 中由 UMG、Slate 与 Common UI 实现。
其他界面建议(第 15 章 Other Interface Tips)
| # | 建议 | 要点 |
|---|---|---|
| 1 | 偷 | "自上而下":从同类型成功作品的界面出发再改;省时且熟悉,一个小改动常引出一连串改动 |
| 2 | 定制 | "自下而上":按信息、通道、维度从零设计;新玩法往往只能这样,旧玩法也可能因此发明新玩法 |
| 3 | 围绕物理界面设计(第 3 版新增) | 平台界面差异巨大(触屏、体感、键鼠、手柄、混合现实头显),想做"所有平台都一样好"的游戏通常导致平庸。《愤怒的小鸟 (Angry Birds)》的巨大成功部分在于把触屏用得极好;若核心交互充分利用某个物理界面的独特之处,放弃其他平台也值得(参照 #17 玩具之镜) |
| 4 | 主题化界面 | 界面美术常由另一位美术负责,用 #11 统一之镜让界面与整体体验一致(第 6 章) |
| 5 | 声音映射为触觉 | 虚拟界面几乎没有触觉,人脑很容易把声音映射为触感(如会发出咔哒声的触屏键盘);先想界面若是实物该是什么手感,再选能营造该手感的声音 |
| 6 | 用层级平衡选项与简洁 | 用模式与子模式分层,例如把物品栏和设置藏在不常用的键(如 Start)下 |
| 7 | 使用隐喻 | Disney《ToyTopia》:联网同步需要人为延迟命令,玩家困惑;加上从虚拟按钮飞向玩具的"无线电信号"和发报音效后,延迟变得可理解,还提供即时反馈并强化"遥控玩具"主题(#11 统一)。第 3 版为此新增 #67½ 隐喻之镜 |
| 8 | 看起来不同就该表现不同(第 3 版新增) | 为视觉变化把飞碟涂成红、紫、绿,玩家会以为它们速度或分值不同,若只是换色会失望困惑;反过来,同一个"X"有时表示关闭窗口、有时表示删除也会让人困惑 |
| 9 | 测试、测试、再测试 | 没人一次做对;在可玩前就用纸板原型测试按钮和菜单,像人类学家一样体会玩家每时每刻的意图 |
| 10 | 为帮助玩家而打破规矩 | 只用左键的儿童游戏常禁用右键,可孩子手小常按错;聪明的设计师让左右键做同一件事——只需一个键的游戏为什么不都这样? |
版本差异:第 1 版为八条建议,第 3 版新增"围绕物理界面设计"与"看起来不同就该表现不同",其余顺延。
已在第 3 版修正(撤销第 1 版勘误):第 1 版写 "the amount of info you have left … is right on the back of your gun"(Halo 2),"info" 应为 "ammo";第 3 版已改为 "the amount of ammo you have left",并把例子改为 Halo。
本页透镜
| 编号 | 透镜 | 核心问题 |
|---|---|---|
| #59 | 控制之镜 (Lens of Control) | 界面是否按预期工作?易于掌握吗?玩家觉得对结果有强大影响吗?玩家觉得强大吗(强大感 = 掌控感)? |
| #60 | 物理界面之镜 (Lens of Physical Interface) | 玩家拿起、触摸的是什么,能否更令人愉悦?如何映射到游戏动作,能否更直接?不能定制硬件时用什么隐喻?在玩具之镜下如何?玩家如何看到、听到、触到世界,能否加物理输出设备让世界更真实? |
| #61 | 虚拟界面之镜 (Lens of Virtual Interface) | 玩家需要哪些看世界看不出的信息?何时需要?如何传达而不干扰与世界的交互?哪些元素用虚拟界面交互比直接交互更容易?什么虚拟界面适合我的物理界面(弹出菜单不适合手柄)? |
| #62 | 透明之镜 (Lens of Transparency) | 界面让玩家做想做的事吗?练习后能不假思索地使用吗?新手觉得直观吗,允许自定义按键有帮助吗?在拐角、高速等情况下会出现令人困惑的行为吗?压力下玩家会手忙脚乱或漏掉关键信息吗?困惑出在六条箭头的哪一条?玩家有沉浸感吗?(题记 Edward Tufte:"无论界面多美,少一点更好") |
| #63 | 反馈之镜 (Lens of Feedback) | 此刻玩家需要知道什么、想知道什么?我想让玩家此刻感受什么,玩家想感受什么?玩家此刻的目标是什么,什么反馈有助于达成? |
| #64 | 多汁之镜 (Lens of Juiciness) | 界面对玩家动作给出持续反馈吗?玩家动作产生有力有趣的二阶运动吗?给奖励时同时以几种方式奖励,能否更多? |
| #65 | 原始性之镜 (Lens of Primality)(第 3 版新增) | 游戏哪些部分原始到动物都能玩,为什么?哪些部分可以更原始? |
| #66 | 通道与维度之镜 (Lens of Channels and Dimensions) | 哪些数据要在玩家与游戏间流动?哪些最重要?有哪些通道,哪个通道最适合哪类数据?各通道有哪些维度,如何使用? |
| #67 | 模式之镜 (Lens of Modes) | 需要哪些模式,为什么?能否合并?有重叠吗,能否放到不同输入通道?模式切换时玩家如何知道,能否用不止一种方式传达? |
| #67½ | 隐喻之镜 (Lens of Metaphor)(第 3 版新增) | 界面已经是某物的隐喻吗?是的话是否充分利用了隐喻,还是隐喻在碍事?不是的话,做成隐喻会更直观吗? |
版本差异:第 1 版编号为 #53–#60(控制、物理界面、虚拟界面、透明、反馈、多汁、通道与维度、模式);第 3 版新增原始性之镜 #65 与隐喻之镜 #67½("½"编号是为不打乱后续编号而插入)。
延伸阅读:Donald Norman《设计心理学 (The Design of Everyday Things)》;Steve Swink《Game Feel》(第 3 版称为必读);Edward Tufte《The Visual Display of Quantitative Information》。
全部透镜见 Schell 透镜总表。
Rogers 的视角:UI、HUD 与图标(Level Up! 第 3 版 Level 8 Sign Language: UI, HUD, and Icon Design,p.189–221)
Rogers 说 UI(也称 UX)设计同时需要游戏设计师的知识和平面设计师的技能,但掌握基础后适用于所有类型。
好的 UI 首先提供反馈——玩家不知道动作是否生效、自己处于什么状态,就无法判断成败。反馈线索:
| 线索 | 要点 |
|---|---|
| 声音 | 最常用(按钮咔嗒、面板哔声、完成目标的短音乐 sting);但有人关声音玩,不能只靠声音 |
| 动画 | 贵且耗时,但表达力强(装弹、包扎、按面板后门打开) |
| 颜色变化 | 激活变红、灰显文字可用后变色、直线加速赛的"圣诞树"灯由红转绿 |
| 文字变化 | 按钮、状态条、叙事内设备上的文字;本地化时可能需要更多空间 |
| 粒子特效 | "粒子永远不嫌多":《Peggle》(2007)、《Monopoly Go》(2023)、《Marvel Snap》(2022) 用粒子表示动作发生、攻击命中和庆祝胜利 |
| 触觉 (haptics) | 手柄与手机里的马达产生的振动 |
四种界面风格:
- 拟物 (skeuomorphic):外观或交互模仿现实对应物(按钮被画出厚度,虽然并不需要)。
- 叙事内 (diegetic):界面元素存在于游戏世界之内(《堡垒之夜》站在工作台前选择给步枪装哪些配件)。
- 符号式 (symbolic):存在于只对玩家可见的隐喻空间(《漫威蜘蛛侠 2》的技能树,每项技能配视频,画面上同时有两位蜘蛛侠——"他怎么能同时在三个地方?这就是游戏的魔力")。
- 无界面:只有少数游戏敢这么做——《The Getaway》(2002)、《金刚:官方电影游戏》(2005)、《地狱之刃》系列 (2017, 2024),靠动画、因果玩法、音效和角色喊话 (vocal barks) 传达信息,营造更沉浸、更电影化的体验。
人体工学分两种:物理人体工学(见 游戏操控:别让玩家横跨整个键盘去按关键功能,现实中只差几英寸,游戏中却很别扭)和虚拟人体工学(换弹、打兴奋剂回血等关键操作映射到 WASD 附近;查看排名这种需要下拉菜单的功能放到开始画面,让玩家从容地看,而不是在战斗中)——想清楚玩家怎么用这个功能,就决定了它放在哪、怎么访问。
无障碍 (accessibility):各种人都在玩游戏,色盲屏幕设置、为视障玩家提供音频描述、可重映射界面与操控等都很重要(脚注指向 gameaccessibilityguidelines.com 完整清单)。《最后生还者 第二部》(2020) 为盲、聋和运动功能障碍玩家提供了 60 多项无障碍功能,被 Rogers 称为革命性的。最后,好的 UI 要好记:离开一段时间再回来,也像"回家"一样。
怎样做 UI(不必是优秀的平面设计师):
- 先画线框图 (wireframes)——交互的分镜:画屏幕轮廓,复印后逐页画"屏幕上有个按钮→手指戳按钮→戳了之后发生什么(跳转、出现文字、向敌人发射火箭)",纸上理清后交给实现的程序员。
- 做简单界面:用文字框、圆、方块等"程序员美术"占位,只要能在游戏中运作就行。
- 狠狠地试玩:让尽可能多的人来"弄坏"它,你闭嘴观察。发现问题后:(A) 识别问题(记录玩家如何、为何用错,问玩家原因);(B) 考虑多个方案,而非第一个冒出的;(C) 执行修改;(D) 再测试——迭代是游戏设计的核心;(E) 监测变化,未解决就重复 A–D(另见 游戏测试)。
HUD(得名于现代飞机的平视显示器)是叠加在画面上的信息层,是与玩家沟通最有效的方式,能传达信息、情绪,甚至告诉玩家去哪做什么。Rogers 的元素清单与要点:
| 元素 | 要点 |
|---|---|
| 生命条 | 形式最灵活:填色条或图标(可由绿变红,空了就死);反过来的伤害条(满了就死);机载防御系统(《银河战士》);护盾与生命以百分比表示(《毁灭战士》);以护盾表示、护盾全无时再中一击即毁(《星球大战:战机中队》(2020));叙事装置(《刺客信条》偏离"正确的故事",旁白说"事情不是这样的"并重置);等待回复(《光环》躲起来等就回满——替代死亡画面的好折中,缺点是节奏变慢);全屏效果取代血条,第三人称也用(《绝地潜兵 2》(2024) 的血迹与指向伤害来源的红色模糊,但别挡视线;《银河战士 Prime》《阿卡姆起源》电击时屏幕"闪断";《使命召唤》与《神秘海域 4》变暗配喘息和心跳声;《寂静岭》临死时手柄模拟心跳) |
| 准星 | 从激光点到带目标血量、距离的锁定系统;别主导画面也别小到看不清;白色在某些背景上看不清;放大模式下可改变大小以便精确瞄准(《红色派系:末日审判》(2011));对准目标时变色或"聚焦"提示开火;加"粘性"即瞄准辅助 (aim assist),载具武器尤其适用;把玩法做进准星(《军团要塞 2》狙击镜的激光点会被敌人看到并躲避) |
| 弹药表 | 最常被盯着的读数之一,弹药稀缺的游戏(《生化危机 2》)更要放在显眼处;空间够就同时显示弹匣与单发(《Operation Wolf》(1987));多种弹药(手雷、火箭)一键调出(《瑞奇与叮当:毁灭工具》);永远显示当前武器的弹药;无限弹药也显示(换成 ∞ 符号),以告知当前武器(《合金弹头》《堡垒之夜》);许多 VR 游戏学电影《异形》把数字弹药计数器做在枪身侧面,一眼可见,计数归零时还制造紧张感 |
| 物品栏 | 药水、法术材料要能快速取用(热键、拖放);给一个能欣赏物品的地方(《古墓丽影》放大显示劳拉背包里的物品);限定空间、物品各有尺寸时物品栏本身成了谜题(书中以《暗黑破坏神 IV》(2023) 为例,见下方勘误);物品多时可按类型、名称、稀有度排序;写实或图标都要剪影清晰、配色简单;受限的物品栏要能逐步扩容(小袋→背包→无限魔法袋);要有永久存放处(基地),玩家讨厌丢东西,尤其是买来的;"魔法箱/次元袋"(《怪物猎人 崛起》《博德之门 3》):存进去的东西在后面的箱子里也能取出,免得来回跑 |
| 分数/经验 | 从个位数(《Pong》《Computer Space》)到四位(《太空侵略者》)、六位(《小蜜蜂》),1980 年代初街机热潮时高分为王;家用机时代被统计、完成百分比、文字连击评价(《鬼泣》(2001))取代(《生化危机》的评级系统让你熬过丧尸末日后得个"C");在线排行榜流行后分数与连击、统计、成就并存。分数仍多见于街机风格和日式 RPG(《最终幻想》),也回到了西方 RPG(《无主之地》(2009)、《子弹风暴》(2011)) |
| 正向信息 | 《真人快打》的"Finish Him!""Fatality!"与高分同样有奖励感。Jane McGonigal《游戏改变世界 (Reality Is Broken)》(2011) 认为游戏流行的原因之一是玩家在游戏中得到了日常生活中得不到的正向强化。祝贺时要大张旗鼓——开发者擅长让玩家觉得自己笨,却不擅长让人感觉良好(《Zack & Wiki》(2007) 每个小成功都有烟花和翻跟头的海盗兔)。用语音与音效;配音和音乐要与基调相符(Rogers 认为《糖果传奇》(2012) 欢快画面配阴郁音乐和旁白很怪);冻结画面或胜利动画;大量粒子;因果要清楚(金币"飞"向计数器,配拉斯维加斯式音效);字体易读,注意文字长度;铺满屏幕但不挡玩法 |
| 金钱/资源 | 获得和花钱的画面都要显示;玩家喜欢提前规划,即使还不能花也显示;数字位要比玩家能赚的上限更宽——到 $999.99 怎么办?还能继续赚吗?这是要做的设计决定 |
| 雷达/地图 | 最早见于《Rally-X》(1980)。要清晰又不占满屏,占满就暂停;能边移动边看,现代沙盒游戏允许在地图上加标记并引导到目标;图例和弹出文字提醒图标含义;标出高度变化(颜色或"洋葱皮"效果显示所在层);用箭头显示朝向或让地图随朝向旋转;战争迷雾可以提供全图揭示手段,Rogers 不喜欢 RTS 常见的重新起雾(玩家易迷路);加辅助信息(《阿卡姆起源》的距离计数、《合金装备》的警卫视锥、《哈利·波特与凤凰社》(2007) 活点地图上的 NPC 名字);主题化(奇幻用羊皮纸、科幻用全息),地图也构成整体感 (gestalt) |
| 情境提示 | 靠近可交互对象时出现的图标或文字,最常见的是按键图标(《绝地潜兵 2》(2024) 靠近可拾取物或固定武器时出现 X 键)。能教玩家做什么,免于乱按、背键位、读说明书,还让玩家更入戏(《阿卡姆》系列提示无声击倒、审讯,让你更像蝙蝠侠)。提示不必是字母或箭头,也可以是"魔法光晕"(VR 游戏《Dungeons of Eternity》宝箱锁孔冒粒子)。《Maximo》的"plings"表情符号同时提示能做与不能做。用于:门/闸/舱口能否打开;曲柄、拉杆、可推物的操作键;NPC 情绪(心情好时回报更好);可收集的物品和武器(《神秘海域》提示可拾取的兼容弹药,《无主之地》提示掉落物是否比当前装备好);载具或小游戏(炮塔);跳跃点(《塞尔达传说:风之杖》林克不能自主跳跃);QTE;战斗提示(敌人对某种攻击脆弱、即将攻击可格挡反击);靠近隐藏宝物时。燃料表、速度表、倒计时等自明元素同理:清晰、干净、简单 |
| 计时器 | 动作与竞速游戏常见,要显眼;临近结束时字号变大或变红;配合音效或语音提示,玩家不看也知道倒数 |
| 玩家名/头像 | 允许命名就要提供键盘界面(摇杆或十字键选字);留足字符,Rogers 说约 16 个字符是常见长度;玩家可能起不当名字,可请程序员做过滤,或改为从预生成的姓名列表选、随机生成(名单要适合目标年龄)。头像多用于 FPS、策略、VR、解谜等看不到主角的游戏,可做恐惧、兴奋、疼痛、愤怒的表情动画并配喊话;可让玩家换头像,或让头像带来加成(《Wordscapes》(2017) 选不同动物头像,可得心形、太阳或帮你拼词的蜜蜂——"spelling bees") |
干净屏幕:想要电影感又必须传达玩法与操控。HUD 元素闲置时滑出或淡出,有需要(受伤、拾宝)时再出现,并能一键(如肩键)唤出。更进一步是几乎无 HUD:《金刚:官方电影游戏》(2005) 只在开头用少量提示,此后靠声音、动画和特效传达。做法:让角色对世界作出反应(看向收集物、伸手够得到的地方、评论可互动之物);宁用全屏大效果也别用细微效果,声音、语音、特效、颜色、光照都用上;给物品加发光,或利用"史酷比效应"(汉纳-巴伯拉 1960–70 年代动画里可动元素平涂、背景精绘,可动物因此格外显眼);用过场角色引路,做不到就用颜色或灯光照亮道路,甚至让树叶朝该走的方向飘。临时 HUD:Rogers 记得《古惑狼》是最早"会让开"的 HUD 之一(拾到水果、加命或受击时弹出,一分钟左右无事件就滑走);《无尽之剑》系列只在出招时显示方向箭头,作为引导消除"往哪划"的困惑。另一端是"大量界面星球":RPG、RTS、模拟、冒险和部分射击游戏。
图标设计(Rogers 戏称"1578 条",脚注"上下差 141 条左右"):选对图(造坦克就画坦克);图像要与时俱进(年轻测试者不认识邮票);按颜色编码(火拳红、冰手蓝,同类功能同背景色,不同含义的红要区分色调),目标是让玩家一眼看出图标间的相似性;颜色不够就用形状(圆表示弹药、方表示回血);避免在图标里放文字(本地化与可读性),用文字作图标时要像按钮;不要在一个图标里堆多个视觉元素(文字、角色、标志分开存文件,便于编辑和本地化);用粗黑或粗白描边、柔光或投影让图标"跳"出来;把所有图标放在一起检查是否相似——既各有个性,又像一套;悬停显示名称;可利用在线资源(如 game-icons.net),也有人用 Midjourney、NightCafe 等 AI 工具;向 Apple、Adobe、Microsoft 的图标设计以及网站、RTS 和模拟游戏学习(《Maximo》的能力图标参考了童子军功绩章);点击要有反馈(变色、咔嗒声),语音反馈每三次左右才说一次并多录几条轮换;最重要的图标最大;常用图标放在屏幕中部或光标常驻处附近;图标略带"粘性"。
手机游戏图标:在应用商店里代表整个游戏,像电影海报或书封,可能是你为游戏做的最重要的一张美术。要求:清晰(剪影越强越好"读");标志性(像超级英雄胸前的标志,一张图概括游戏,别放多张图);颜色(红黄等原色比深蓝、紫、黑更抓眼,小屏上也更易看清;蓝橙、黑白等对比色让图像跳出);不放文字和数字(位图缩小后文字会锯齿或糊成一团,面向国际市场更应省掉)。
总原则 KYSS:保持符号简单 (Keep Your Symbols Simple)。游戏已有约定俗成的图标词汇:红十字(治疗;脚注提到加拿大红十字会认为在"暴力游戏"中使用红十字是滥用其商标)、1UP 或角色小头像(加命)、心形、食物/汽水/药丸、感叹号(敌人惊觉或主角可互动)、"禁止"符号、骷髅(毒、死、危险、海盗)、金币或钱袋、手柄按键图标。
快速反应事件 (QTE):迫使玩家瞬间作出动作、否则通常受伤或死亡的提示,有时也用于让过场更具互动性(Rogers 说它"原名 quick-timer event")。《龙穴历险记》(1983) 整个游戏就是 QTE,经《Cliffhanger》《Space Ace》《Thayer's Quest》等短暂风潮后几乎消失,《莎木》(1999) 让它复兴并命名,《生化危机 4》《战神》使之流行;体感游戏可用动作代替按键。用途:躲避突然的落物、汽车或足球;击退咬人的狗、九头蛇或鳄鱼人;用生死一击结束 Boss 或向逃跑的反派掷刀;战斗中追加伤害、反击、格挡、缴械,甚至把手雷扔回去;回应道德选择(从丧尸群中救谁)。负责任地使用:
- 不用 QTE 做玩家本来能自己操作的事,留给大场面和近乎不可能的动作(Rogers 把它当作通往过场的捷径)。
- 给一拍时间看清图标,再给一拍按键。
- 别拖太长,失败通常要重来。
- 要公平、可预测:随机图标让人觉得赢是靠运气;记住顺序后玩家才能专心看精彩动作。
- 只用一组按键(按钮或摇杆),避免难按的肩键;图标要大、位置固定。
- 尽量别强制(《神秘海域 2》《阿卡姆疯人院》里 QTE 只是解决敌人的选项之一)。
- "连打"型 QTE 可以放大情绪或模拟用力;也可以纯为情感(《暴雨》臭名昭著的"Press X to Jason"——按 X 呼喊走失的儿子)。
- 体感 QTE 的挥动要短、别连续太多次。
HUD 放在哪:屏幕中部是动作发生处,除了准星和目标标识外别放 HUD;全屏显示可做成半透明(《死亡空间》(2008) 全息界面),玩家不会与环境脱节。左上角传统上放最重要的信息(生命、分数)——西方读者视线从左到右,看完左边再回到右边的游戏画面。底部也行,但要防止未校准的显示器或电视裁切:假设至少一半玩家的电视很烂,信息尽量靠近安全框 (safe frame) 并提供画面校准。同时占用左、右、下三边会产生"包框效应",画面像从邮件投递口往外看。图标很多时可让玩家选择显示哪些、放在哪(但不许挡住主玩法区)。打开二级界面要能快速返回,可考虑暂停;《死亡空间》故意不暂停(据团队访谈,是不想让玩家依赖"世界冻结"这种很"游戏"的机制,如《生化危机》),让翻背包找氧气罐时的尸变体逼近成为恐惧来源。
三次按键法则:到达任何游戏屏幕都不应超过三次按键。必要时合并屏幕,并统计到达每项信息的按键数;Rogers 曾把"从开机到开始玩"从 16 次按键降到 4 次。
其他屏幕:
- 标题画面:电影海报式、英雄造型式、"谜之图像"式(玩过才懂其意义)、标志式(加闪烁、旋转、弹跳等动效)。菜单项(存读档、人数、选项、额外内容、难度)多少取决于你希望玩家按几次键才进入正题——玩家只想尽快开玩。
- 暂停画面:可存档、进选项、地图、物品栏,或单纯供欣赏(《班卓熊大冒险》(1998) 的原声吉他版主题曲);让玩家觉得没错过任何东西(多数人暂停是去厕所);也可像《死亡空间》那样干脆不给暂停。别把"继续"放第一项——用开始键再按一次关闭即可;最常用的是存档就把存档放第一,否则放地图或物品栏。选项画面当作"轮毂",各设置是"辐条"(音量、操控、难度、额外内容与作弊码)。
- 画面校准:昏暗的游戏最好在开始前就让玩家对着暗色图像或色条调对比度。
- 存档/读档:尽量自动;新游戏一开始就建存档,尽早(甚至在教学中)让玩家知道存档在哪。存档画面元素:头像(可换角色时便于区分)、文件名(主机与 VR 要弹出虚拟键盘)、完成百分比、所在关卡、删除按钮(书中图注编号跳过了 4)。至少三个存档位(重玩、备份、他人同时玩);可命名,显示游玩时间、关卡或章节名、命数与装备、图片;自动存档并显示正在存档的图标,以免玩家关机丢档。别让存档变成"重置系统"(读档比死亡重来更快),不要让存档成为玩法机制,否则破坏沉浸。
- 读取画面:开发者常不把它当作游戏的一部分。设计师要事先了解技术限制;较新的游戏用缓缓开启的门、长电梯、渐散的雾伪装成"无缝",但伪装本身也要加载,别太复杂;至少有一个元素在动,否则玩家以为死机。必须有就展示概念画、问答、可玩小游戏(脚注:南梦宫持有美国专利 #5,718,632)、地图、角色简介、提示(别重复已看过的)、补充故事或进度回顾、任务简报视频、无尽的敌人波次或可破坏的大物体、"美景镜头"、可把玩的标志或物件。硬件厂商要求读取画面有动态画面;要有进度条或百分比。
- 操控画面:先放手柄图,标出每个键的动作(或演示动作的角色,至少文字说明),游戏中随时可查,允许改键或提供多套方案。
- 结算画面 (tally screen):分数、用时、命中率、击杀数、金钱、命数、评级(A/B/C 或"Awesome dude""Master of the Universe")、目标完成、秘密 X/Y、流血加仑数、行进距离、砸箱数……
- 法律/版权画面(可能不止一个):发行商和硬件厂商要求,用于声明版权或警告(如闪光可能诱发癫痫),开发者也借此保护 IP、规避法律问题;文字要清晰、准确;主机厂商通常要求不可跳过。
- 制作人员名单:Rogers 的"肥皂箱"——太多人因自负、政治和疏忽被剥夺署名;做过就该署名,且与名片上的头衔一致:该署名的署名 (Give credit where credit is due)。名单要尽量有娱乐性(《小小大星球》的开场名单;《死亡打字员》(2000) 可以打字打出名单)。电影 DVD 菜单是营造整体感的好参考;脚注举的整体感范例是《邪恶冥刻》(2021)、《哈迪斯》(2020)、《艾迪芬奇的记忆》(2017)。
字体:与图标规则类似。主题化但别过于华丽难读;字体往往需要授权(Rogers 知道有游戏在最后关头因无权使用字体而返工);注意文字与背景色,红字配黑底在许多电视(尤其老电视或复合视频线连接)上会糊;用较高分辨率字体,标清电视上 18 磅以下的字很难读(《丧尸围城》(2006) 的文字小到标清玩家看不清任务目标)。
游戏结束画面常被拖到最后才做,结果只是滴血字体的"Game Over"。用心的例子:《龙穴历险记》按死亡房间有不同死亡画面;《波斯王子:时之沙》(2003) 与《堡垒》(2011) 的旁白改口"事情不是这样的"让主角复活;《阿卡姆》系列让击败你的反派对着蝙蝠侠的身体得意洋洋;《班卓熊大冒险》有一整段过场演示没救出妹妹的后果。Rogers 主张把它当作把玩家送回战斗的跳板而非终点——给玩家退出的机会他们多半会退出,所以建议改成"继续前进 (Keep Going)"画面:预告继续玩会遇到的关卡、Boss、武器、技能升级。
版本差异:第 3 版(p.189–221)章名由 "Sign Language—HUD and Icon Design" 改为 "Sign Language: UI, HUD, and Icon Design",并大幅扩写:新增开篇的反馈线索、拟物/叙事内/符号式/无界面四种风格、物理与虚拟人体工学、无障碍(《最后生还者 第二部》)、"好记"、怎样做 UI(线框图—占位—试玩五步);HUD 新增正向信息独立小节、金钱/资源、计时器、玩家名/头像,以及 VR 枪身弹药计数、∞ 符号;图标部分新增在线资源与 AI 工具、手机游戏图标一节;新增 "Press X to Jason" 等 QTE 用途、字体授权、游戏结束画面与"继续前进"画面。示例更新:生命条百分比由《X-Wing》改为《毁灭战士》并加《星球大战:战机中队》,伤害模糊由《神秘海域 2》改为《绝地潜兵 2》,准星由《红色派系:游击战》改为《红色派系:末日审判》,物品栏尺寸由《暗黑破坏神》改为《暗黑破坏神 IV》,魔法箱由《生化危机 2》改为《怪物猎人 崛起》《博德之门 3》,地图标记由《GTA4》改为泛指现代沙盒游戏,距离计数由《阿卡姆疯人院》改为《阿卡姆起源》,情境提示由《GTA3》改为《绝地潜兵 2》。删去"别把图标交给程序员做"一条。本页旧版据第 1 版把法律画面记为"可跳过",第 3 版明确写主机厂商通常要求不可跳过,已改正。
与 Schell 的对照:Schell 第 15 章从交互环路、反馈、通道与维度、模式和隐喻讲界面的原理;Rogers 给出 HUD 各元素的逐项清单和"三次按键""KYSS"等硬规则,两者一理一用。第 3 版 Rogers 也以"反馈"开篇,与 Schell 的交互环路观点一致;Rogers 的"拟物/叙事内/符号式"分类与 Schell 的"虚拟界面层厚薄"是同一问题的两种切法。UMG 等实现见 UMG、Slate 与 Common UI。
原书问题与过时:
- (第 3 版仍在,p.196)《古墓丽影》标为 1995 年:首作 1996 年发行(Core Design/Eidos;本书 Level 6 也写作 1996)。
- (第 3 版仍在,p.210 脚注 15)"许多亚洲和中东语言从右往左读":现代中文、日文、韩文横排都是从左往右,从右往左的是阿拉伯文、希伯来文、波斯文等(来源:Unicode Standard 第 9 章 Middle East-I 关于双向文本的说明)。
- (第 3 版仍在,p.216 脚注 17)提醒南梦宫拥有读取画面小游戏的美国专利 US 5,718,632:该专利 1998 年授权,按美国专利 20 年保护期(自 1995 年申请起算)已于 2015 年前后到期(来源:Google Patents US5718632A)。
- 第 3 版 p.196 称《暗黑破坏神 IV》(2023) 的物品栏"每件物品有特定尺寸"、物品栏成了拼图:《暗黑破坏神 IV》的物品栏是统一的一格一件,按尺寸占格的是《暗黑破坏神 II》(来源:Blizzard《暗黑破坏神 IV》官方指南/背包界面;Wikipedia "Diablo II" 关于网格物品栏的描述)。
- 第 3 版 p.190 "Skeuomoprhic" 为 skeuomorphic 的排印错误。
- 第 3 版 p.199 脚注 5 "Die Gestalt is German for 'whole'":德语 Gestalt 意为"形状、形态","整体"义来自格式塔心理学"整体大于部分之和"的引申(来源:Duden 词典 "Gestalt" 词条)。
- 第 1 版的《刺客信条》标为 EA 发行、脚注 "Hanna Barbara" 两条:第 3 版已删去发行商、改为 Hanna-Barbera,故删去。
出处
- The Art of Game Design, 3rd Edition (Jesse Schell).epub
- Jesse Schell《The Art of Game Design: A Book of Lenses》第 3 版(CRC Press, 2019)第 15 章 Players Play Games through an Interface
- Jesse Schell《The Art of Game Design: A Book of Lenses》第 1 版(Morgan Kaufmann, 2008)第 13 章,仅用于版本差异;原 PDF 已不在 raw/books,未能复核
- Level Up The Guide to Great Video Game Design (Scott A. Rogers).epub
- Scott Rogers《Level Up! The Guide to Great Video Game Design》第 3 版(Wiley, 2024 年 12 月出版,版权页 ©2025;ISBN 978-1-394-29876-1) Level 8
- Level_Up_The_Guide_to_Great_Video_Game_Design_-_Scott_Rogers.pdf
- Scott Rogers《Level Up! The Guide to Great Video Game Design》第 1 版(Wiley, 2010;ISBN 978-0-470-68867-0),仅用于版本差异
- Scott Rogers《Level Up! The Guide to Great Video Game Design》第 1 版(Wiley, 2010) Level 8