【干货】游戏界面设计 (五)表现设计

频道:游戏专题 日期: 浏览:5

游戏界面设计 带入感 个性化_游戏网页专题页面设计

关联阅读:

(1)游戏界面设计 (一)核心设计

(2)游戏界面设计 (二)结构设计

(3)游戏界面设计 (三)信息设计

(4)游戏界面设计 (四)体验设计

许多人在评价界面时首先想到的是视觉呈现的效果和特点,过一会儿才能想到使用体验,这说明视觉呈现设计在界面设计中的重要性。

策划受专业限制,难以判断美术作品的优劣,不过可以分析界面风格带给玩家的感受是否符合要求,设计中的创新之处体现在哪里,应当选择何种呈现方式,界面制作是否达到预期标准等。经由讨论这些方面,策划能更有效地管理界面水准。

要回应这些疑问,策划应与UI美术就“是否必要”和“是否具备”【沉浸力】,【独特性】,【激励性】,【警示性】四个方面进行顺畅交流。

一、带入感

界面营造的沉浸效果在于使玩家感受到视觉元素与游戏环境的高度融合,进而激发其主动融入虚拟世界和剧情的兴趣,这种体验强调的是情景的契合度。而界面的实用价值则侧重于满足玩家操作层面的需求,两者在界面设计中存在明显的区别。需要指出的是,界面设计虽然能够有效提升沉浸效果,却不能直接创造玩家的情感共鸣,这种深层次的代入感需要在游戏过程中的互动体验中逐步形成。

界面的沉浸性有助于构建背景设定,提升作品的真切感,接着有利于人物形象刻画,最终促使受众产生亲切感。

有些游戏的视觉呈现并不必须营造沉浸氛围。那些以关卡环境为核心玩法的作品,参与者的关注点主要在角色和场景互动,界面设计需要以实用为首要目标,避免干扰核心感受(比如:广阔地图,激烈对抗,小型区域探索)。

游戏网页专题页面设计_游戏界面设计 带入感 个性化

互动感受基本在视觉界面展开,界面设计能强化沉浸效果,避免感受浅显,比如卡牌类游戏,模拟经营类游戏,以及回合制角色扮演类游戏。

游戏网页专题页面设计_游戏界面设计 带入感 个性化

确定界面需要带入感后,可参考以下思路:

1.1主题元素

表现主题的方法:

正面体现:从特定领域挑选标志性物品或文化象征,将其与视觉界面有机结合。

业内普遍采用这一方法,其优势体现在:当人们回想游戏过程时,往往会不自觉地在脑海中重现游戏世界中最突出的物品或标志物,只要能够持续强化这种印象,就能帮助玩家牢固记住游戏特色,同时唤起他们曾经的愉悦感受,最终促使他们产生喜爱之情。

具体实施时,界面能够:依托于某个特定载体呈现(例如《辐射4》中将界面显示在三维终端装置上);伪装成某个物品的模样(比如成就等界面会设计成书本形态);在界面中放置物体或符号(诸如《幻塔》把二级菜单按键做成六边形来体现未来科技感)。

游戏网页专题页面设计_游戏界面设计 带入感 个性化

《灵魂献祭》里,主角的许多游戏情节依靠回想书里情节来推动,所以游戏里所有界面都设计成书本页面的模样;玩家所属的团体有自己的专属徽记,并且会出现在界面上

(2)侧面烘托:使用形状/颜色/明暗等方式暗示主题。

这种技巧借助思想而非具体事物,营造出期望的情绪或场景,让参与者明白置身何种环境之中,此类手段常将常见元素拼接起来,表达核心主旨,参与者更容易不知不觉地理解背景设定,且能更专注于游戏的核心体验。

游戏界面设计 带入感 个性化_游戏网页专题页面设计

《死亡空间》旨在呈现未来科幻世界的互动性,众多界面广泛采用了斜置的发光显示屏,而横幅的形态也容易让人联想到工业装甲的构造

