原创 | 开发基于HTML5技术的游戏?

2014-07-18 12:04

文 /Andriy Vinchkovskiy;译/Sawyer;本文由手游那点事独家编译,转载请注明出处!

在当前碎片化严重的市场环境中,对于所有开发者和发行商而言,要让尽可能多的人接触自己的游戏是最重要的因素之一。基于Flash和原的生应用并不是开发者的最佳选择。很大程度上,这是因为它们都依赖于特定的平台,而在生活中,绝大部分的玩家都不局限于使用单个设备。所以,要把游戏带到各种设备上就是值得的努力方向。HTML5为开发者和发行商达成这一目标提供了真正独特的机会。HTML5能使游戏以最简单和最便捷的方式在移动设备上运行成为可能,加上HTML5无需如Flash游戏投入额外的金钱和时间。开发基于HTML5技术的游戏?

过去(在此使用这个词有失偏颇,因为并不是很久以前),阻碍开发者决定采用HTML5是因为这种技术相对新颖,从而使人们形成该技术尚未完善、充满BUG的偏见。然而,2013年DevGAMM大会大体上消除了这些担忧。会上,许多有名的开发者分享了他们对HTML5产品的良好体验。随后,各大游戏开发者论坛、技术讨论博客、文章等也为驱散人们对该技术的成熟性的忧虑作出了贡献。

开发HTML5游戏的决定

我们决定把《重返糖果大陆》(BacktoCandyland)的开发带到HTML5上。之所以选择HTML5只是因为我们需要让游戏达致目前在平台选择上呈现分化的用户。在此,我们希望与你分享我们在HTML5的经验。

资源——降低时间和财务支出的秘诀

我们希望确保能够把HTML5较其他格式的平台的优势推广方式落到实处,而时间和预算就实现这方面的目标非常关键。

对于任何软件产品的开发者来说,确保产品在所有目标平台上正常运行,允许玩家通过其选择的设备进行游戏极为重要。但市场上充斥着各种不同的操作系统和屏幕尺寸的移动设备,所以令每个开发者最为头痛的地方就是游戏测试。然而,通过使用一些简单和通用的技巧,要让游戏在所有支持HTML5的设备上完美运行是完全有可能的。

开发者需要考虑必要的设备基础以执行测试。事实上,如果技术足够稳定,即便在资源有所限制的情况下,在开发初期,开发者只需1-2台设备进行最基础的测试。同时,开发者还可以使用一些非常有用的免费服务,如SamsungRemoteTestLab。此外,开发者还应该明白,开发者论坛上的好友和用户都乐于参与游戏的测试。

现已有许多制作HTML5应用的免费程序。开发者能够利用这些程序,限制开发初期的资源和其他投入。市场上亦有很多低价或免费代码和图像编辑软件——我们使用了Flash和Photoshop处理图像,VisualStudio用于编程和TexturePacker用于打包地图。

限制——认识HTML5的限制

我们知道(至少书面上)转向使用HTML5非常直接,然而,还处于发展初期的技术确实意味着开发者在开始项目前须对一些事项予以认真考虑。我发现最重要的问题是,支持HTML5的移动设备的确有着各种不同的特点,从最低端的智能手机到苹果和三星的旗舰。所以开发的关键就是优化,因为我们总希望在所有设备上实现完美图像的游戏,而开发者在开发前便需要对此仔细考虑!

在选择游戏的机制时,开发者应考虑HTML5表现可能有所欠佳的区域,特别是针对手机平台和大众市场用户开发的游戏。游戏可能在旗舰设备上达到120fps,而一些3-4年历史的设备可能只有10fps。除了无数优化事项和确保fps值的独立性,开发者还需确保游戏即便在低端设备上仍能正常运行。

开发伊始,开发者也应该考虑对各种屏幕分辨率的支持,并进行相关的设计。我们的游戏是以横屏为主,还可以适应各种不同的屏幕竖屏高度。iPhone4/4S的最低高度像素达712(默认值,不去除通知栏);最大的高度像素达1,000。

另一个方面就是游戏在网页端的大小能够受到限制;可以对设计图予以优化,减少所需的逐帧动画;程序动画和骨骼动画是两个替代方法。我们使用了Flash以组合动画。

