《哈利波特:魔法觉醒》美术团队专访:如何做出别具一格的美术?

文/ 秋秋 2021-12-13 12:29:27

上线三个多月以来,《哈利波特:魔法觉醒》一直位于iOS畅销榜TOP15,游戏相关话题的热度也很高。除了在玩法上的讨论外,不少玩家也对其充满复古绘本的美术风格记忆深刻。

近段时间,网易游戏艺术设计中心独家采访了《哈利波特:魔法觉醒》的美术团队,探究他们是如何还原《哈利波特》的魔法世界,并做出颇具特色的美术风格的。

1639466986441781.jpeg1639466987425464.jpeg1639466988674246.jpeg1639466988364781.jpeg1639466989816587.jpeg



01  美术风格确定还原魔法世界

《哈利波特》系列电影第一次成功的视觉化了JK罗琳笔下神秘的魔法世界,优秀地契合了原著的画面气质:古老的城堡,丰富的细节,昏黄的具有油画质感的画面和色调。

国外已有的几款哈利波特相关的游戏,都是尽力百分百还原电影的视觉。而《哈利波特:魔法觉醒》则更想要还原那种符合原著小说世界观的古典,那种神秘,古老,昏黄的复古气质。

1639466989314385.jpeg

尊重原著的情感基调,强调精致而有细节的质感表现,从设计和画面上还原符合全球化审美的画风。另外角色刻画上注重人物的个性化,且保留绘画感和手绘感。因此,我们不断摸索,最终确定复古绘本的独特美术风格。

微信图片_20211214153741.gif

希望玩家看到我们游戏的时候,感觉画面就像小说中的插图人物从书中走出来,随着游戏的进行,更多的画面内容展开,玩家可以回忆起小时候第一次拿起小说,一页一页读着故事,然后慢慢沉浸在魔法世界的感觉。


02  反复调优迭代,风格贯彻进化

《哈利波特》是个经典国际IP,所以初期我们和产品以及IP方就确定了项目美术风格的几个基础原则:

首先要符合国际审美,让更多的哈迷能接受;

其次要有辨识度,之前哈利波特已经出过很多的优秀游戏作品,我们希望自己的美术风格可以和以往的作品区分开,更容易被玩家记住;

最后是希望风格可以有一定的艺术性,可以经得起时间的检验。当然为了做出还原度更高的精品美术,以及保持整个美术风格的贯彻是在离不开项目过程中一步步迭代和进化的。


03  艺术化、个性化、全球化

01  艺术化

《哈利波特》是一个二十年的国际经典IP了,粉丝众多,影视化的艺术效果也很高,只有高品质的艺术风格才能打动玩家,也符合团队一直以来追求的艺术理念。

微信图片_20211214153751.gif


微信图片_20211214153751.gif

DEMO阶段设计风格确定

首先在DEMO阶段从书本的概念出发进行的艺术化探索,“如果让我来给《哈利波特》的小说配整套的插图,那应该用怎样的画风呢?”

在这个动机下,最终选择了用符合小说和电影调性的神秘复古气质+小说插图绘本绘制的表现手法作为美术风格创作的总方向。

1639467011743724.png

确认理论方向后,前期我们出了一些实验性的草图和设计,得到了产品团队和IP方的一致认可。

1639467012561784.png

1639467012146772.jpeg

1639467012699413.png

1639467013291115.png

经过三个月左右的探索,出了一段确定风格的DEMO小视频。

模型风格

设计风格敲定后,为了尽可能的还原原画的设计效果,在后续模型的制作上我们放弃了当时市场上比较流行的纯PBR写实渲染方式,采用了卡通渲染,并且在常规的卡通渲染方式上做了延展和突破,强调手绘线条和纸张的材质感。

1639467014109950.jpeg

1639467014532875.jpeg

1639467014264442.jpeg

《哈利波特:魔法觉醒》模型设计

最后实现出来的结果还是达到了团队预期的,把我们的模型截图给到策划那边,经常很多同事都很难分辨出是2D的原画还是3D的模型。

1639467014367963.png

场景风格

在确认了角色风格的基础上,游戏的场景从设计和制作上其实也都遵循了角色制作的经验,造型上适度夸张,色彩上以暖黄和青绿色为主调,突出整个世界的温馨和神秘感。

1639467015732261.png

1639467015901448.png

1639467016511380.png

《哈利波特:魔法觉醒》场景设计

光影上为了达到比较个性化的艺术效果,我们在渲染的时候尽量选择比较硬朗干脆的灯光,刻意弱化了其他游戏常用的AO渲染来加强整个画面特征。


02  个性化

考虑到这个《哈利波特》这个巨大IP的特点,我们的游戏本身也不是《哈利波特》的第一款游戏产品,或者第一款手游,因此个性化、辨识度从开始就成了《哈利波特:魔法觉醒》这个项目成功的必备条件。