(3)配套支持:文字措辞需要适应游戏主题

这方面文案设计人员需要留意,文字的润色应当和界面设计/核心思想相吻合。例如,在比较随意、生动的动漫类游戏界面中,可以采用更多口语化的表达方式。

1.2交互元素

点选界面后若仅呈现简短动态影像,且缺乏明确功能组件,这类设计可称作交互部件。这类部件于世纪初初期,常被用作增强沉浸感的辅助手段,并在众多游戏中广泛运用。若要提升品质并注重界面感受,此类项目值得着重改进。

游戏界面设计 带入感 个性化_游戏网页专题页面设计

《王国保卫战》这款塔防游戏中,场景内非战斗物件例如树木,生物等,互动时会产生相应效果;《炉石传说》则在这方面更为丰富,比如在战斗区域点击布景,能看到扬尘等细节表现

1.3仪式感

完成核心任务之前,系统会设置一些需要用户参与的过渡环节,这些环节被称作具有特殊意义,是用户自己赋予其价值,让过程更显重要。

或许有人觉得那种铺陈的场面纯属多余,不过针对二次元爱好者或者追求年轻化体验(换言之他们倾向于脱离现实)的群体来说,这样的环节能够提升他们的掌控体验和代入程度,甚至还能带来某种难以言喻的神秘魅力。

界面上的特殊氛围通常伴随关键进展发生,例如角色能力大幅增强,或进入全新故事篇章。又或者在结果具有重大影响且难以预料时出现,比如进行抽卡,发放随机奖励等情况。然而这种特殊氛围从本质上讲,仍会增加玩家的操作负担,主要目的是加强沉浸感,因此不能随意使用。

游戏网页专题页面设计_游戏界面设计 带入感 个性化

《阴阳师》式神召唤界面曾将这种仪式感发扬光大

1.4音效

声音效果是激发听觉反应的关键环节,同时是营造沉浸体验的必要条件,不过由于对收益表现效果不显著,在国内一直未能得到充分关注,声音效果对沉浸体验具有显著价值,应该投入精力进行优化,幸运的是近年来正逐渐获得更多关注。

界面音效的运用注意以下几点:

(1)贴合交互元件(按钮)的实际形象。

说明点击后具体产生了什么效果,若按钮具备明确外形,则应配合相应材质的撞击音效,倘若按钮呈现扁平设计,那么采用电子合成音效更为适宜

(2)根据可交互状态区分音调高低。

可点击状态下音调会凸显出来,灰显状态下则显得低沉。要注意同一个按钮的声音来源要保持统一。

(3)高频次的非功能性交互元件的音效,做一些随机化。

常规的二次提示框界面仅具备实用功能,其按键声音的实用价值要高于情感表达,必须保证其唯一性。但是非功能性界面元素,在音效方面适当加入一些不确定性,能够减轻使用过程中的乏味感。

游戏网页专题页面设计_游戏界面设计 带入感 个性化

手游《天地劫:幽城再临》中点选玩法章节时会发出随机琴弦声

(4)根据界面核心需求分配音效时长。

界面出现肯定信息,若是积极反馈,比如赢得奖励或战斗成功的消息,可依据影响分配1到2.5秒的音效,以此增强情绪呼应;若是消极信息,例如遭遇战败或强化尝试落空的讯息,音效时间须压缩在1.5秒以内,避免加剧沮丧情绪。

二、个性化

玩家经常提到某个游戏界面的艺术风格很特别,但是又无法准确描述出其中的独特之处,这种界面中突出的设计风格可以称作是界面呈现方面的个性化特征。

独特性并非仅指艺术流派,而是侧重于思想(感受体验)的挑选和强化。这种思想既可以是明确的主题例如“自然景观,未来构想,都市气息”,又可以是模糊的意境诸如“简约主义,活力四射,前卫风尚,激情澎湃”。

游戏网页专题页面设计_游戏界面设计 带入感 个性化