最后,注意音乐和音效的质量、选择确保影音文件的质量和大小适中的最佳比特率非常重要。

问题——但解决方案更重要

我们所面对的首个问题就是游戏语言的选择。出于对目标模型以及ActionScript3的相似性,我们最后选择了TypeScript,而该语言在VisualStudio中的使用液非常便捷。

另一个“问题”就是引擎框架的选择;我们对数个解决方案进行了实验测试,并最终选择了createjs,多亏其他开发者的评价及其类似ActionScript3的API的特点。

这能协助我们的团队实现从Flash至HTML5的平稳过渡。

跟许多首次尝试的开发者一样,我们遭遇各种技术问题,但我们也逐一发现了简单的解决方案:

各种createjsbug——纠正createjs或使用替代方法。例如,我们的createjs曾出现一个问题,因为字段的边界框没有正确地界定,而我们则需要就此进行修正。此外,一些设备也出现了触摸屏相关的问题——一些点击被处理两次,文字的点击也无法正常运作等。为了解决点击的问题,我们写了我们自己的文本,检查点击的正确性,以解决这方面的问题。

在一些设备上复制画布——有助于剔除重叠问题

图像缓存相关的问题——例如,在iOS6上。有时候,画布中的子画面缓存比平时的显示速度较为缓慢。可能是一些启发方法开始起作用,缓存的子画面可通过软件画出,而不是通过gpu加速。为了克服这个问题,我们决定限制缓存的使用,但会对一些优化事项产生负面影响。就游戏画面而言,上述的bug已经在iOS7得以修复。

结果

毫无疑问,开发HTML5游戏对于我们来说是富有价值的经验,我们确定这些经验能为所有开发者提供参考。在小容量的游戏中实现最大内容的需要,并确保玩家获得最大的满意度迫使我们以全新的方式考虑游戏的创作过程。这些任务驱使我们专注于开发的最重要方面,并在设计阶段便认真筛选所有关于游戏的想法,以便为开发留下最佳和最重要的设计——为玩家提供独特的游戏体验和让他们上瘾的游戏设计。

这种方法最重要的是就是尽量各款游戏的开发时间,促使游戏按时发布。这让HTML5的开发的风险更低、开发者的利润更高——当前市场的一大拉力及其重要性难以被高估,特别是对于小型的独立开发团队。

4月,我们通过发行合作伙伴SpilGames、Zibbo、A10、Gamesgames、GirlsGoGames发布我们的游戏,并在他们的推动下获得数百万的活跃用户。

我们目前拥有超过3百万名活跃用户,并成为网站上的“流行游戏”。

我们发现,用户通过各种设备进行我们的游戏,电脑浏览器和平板/手机的登录比例几乎是50/50。这就意味着,如果我们仅以Flash开发我们的游戏,我们的用户便会削减了近50%。

最后的想法

HTML5的开发首先能实现跨平台的能力。无须安装即可以在手机或平板上进行游戏的感觉实在太好了。HTML5让开发者意识到这种技术的巨大潜力。

仅在几年前,HTML5游戏既不特别复杂也不流行,但由于技术的不断进步和跨平台能力的不断提升,他们如今正日益成为Flash和Unity游戏的另一选择。随着HTML5技术的发展和发行商的兴趣高涨,预计HTML5游戏的未来一片光明。

在接下来的一年里,HTML5游戏的市场份额会持续保持增长,但相应的竞争也会加剧。因此,我们有充分的理由认为,未来HTML5的游戏质量也会大幅提高。有鉴于此,我相信HTML5的游戏会更多,并能抢占仅次于手机应用的地位,甚至会使手机应用的开发商感到不安。

如果HTML5能保持当前的发展势头,大部分保守的开发者也将会意识到开发HTML5游戏的优势之处,因为降低财务风险总是小型独立工作室的首要任务。所以,HTML5能开发出小型但能使玩家上瘾的游戏的同时,最大限度减少开发流程。

本文由手游那点事独家编译,转载请注明出处!

Ben

Ben

线上线下专访、稿件发布合作请联系QQ或微信:328624956

相关资讯