3D 小游戏卷出新高度,用 Cocos 还原奇迹 MU!

原创
2023/11/02 11:36
阅读数 24

3D 小游戏「卷」出新高度!这款 3D MMO 到底有多强?

小编都被震惊了

当看到有团队用 Cocos Creator 还原了一款曾经风靡全球的经典 3D MMORPG 的时候,你会是什么感想?

2002 年,我坐在网吧的电脑前,抢着一款 3D MMORPG 《奇迹MU》 的内测码。这是我第一次接触 3D 游戏,激动得手心都出了汗...
往后的短短一年时间里,这款游戏就风靡了整个游戏圈。
在 2003 年的一系列权威媒体评比中,奇迹 MU 屡获桂冠,成为中国最引人瞩目的网络游戏之一。

如今已是 2023 年,整整 20 年之后,有一个团队,在获得了正版 IP 授权后,使用 Cocos Creator 完美复原了《奇迹 MU》的经典体验。

真的好羡慕他们,能有机会重做一次自己曾经热爱过的游戏。想必很多人也和小编一样吧,希望有一天能够自己用游戏引擎做一次自己喜欢的游戏。


项目简介

这个项目由一个 30 多人的研发团队打造,使用 Cocos Creator 3.7.3,预计在新的游戏版本发布时,会升级到 Cocos Creator 3.8.x。

在还原经典的同时,研发团队也基于现代游戏市场需求做出了相应的游戏变化调整。将重心放在了游戏内的战斗操作、职业技能、场景交互等 MMO 游戏玩家重点关注的方面。

在和研发团队的交流中,研发团队表示:制作这类经典怀旧项目的时候,最大的挑战莫过于处理怀旧美术品质的矛盾。老玩家们希望游戏能够尽量还原经典,从而有“回归”的感觉,但同时又希望美术品质能够与时俱进,达到现代水平。

针对这一细节,研发团队在美术品质方面做了很多优化与取舍,力求在不失去游戏怀旧画风的情况下,使模型、特效、画面更加丰富。

除了对游戏的热爱,这个研发团队也对技术有着强烈的追求。接下来,让我们看看研发团队带来的渲染优化性能优化引擎技术选型几个方面的干货分享


渲染优化


光影

游戏中的静态物体使用了 Cocos Creator 的光照图烘焙功能,能够保证良好的光影效果的同时,又不需要消耗太多的设备性能。


Shader 动画

游戏场景中的一些动画如部分特效、草和树叶的摆动等,均使用 Shader 实现。

Shader 动画应用场景

其核心就是在 Shader 中,对顶点位置和 UV 进行干扰,从而借助 GPU 实现高性能动画。如下所示:

  void main () {

   StandardVertInput In;
   CCVertInput(In);
   mat4 matWorld, matWorldIT;
   CCGetWorldMatrixFull(matWorld, matWorldIT);
   vec4 pos = In.position;
   vec4 normal = vec4(In.normal,0.0);

   float scale = 0.002;
   float speed = .5;
   //加入扰动
   float disturbance = sin(cc_time.x*speed + pos.y) * scale;
   pos.xyz += normal.xyz * disturbance;
   pos = matWorld * pos;

   v_position = pos.xyz;
 
   CC_TRANSFER_FOG(pos);

   vec4 position = cc_matView * pos;

   v_normal = normalize((matWorldIT * normal).xyz);

   #if USE_NORMAL_MAP
     v_tangent.xyz = normalize((matWorld * vec4(In.tangent.xyz, 0.0)).xyz);
     v_tangent.w = In.tangent.w;
   #endif

   v_uv = a_texCoord * tilingOffset.xy + tilingOffset.zw;

   #if USE_VERTEX_COLOR
     v_color = a_color;
   #endif
   gl_Position = cc_matProj * position;
 }


流光 Shader

奇迹中,高级装备和武器的流光效果,也算是经典特色之一。

这种流光 Shader,一般使用两层流光加一层扫光来实现。不仅能够提升画面品质,还可以用很低的 GPU 开销实现各种武器光效,性价比是非常高的。

我们需要准备适合的发光图片和噪声图。

关键 Shader 代码如下:

CCProgram unlit-fs %{
 precision highp float;
 #include <legacy/output>
 in vec2 v_uv;
 in vec3 v_position;
 uniform sampler2D mainTexture;
 #if USE_NOISE_TEXTURE
   uniform sampler2D noiseTexture;
   uniform ConstNoiseTexture{
     vec2 noiseStrength;
     vec2 noiseMoveSpeed;
   };
 #endif
 uniform Constant {
   vec4 mainColor;
 };

 vec4 frag () {
   vec2 uv = v_uv;
   #if USE_NOISE_TEXTURE
     vec2 noise_uv = v_uv;
     vec2 speed = vec2(cc_time.x * noiseMoveSpeed.x ,cc_time.x * noiseMoveSpeed.y);
     noise_uv.xy = v_uv.xy + speed.xy;
     vec4 offset = texture(noiseTexture,noise_uv);
     uv.x = uv.x + (offset.x - 0.5) * noiseStrength.x;
     uv.y = uv.y + (offset.y - 0.5) * noiseStrength.y;
   #endif
   vec4 col = mainColor * texture(mainTexture, uv);
 
   return CCFragOutput(col);
 }
}%
  • 首先使用 UV 采样噪声图, 将噪声图的 r,g 通道值加上原来的 UV,进行发光图采样。采样的时候需要乘以一个缩放因子,控制偏移的强弱。

  • UV 采样是对应像素值的。通过 UV 进行了干扰,采样出来的像素值就是有偏移的。可以形成与原图不一样的不扭曲效果。

  • 然后只需要分别对噪声图采样和发光图的 UV 根据cc_time.x进行偏移(乘以一个因子即可控制偏移速度),就能得到动起来的效果。