界面里的定制化是一种投入不大又能塑造游戏独特画面的手段,像是一张一目了然的宣传单,特别容易吸引注意。不过,如果个性化风格过于鲜明,可能会让受众变少(需要付出更多认知精力)。

构思整体框架时,应侧重突出独特性,而描绘基本情境或作为补充说明的部分,则不必过分强调个性特征。若要增加独特性,可参考以下几种途径:

2.1组合

融合部分特定的构想或是既有的艺术流派,可以孕育出一种创新的美学,这种美学需要全面应用在各个界面设计上,目的是为了凸显游戏的中心思想或营造环境的氛围。

构思方式需参照环境里的时间地点特色,挑选若干标志性的物件或准则来开展整合探索。这样做能够塑造出与众不同的格调,并且十分有助于使用者留下深刻印象。

游戏网页专题页面设计_游戏界面设计 带入感 个性化

《荒野大镖客2》的视觉呈现融合了复古影像与斑驳质感,界面元素借助钢笔淡彩勾勒轮廓,整体营造出别具一格的视觉体系

2.2夸张

部分游戏将现实中的既存观念或初始构想加以放大、变形、重组、对照或延展,对某种特定感受进行渲染,从而产生更为鲜明的独特性。

这种做法特别容易抓住人们的注意力,不过必定会削弱文字的流畅度,对于普通读者来说并不友好,因此其他项目在参考时通常会进行适度的修改。

游戏界面设计 带入感 个性化_游戏网页专题页面设计

《女神异闻录5》是二次元项目广泛模仿的对象,堪称典范之作,它极尽创新地运用图形与色彩,将“时尚,青春,都市”的构思发挥到了极致,给整个作品注入了鲜明的风格特征

倘若观念实施不够周全,便会产生不协调的混搭式界面布局,因而对设计者的能力有很高要求。

游戏网页专题页面设计_游戏界面设计 带入感 个性化

《先驱》这款卡牌游戏,在模仿P5风格上用力过猛,却未能领悟其核心要义,实在令人遗憾

2.3色彩

部分游戏会为界面设定一个主要色彩,偶尔会再选一个辅助色彩,这种单一色彩会被广泛使用在各种界面元素上,目的是让玩家能够快速识别游戏的主题或者系列归属。这种做法相当普遍,只是具体实施的方式和强度存在差异。

游戏界面设计 带入感 个性化_游戏网页专题页面设计

这款游戏运用特定色调来塑造玩家的感受,其手法与品牌标志的色彩运用方式相似

三、体现变化

界面显示能够反映游戏情境的演变,同时引发使用者相应的感受,通常包含两类情形,一种是使用者获得的积极反馈,表现为视觉上的鼓励,另一种则是游戏环境发生的实际转变,用以配合主题内容。

3.1视觉激励

玩家成功完成游戏环节的挑战后,除了系统发放的回馈和新增的可玩元素,视觉界面也要相应地给予积极的反馈,从而增强玩家的成就感和对后续内容的向往,进而提升沉浸程度或促使特定操作爱游戏app入口官网首页爱游戏ayx官网登录入口,例如,领取奖励的弹出窗口会运用更细腻的图案和光芒效果;稀有道具会展现动态的光泽并搭配专属的背景设计;促销活动的版面会采用更多样的色调。

游戏网页专题页面设计_游戏界面设计 带入感 个性化

品质框仅按色彩划分,表明界面设计仅顾及信息辨别功能,若增添更多纹路选择以提升美观度,则显示其兼顾了视觉享受需求

游戏界面设计 带入感 个性化_游戏网页专题页面设计

游戏《黑潮之上》的七日累计打卡会将已打卡的记录汇总成一幅图画,玩家对于最后呈现的模样充满期待,这种操作也是对界面视觉吸引力的尝试,值得提倡