微信图片_20211214153825.gif

动作设计

为了使游戏的角色表演更加生动,有感染力,除了在动作设计上我们学习和查找了很多原著关于各个不同角色的性格描写细节之外,我们也在技术上做了很多个性化的技术支持。

比如面部表情+嘴型语音驱动的技术,角色说话的时候不但口型可以适配,还可以同时和这时候的情绪表情融合;另外为了是动作表演的时候不僵硬,也开发了动作的骨骼拉伸技术。

剧情表演

同时在剧情表演上我们跟其他游戏相比也做了一些创新,尝试将英式舞台剧的表演和影视化的镜头做一个结合,做一个更有辨识度的剧情表演演绎方向。

为此团队也特意去了伦敦在现场观看了《被诅咒的孩子》的舞台剧,吸收了很多灵感。

UED交互

为了游戏的交互部分都尽可能地和游戏画面进行融合,尽量做到3D和更有沉浸感的GUI设计,我们在设计每个系统的时候都会先和策划,UI,美术各个职能的同学一起进行脑暴,尽量找到一个符合IP,有沉浸感的设计点。

此外在技术上我们也是首个在公司自研NX引擎中开发了3D、UI技术的团队。

卡牌表现

《哈利波特:魔法觉醒》是一款卡牌游戏,为了可以让卡牌的表现上更有个性,我们在卡面的设计和开发上花了很多心思。

比如每张卡牌的卡面设计我们都会翻遍原著找到这个卡相关的原著剧情,然后围绕这个经典剧情去设计画面。同时,我们也为每一张卡设计了交互小彩蛋,希望有心的玩家可以发现~

03  全球化

《哈利波特:魔法觉醒》是个全球化的IP,我们的游戏也是面对全球的,所以在设计游戏美术风格的时候,希望可以做出能够打动全球各个不同国家哈迷的美术风格。

微信图片_20211214153833.gif

主角脸型肤色的多样性

由于我们游戏是面向全球的玩家,因此在创角设计上保证不同种族肤色的多样性。

1639467018332278.png

伙伴和NPC设计的国际化

我们的伙伴和NPC也设计了很多不同种族,比如罗宾是亚裔,洛蒂是非裔,后续的伙伴设计上我们会继续扩展。

1639467020870122.png

符合国际价值观的细节

在第一部电影里,猫头鹰是可以放在笼子里的,但是现在大家对动物保护越发的重视,因此我们的设计也体现了这些细节,比如猫头鹰没有放在笼子里。

1639467020325047.png


04  团队沟通协作,配合产出精品

在游戏的开发过程中,美术和策划团队的沟通协作是非常重要的,比如战斗设计的时候,制作人提出一个简单的战斗画面想法,美术就会根据这个想法先出一些画面概念,后面再根据这些战斗概念图,战斗策划开始设计更具体的战斗玩法。

1639467021906811.png

1639467021341275.png

在整个优化迭代过程中,美术和策划也需要非常敏捷地协调配合,关于战斗中角色到底多大才能既满足策划要求又能展现美术特点?什么样的战斗镜头既能方便操作又能有画面代入感?这些问题都是由美术和策划,程序同学一起合作解决。 

1639467022952297.png

1639467022237308.png

除此之外,我们还有定期的技能脑暴会,卡牌设计脑暴会,这些脑暴会都是策划、美术和程序一起深度参与设计,其中的部分技能还会由美术主导,在组织战斗会中,美术团队们也打的很好。

同时,我们也有一个哈迷委员会,里面有整个开发团队中最资深的哈迷,有策划,美术以及各种其他岗位的同学,作为我们内部的一个关于IP相关问题的初审方,保证游戏的设计点可以更大限度的还原IP。


05  概念设计赏析

为了给大家打造一个还原度更高的魔法世界,开发者团队们更是投入了长达四年的呕心沥血,网易游戏艺术设计中心也搜集了团队主美设计师们流出的概念设计一手原画,大家可以欣赏一下。

1639467022869050.jpeg

1639467023613979.png

1639467023728523.jpeg

1639467023721831.png

作者:Likan

1639467023714688.jpeg

1639467024274704.jpeg

1639467024189464.jpeg

作者:只会画画的木鸟

1639467024618542.jpeg

1639467025847220.png

1639467025272591.png

作者:机智的容嬷嬷

1639467026268243.png

1639467027149250.png

1639467028694593.png

作者:纳凉

1639467028907600.jpeg

1639467029122916.png

1639467029840045.jpeg

作者:小鸡

1639467029915092.jpeg

1639467030125460.jpeg

1639467030679927.jpeg

作者:加佳-在

消息来源: