知识UI
不同类型的 HUD 设计
原文地址
翻译: @MoneyKitty(money-kitty) @Liuyuxuan(liuyuxuan-sptf8)
审校: @Liuyuxuan(liuyuxuan-sptf8)


HUD UI 的四种类型为非植入式(non-diegetic)、植入式(diegetic)、空间性(spatial)和元(meta)。每种UI都有各自优缺点,在艺术指导、预制作、实施和设计方面也有不同的预算要求。
image.png

非植入式 UI(Non-Diegetic UI)

非植入式 UI 与游戏主体分离。角色不与 UI 元素互动,UI 是游戏图形渲染的最后一层。大多数游戏都使用了非植入式 UI。
美术指导有可能会受到游戏环境的严重影响,它有可能基于故事元素,也可能专注于使信息易于阅读。精心设计的 UI 会影响美术指导,与美术指导紧密合作有利于确定风格走向,并以此为基调完成游戏和 UI 的设计。
列出游戏的核心元素是开始预生产非植入式 UI 的第一步。接下来,在游戏的屏幕截图上简略画出每个 UI 组件。和游戏设计师一同尝试找出游戏摄像机的最佳放置位置以及要传达给玩家的核心信息。
对 UI 元素的功能,大小和位置进行原型设计将有助于推动 UI 的总体设计。在某些情况下,有可能找到非游戏性设计以外的设计方法在游戏中显示信息。
设计非植入式 UI 通常是 UI 设计师的工作,他们创建资产,这些资产将在 UI 的中间件中实现或硬编码到游戏引擎中。构建了这些资产,UI 设计人员就可以开始调整每个 UI 元素的运动,定时,不透明度,颜色和位置。
image.png
《星球大战:前线》
_
设计非植入式 UI 时,应当注意游戏玩法中每个元素的易读性、时机和位置。
非植入式 UI 的优点:

  • 易于设计和实施
  • UI 的核心开发不依赖于游戏其他部分
  • 由于 UI 是渲染的最后一层,所以易读性不受游戏玩法的影响。
  • UI 的性能在开发的早期就可以考量

非植入式 UI 的缺点:

  • 可能使画面变得繁杂引起信息过载
  • 有可能妨碍游戏
  • 可能打破完全沉浸式体验的理想
  • 仅限于 2D 设计,效果少,照明更少

    植入式 UI(Diegetic UI)

    全境封锁、死亡空间这类游戏采用了植入式 UI 的设计。玩家和角色都需要与 UI 交互,塑造了更好的沉浸式游戏体验。
    植入式 UI 的设计方向倾向于科幻电影和电视中常见的高科技外观。使用这样的视觉效果既可以呈现清晰的信息,又避免了复杂的纹理和华丽的视觉元素影响 UI 传达信息。
    与非植入式 UI 一样,植入式 UI 的预生产从游戏给玩家传达信息的核心元素列表开始。很少有游戏完全依赖植入式 UI:由于 UI 是在游戏中呈现的,因此会带来性能上的损失以及对许多生产资源的依赖。选择可以使玩家沉浸在游戏中的核心 UI 元素,并在预生产的早期阶段创建原型。由于植入式 UI 处于游戏世界里的对象、角色、摄影机设置和自定义动画之中,因此要确保有合适的团队全力支持,以及有足够的预算。
    植入式 UI 的一个范例是《死亡空间》中的主角设计,开发人员希望在该角色的宇航服上显示玩家生命值。这需要概念美术师、角色建模师、技术美术师和工程师的共同合作,以在预生产的早期阶段设计血条、原型化并测试该植入式 UI 设计能否在游戏中真正起作用。
    设计植入式 UI 时,要注意每一个元素的易读性。此外,与游戏设计师沟通,确保 UI 组件不干扰游戏核心玩法,也不会阻碍玩家的游戏进度。
    image.png
    《全境封锁》
    _
    植入式 UI 的优点

  • 与游戏本身相结合的 UI 设计塑造了更好的沉浸式游戏体验

  • 更少的 UI 意味着游戏主体有更大的屏幕空间
  • 该设计被简化为核心 UI 元素,这使得信息更易于理解
  • 由于游戏性 UI 很少被使用,因此将其应用到游戏设计中可以获得一些竞争优势

植入式 UI 的缺点

  • UI 的核心开发取决于游戏的其他区域
  • 完成游戏性 UI 需要大量生产资源
  • 用户界面中的更多区域需要错误修复和完善
  • 游戏整体渲染的性能可能会受到影响

    空间性UI(Spatial UI)

    空间性 UI 包括效果、轨迹和角色轮廓,通常与植入式或非植入式 UI 结合使用。《最后生还者》、《神秘海域 4》、《__刺客信条》等游戏使用空间性 UI 在给敌人描边使敌人在屏幕中的位置更明了。
    空间 UI 不需要太多美术指导,因为它主要由用于游戏设计目的的游戏内效果构成。
    首先创建一个将向玩家传达信息的核心元素列表。一旦确定了核心元素,请技术专家和工程师参与为 UI 实现着色器和逻辑。建议在预研中进行早期原型制作,并应确定任何潜在的性能和渲染问题。但是,UI 元素也可以在制作过程中添加,并测试其在游戏中的有效性。
    空间性 UI 的设计基于技术美术和工程师编写的着色器。颜色的选择和 UI 的出现时机通常由游戏和 UX 设计师确定。
    UI 的表现 - 图4
    《刺客信条:枭雄》截图
    _
    使用空间性 UI 的优点

  • UI 与游戏更融合,体验更加沉浸

  • UI 以更清晰独特的方式标记游戏内的角色和物体
  • 通常情况下,与植入式 UI 相比,对性能的影响较小,并且实现起来更容易

使用空间性 UI 的缺点

  • 实现需要额外生产资源
  • 比传统的非植入式 UI 相比承受更大的性能冲击
  • 游戏在画面上受到 UI 艺术方向的限制

元UI(Meta UI)

元 UI 不用于呈现任何内容,只是通过降低 UI 或玩法饱和度,如添加诸如血、泥或水的飞溅之类的游戏内元素来创建视觉效果。通常使用元 UI 传达天气状况和环境效果。
与 UI 美术或UI设计师相比,往往更是艺术总监更多使用元 UI。元 UI 为游戏增添氛围,并且可以作为用于传达 UI 信息的微妙元素。
由于大多数元 UI 都是利用为游戏制作的纹理和着色器创建的,因此必须确定全屏效果的使用范围。这些范围不需要在预研中创建,因为它们通常作为表现血量或环境状态变换的辅助元素
为了实现元 UI,技美或工程师将编写着色器,并且工程师和 UI 美术将实现状态条件。
除了用于更改环境和天气状态外,元 UI 还可用于通过以下方式显示血量状态(濒死、死亡和技能):

  • 渲染着色器以减少屏幕饱和度
  • 将整体调色更改为夜视仪模式、热成像模式、监视器模式等等

元 UI 通常与其他 UI 技术结合使用。
UI 的表现 - 图5
《极限竞速:地平线 3》截图

使用元 UI 的优点

  • UI 通常是涉及整个游戏的全屏效果
  • UI 清楚明确地标识了游戏中的状态变化
  • UI 很好地作为对传统非植入式UI的一种补充

使用元 UI 的缺点

  • 实现需要额外的生产资源
  • UI 受限于屏幕效果,因此在传达详细信息时只能提供较低的保真度