这种激励方式仅限于单方面互动,一旦融入双方交流(社交需求),便会衍生出诸如个人资料展示、形象装饰、专属卡面等平台特色功能。视觉设计同样能激发玩家的成就体验和满足感,有时还能转化为可交易物品。

游戏界面设计 带入感 个性化_游戏网页专题页面设计

《原神》的卡片其实是界面背景的调换,玩家的社交愿望催生了这种机制,这同时也是界面视觉引导的显著范例

3.2呼应内容

经验丰富的界面设计师明白,针对不同挑战等级的切换界面,常常需要准备多套背景图来展示难度差异。这种做法本质上遵循了界面调整与内容匹配的设计原则。

游戏界面设计 带入感 个性化_游戏网页专题页面设计

《炉石传说》狂野模式界面中会出现生长的藤蔓,而其他模式没有

这种界面上的调整需要遵循统一的设计规范,并且要体现出层次递进的感觉。不过目前很多游戏出于经济考量,并没有广泛采纳这种理念,例如玩家提升到不同等级时,常见的界面元素会从低级变为高级。将来可以留意一下,看看哪家游戏会率先采用这种方法,实际效果怎么样。

四、注意点

4.1识别优先

部分界面设计会为了追求完美视觉效果而降低辨识度,这样做对游戏者的感受影响很大,弊大于利。应该关注到的方面有:

4.2宗教和组织

在咱们国家,描绘宗教团体或真实历史机构时必须格外小心爱游体育app下载官网,若非必要,就采用迂回手法,塑造一个既让人联想到原型,又明显有所区别的形象,哪怕只是让人联想到也不行。否则,内容很可能在审核阶段就被驳回,即便上线后也容易引发争议和负面舆论。

国外推出的作品,最好配备懂得当地语言文化的人员,否则难以像贝塞斯达那样创作出《德军总部》系列且不会遭到禁令。

因此任何美术素材审核时都要请策划稍加注意,即便是带有咒语或者用其他符号点缀的图像,美术部门也必须说明其寓意。

游戏界面设计 带入感 个性化_游戏网页专题页面设计

Konami出品的《寂静岭》系列里,护士角色佩戴的帽子没有印上红十字图案,这种设计通常不会出现在同类题材作品中;根据个人观察,日本企业往往倾向于移除那些可能引发争议的视觉符号

4.3品味区分

社会各阶层及不同年龄的参与者,其喜好存在差异,在界面呈现构思时,应予以恰当匹配,

中年群体中80后以前的人容易被特别突出的图像吸引目光,比如那些带有炫目光芒的大翅膀形象,或者是中老年人群像的表情包。

游戏网页专题页面设计_游戏界面设计 带入感 个性化

青少年对色彩反差反应更积极,不过不会选用过于刺眼的色彩,持续注视容易感到疲倦,甚至存在引发光敏性癫痫的可能性,可以借鉴Q版作品或儿童类游戏的设计思路。

游戏网页专题页面设计_游戏界面设计 带入感 个性化

偏爱东方文化背景的参与者,更习惯于视觉界面承载丰富细节,而欧洲地区的用户则呈现不同倾向。

越是面向普通人群的方案,构思时越要寻求平衡,摒弃那些过于极端的构思,确保整体效果适宜大众接受。

游戏界面设计 带入感 个性化_游戏网页专题页面设计

《部落冲突》的怪物设计基本上都舍弃了令普通民众厌恶的特质,并将这些特质变得柔和,变成了类似人类的生物,这让它们更容易被人们所接受

以上只是简单举例,后续会总结更多,欢迎补充。

五、本章知识框架

游戏界面设计 带入感 个性化_游戏网页专题页面设计

策划与UI设计师通力合作,打造视觉上令人愉悦的界面并非难事,当然策划方面在呈现上要多参考UI美术的意见。当前关于界面设计的知识要点已基本讲完。今后我将在这个框架内持续更新内容,力求更加完善。

感谢大家的观看,欢迎多提意见,我们在下一个系列里再见。

网友留言(0)

评论

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。