流光效果

性能优化

3D MMORPG 这类游戏的场景复杂度较高,同屏单位也不可控。为了兼顾更多的设备,我们也做了很多性能优化策略。

  1. 场景管理采用了四叉树管理,场景资源分帧加载,保证场景内不会一桢同时实例化多个物体造成卡顿。

  2. 大量采用代理机制。草、水面、地表都做了代理。实现了这些可视物对应的模型数量都压到极低的水平。

  3. 掉落物光柱和掉落钱币用 DymaicMesh 来动态合批,实现了最少的绘制调用。

  4. UI 动态特效,有一部分类型用 Shader 替代了序列帧,减少了内存纹理占用。

  5. 减少 Mask 组件使用数量。

  6. 使用 Cocos Creator 提供的引用计数机制来控制资源的引用和释放。

  7. 场景中需要大量显示的草和副本怪物启用了 GPU Instancing,大大减少了 DrawCall,提高了渲染效率。

  8. 使用分帧来处理逻辑,平滑帧率,避免一帧中执行太多任务导致卡顿。

为什么选择 Cocos

超快的联机游戏开发调试效率

如果你用 Cocos Creator 做过网游,你就知道他到底有多方便。发机上一但编译成功,就可以在内网的任何一台机器上玩到最新版本。

在同一台机器上,也可以通过多开网页实现多角色联机调试。通过 URL 参数,还能做到免输入账号,缩短调式进入时间。

而 Cocos Creator 的代码在原生、小游戏、Web 端几乎是一致的。90%的问题在Web上测试通过,在其他平台上也不会有问题。

真•跨平台

在我们的公司,有多种类型的游戏产品。包括页游、原生手游以及小游戏。面对如此多元的产品线,我们需要一种能够轻松实现跨平台(原生、小游戏、H5)需求的解决方案。

Cocos Creator 在原生平台拥有高性能 C++ 内核,在 Web和小游戏上,有 Web3D 内核。使得它不管在哪类平台上,都能够以“原生”的方式支持,从而获得最优的平台兼容和性能表现,这就是我们选择使用 Cocos Creator 的原因。

Cocos Creator 的跨平台能力非常强大,它可以帮助我们将一款游戏快速地部署到各种不同的平台上,包括Web、iOS、Android、微信小游戏等。这意味着我们的开发团队只需要编写一次代码,就可以将游戏发布到各种平台上,大大节省了我们的时间和资源。

上手门槛低

Cocos Creator 对开发者也非常友好。它的操作界面直观易懂,功能强大,可以让我们的开发团队快速上手。

Cocos Creator 还提供了丰富的文档和教程,无论是新手还是经验丰富的开发者,都可以在这里找到学习的资源。

内核开源,极致性能优化

对于 MMO 类型的游戏,为了呈现更丰富的内容以及增加更多的设备覆盖率,常规的优化手段通常不能 100% 达到目的。

这个时候,开源的内核让我们可以根据自己的需求剔除掉不必要的流程,或者根据我们的具体需求重写某些流程,以实现最小化性能消耗。

社区活跃

Cocos Creator 的社区非常活跃,很多问题都可以在社区中找到答案。这不仅大大提高了我们解决问题的效率,也让我们能够跟随社区的步伐,了解到最新的技术动态,不断提升我们的开发技能。

总的来说,Cocos Creator 以其超快的联机开发与调试能力、出色的跨平台能力、友好的开发环境以及活跃的社区,成为了我们游戏开发的首选工具。它不仅符合我们现有产品的需求,也为我们未来的产品开发提供了强大的支持。

结束语

感谢研发团队选择了 Cocos Creator 来还原这款经典的奇迹项目。也让作为 Cocos 一份子的我,有了一点间接的参与感。

也感谢研发团队耐心的交流和满满的干货分享,希望能够给更多要做这类项目的开发者们带来一些帮助。

3DMMORPG 项目的开发周期一般都比较长,少则一年,多则数年。

据小编了解,还有好几款采用 Cocos Creator 的类似项目即将上线,届时会与大家分享,敬请期待。

最后,给一个传送门,大家扫码体验这款 3D 佳作吧!

游戏体验二维码

本文分享自微信公众号 - COCOS(CocosEngine)。
如有侵权,请联系 support@oschina.cn 删除。
本文参与“OSC源创计划”,欢迎正在阅读的你也加入,一起分享。

展开阅读全文
加载中
点击引领话题📣 发布并加入讨论🔥
打赏
0 评论
0 收藏
0
分享
返回顶部
顶部