您的当前位置:游戏狗新闻 > 产业动态 > 正文

Animory开发者分享HTML5手机游戏制作经验

2013-04-16 来源:游戏狗收集 作者:死神葬月 评论

我的上一篇文章讲的主要是开发者在HTML5游戏的制作过程中应该注意的几个问题,以及游戏开发者以及其他游戏业人士给出的建议。

我的上一篇文章讲的主要是开发者在HTML5游戏的制作过程中应该注意的几个问题,以及游戏开发者以及其他游戏业人士给出的建议。他们关注的大多是:游戏开发的步骤、营销、推广、寻找合伙人等与产品发布有关的活动。而这一次,我要介绍的是如何着手HTML5手机游戏的开发。我将以我们的最新游戏《Animory》的制作过程为例。我不会告诉你怎么写脚本,而是提出最适合我们的途径和方法,以及我们从开发过程中学习到的经验。但愿看了这份“案例研究”后,读者能找到一些适用于自己的开发过程的方法和想法。

1、构思和原型

开发过程的第一步和关键就是构思。你当然可能已经有一些游戏动作的代码或类库,但总是需要一些以此为基础的想法。在开发《Animory》时,我们从之前的一款游戏《Animals Puzzle》中借用了图像。那款游戏剩下了一些没有用上的图像材料,我们决定就在那些图像的基础上编写新代码。那些不同的动物图画使我们想到:为什么不将它们运用到记忆游戏中去?对,我们就这么干!下一步就是制作可操作的原型。我们使用uxpin.com的原型制作工具来完成,它看起来简单又直观。

prototype(from gamasutra)

你可能会问,我们怎么开始制作原型?我们从现成的图像开始,然后编写可操作原型的代码。结论:我们从这个过程中学习到的重要一点是:应试先花更多时间制作不带图像的原型(也就是“游戏的网格”),然后再制作图像,最后完成可操作的、可玩的原型。例如,使用一些默认的红色方块作为游戏元素、简单的背景等等。为什么?想象一下,当你有大量现成的图像或功能函数时,你得到的测试的结果很可能是,那些东西根本无法与游戏相结合……还可能产生许多问题和增加不必要的代码编写量。

2、代码过程

整个游戏花了一个月才完成——我指的是包括绘制图像、做测试、写代码等所有活动。现在,你可能会想“什么?一整个月才做出这么一款简单的游戏?”我们费了这么长的时间是因为,我们太纠结于细节、游戏逻辑和代码质量。我们是根据我们自己的库和引擎编写代码的。在那时,我们仍然要根据其他将要发布的游戏的需要,开发和修改这个引擎。

这款游戏的核心是最简单的部分,制作过程事实上只费了大约两天。在核心部分,我们必须制作会转动和调用贴图的元件,并检查各贴图是否相适应。下一步是制作游戏逻辑,也就是解锁奖励图片、计算得分或打开/关闭声音的概率。这个部分花了三天。这个部分应该与编写代码一起谈,我们已经将图像添加到游戏代码中了。游戏开发最长的一部分是修改HTML和CSS,使游戏在IE9、IE10、Chrome、Firefox、Android浏览器、iOS浏览器和手机Chrome浏览器上的显示效果达到最佳。这是最费代码的过程,我们用了在大概3周才完成。

值得一提的是,我们在这时候不得不对代码作了一番修改。我们得到的教训是,好的原型可以加快进度和避免某些问题。游戏还在开发中,我们却要数次修改游戏玩法。为什么?因为我们发现平衡性不太好。

1、在第一版游戏中,玩家每次都能赢游戏,但如果他超过规定的时间,就得不到奖励。

2、我们把这个功能改得更简单一些,也就是,如果玩家超过规定的时间,他就会失败;如果没超过,就会胜利。

3、第三也就是最后一版游戏是最清楚的。我们认为那就是《Animory》最佳玩法。

正如你所见,原型是最重要的部分。没有可做测试的原型,你会遇到多得无法应付的问题。当然,我们会在下一个项目中牢记这个教训。

3、图像

在本文的开头,我提到《Animory》的创意来自现成的图像。美术制作的实际过程几乎与整个游戏的制作过程相当。我们的设计师完成所有美术工作大概费了3周的时间。这个过程主要是绘制概念草图、头脑风暴、制作原型和用CSS表现各个元素。我们对图像质量提出很高的要求,因为这是游戏的外观形像,起到吸引玩家的作用。图像绘制与游戏代码编写是同时开工的,所以我们几乎每天都能看游戏发生的变化。

Animory(from gamasutra)

大部分结果是由能产生漂亮的图像的设计师、技术、天份、经验和能力决定的。由图可知,我们的设计师追求的是某种特殊的风格。这款游戏看起来很吸引人,没有随机元素。有剧情,有特殊的思路。我们发现这种风格与我们的HTML5游戏的想法很契合。

4、声音

在这时,HTML5手机游戏有新的系统版本支持声音。声音使游戏更加吸引人,更加有趣,互动性更强。比如,声音提示能够清楚地反馈玩家在游戏中犯的错误。我们使用在网上可以找到的免费游戏声音库。至于音乐循环,我推荐Incompetech Royalty Free License,但你得记住,在你的游戏中注明版权和出处。

5、测试

我们在游戏的各个阶段都做了测试。在制作游戏的各个功能(游戏邦注:无论是图像匹配还是游戏逻辑代码)时,我们总是先检查再添加新的部分。从最开始,初始测试就是制作过程的一部分。测试通常需要30分钟。如果发现漏洞,我们就会制定修补方案,然后再测试,直到我们找不到漏洞。

当我们制作出一个包含所有计划元素的游戏版本时,我们就可以开始内测这款游戏的最终版了。内测所需的时间与初始测试相当,与原来一样,我们先修补漏洞,然后再测试,直到得到满意的结果。为此,我们准备了不同系统的手机(iOS、Android和BlackBerry):

Samsung Nexus S

HTC Wildfire S

iPhone 3GS

HTC Magic

Samsung Galaxy S Plus

iPhone 3G

Samsung I9000 Galaxy S

BlackBerry Playbook

Samsung Nexus S

测试是下一阶段的必要步骤。最好问问你的朋友、同事或任何愿意帮助你的人。你准备的测试设备越多,测试就越全面。做完测试后,就可以准备发布工作了。

6、寻找发行商

在我们的案例中,我们已经找好发行商了。为游戏寻找合适的、可靠的推广渠道是需要一些时间的。你必须实验发行商提议的不同模式,从中找到最适合自己的。HTML5手机市场还很小,所以为你的产品找到合适的生意和收益并不容易。

我们准备了一份《Animory》的演示片。我们联系与我们合作最频繁的发行商,使他们对新游戏产生兴趣。多亏了我们那份制作精良的演示片,发行商很快就表示“我们看好这款游戏,我们会给它做宣传。”当然,发行商在发行游戏以前,会再次测试游戏。从我们送出演示片算起,这个过程通常需要2周的时间。因为我们对这款游戏的测试已经相当彻底了,所以发行商的测试也没有找到任何问题。《Animory》终于可以发布了。

我们准备了不同版本的游戏,但我们并不是一次准备好所有的版本。我们得看看玩家对游戏的反应如何,然后再准备不同平台的移植工作和推广工作。

1)手机社交网络的手机网页版(免费+广告的模式/定制收费模式)

2)桌面浏览器的Chrome应用商店独立版(免费+广告的桌面版)

3)Android下载版(免费+广告和可购买版)

7、广告宣传

只靠发行商的力量是无法吸引玩家的兴趣的。你必须搞一些活动为游戏造势。你可以通过博客、Twitter或Facebook做宣传。你还可以使用其他社交网络。在你的朋友、朋友的朋友、独立游戏团体或支持HTML5游戏的地方如MarketJS或HTML5Devs论坛上宣传你的游戏。这些工作你做得越多,你的游戏就越可能得到玩家和其他发行商的关注。如果你为市场营销安排了预算,那么你最好能在大的博客网站或游戏网页上做广告。当然,这取决于你的能力了。

8、反思

整个生产过程历时约一个月。我们从中学习到的最重要的事就是,对游戏的各个部分和活动作准确的预测和原型。为了让各个阶段都顺利进行,你必须认真规划。要做出好游戏,头脑风暴、测试和详尽的代码和图像是必不可少的。我们不得不承认,原型过程仍然需要改进,但我们对最终结果很满意。另外,游戏最终得到我们的受众的认可。如果他们喜欢这款游戏,他们会发现它确实有趣,这就说明了游戏是成功的。

我希望这个案例能够让读者更好地理解游戏制作过程,也许对你自己的工作有所帮助。