JS和HTMLGAMING：從憤怒的小鳥到ZX頻譜

關鍵要點

• HTML5/JavaScript遊戲領域發展迅速，開發者可用的API和工具日益豐富。
• Mozilla視覺程序員和技術佈道者Rob Hawkes強調了HTML5和JavaScript在瀏覽器遊戲中的潛力，並指出這些遊戲的複雜性日益提高。
• 有興趣學習HTML5/JavaScript遊戲開發的開發者應該首先熟悉JavaScript和圖形API（如Canvas API和Audio API）。 Crafty和Impact等遊戲引擎也很有用。
• HTML5和JavaScript促使復古遊戲復興，未來有可能帶來更複雜、更身臨其境的遊戲體驗，尤其是在WebGL等技術的支持下。
• 網絡的開放性給遊戲的盈利模式帶來了挑戰和機遇。開發者需要探索各種策略，從遊戲內付費到贊助，才能使遊戲盈利。

HTML5/JavaScript遊戲領域最近發展迅速。瀏覽器遊戲越來越受歡迎，開發者也開始發現了一套方便的API和其他工具。 Rob Hawkes熱衷於讚揚HTML5和JavaScript及其在瀏覽器遊戲中的應用。 Rob是Mozilla的視覺程序員、作者和技術佈道者，負責Mozilla在開發者社區中游戲方面的相關工作。他在5月份在墨爾本舉行的Web Directions Code大會上發表了閉幕主題演講，向我們展示了HTML5和JavaScript遊戲正迅速發展得多麼出色。

你好，Rob。請告訴我們你在開發方面的背景。

我在網絡開發領域工作了大約13年。我學習了一些HTML和CSS的知識——我更感興趣的是網頁設計，但後來轉向了PHP，那時我了解到可以在服務器端開發中做一些非常強大的事情。一旦我知道如何創建一個表單，我就想，現在，如何訪問這些數據？每個人學習PHP都是從表單開始的……對！能夠將數據發送到某個地方真的很酷。所以後來我在業界工作，主要從事前端開發，做了幾年。我對媒體產生了興趣，並開始深入研究JavaScript，從那時起，我意識到我並不那麼熱衷於製作網站，而是更熱衷於學習技術並將其推向極限。我一直對遊戲製作非常感興趣，喜歡拿一些東西做一些瘋狂的事情來學習它的工作原理，所以在大學期間，我做了很多HTML5方面的工作——尤其是canvas。

你一定是在canvas早期的時候就開始搗鼓它了吧？

實際上，canvas在我開始之前就存在了。蘋果公司用它創建了他們的dashboard小部件。它一直都在WebKit中，儘管它在其他瀏覽器中從未真正穩定下來——或者至少它從來都不有趣。沒有人真正用它做過什麼。但是當我遇到canvas時，我覺得它真的很酷。我是在一個很好的時機開始的——當時關於它的書籍很少，但它也帶來了很多機會。我是為數不多在深入研究它的人之一。除此之外，我還參與了JavaScript API的實驗。我認為自己既不是設計師也不是開發者——處於兩者之間。我喜歡視覺編程。像遊戲製作和canvas這樣的東西是完美的，因為你可以將硬核開發與一些真正直觀的界面體驗結合起來。這就是我在Mozilla的工作重點；網絡的遊戲開發方面——以及Boot2Gecko，這是我們正在進行的一個移動設備項目。

是什麼讓你對HTML5/JavaScript遊戲感興趣的？你是一個遊戲迷嗎？

我的生活中一直都有遊戲——我有一台ZX Spectrum，遊戲機……

哇！你是ZX Spectrum的粉絲嗎？

我爸爸不太喜歡電腦，但出於某種原因，他認為買一台是個好主意。而我卻被插入磁帶後遊戲就出現了的想法深深吸引住了！我的意思是，我當時還很小，但我仍然記得——《打鴨子》，以及所有那些瘋狂的遊戲。然後當我開始玩PC遊戲時，我的工作效率就下降了很長時間！但遊戲對我來說一直都很有趣。像Flash和JavaScript這樣的技術讓我意識到，太酷了，我現在可以製作遊戲了。然後一旦你開始製作遊戲，它就會打開一個全新的可能性領域。這就像我第一次製作網站時的那種感覺——我創造了它！你可以在遊戲開發中學習許多不同的技術——輸入、視覺圖形、聲音——而你在構建標準網站時並不總是能獲得這種體驗。在遊戲中，你總是將事物推向極限。

所以如果我對HTML5/JavaScript遊戲開發感興趣，我首先應該學習什麼，然後應該往哪個方向發展？

掌握JavaScript；標準的語言相關內容。但是一旦你對JavaScript感到滿意，就可以看看一些圖形API——比如Canvas API。 Canvas是一個非常好的API。在我遇到它之前，我真的不知道如何在不創建圖像的情況下在瀏覽器中繪製東西。還可以看看Audio API。 HTML5中的多媒體功能非常有趣。看看一些遊戲引擎。你可能不一定要從頭學習它們，但是有很多遊戲引擎可以讓你快速上手，而無需完全理解基礎知識。比如Crafty，我相信這是一個澳大利亞的引擎，而且是免費的。然後還有一個非常好的引擎，售價99美元，叫做Impact——一個非常棒的遊戲引擎，文檔非常完善。如果你想用JavaScript創建一個遊戲，但又不一定想太深入地了解實現細節，那麼這些引擎是一個很好的起點。如果你真的想深入了解遊戲開發的來龍去脈，學習如何使用requestAnimationFrame之類的工具進行動畫製作，這可以優化JavaScript中的循環。當你將它與Canvas API結合起來，比如讓一個方塊在屏幕上移動時，從那裡使用鍵盤輸入就不是什麼難事了。從那裡開始，你想把它帶到哪裡就帶到哪裡。

所以看來你仍然需要很好地理解基本的JavaScript。

對。我的意思是，有一些類似jQuery的遊戲庫——像Crafty和Impact這樣的引擎有點像那樣。但它們不像jQuery那樣抽象。如果你想做一些更複雜的事情，你仍然需要編寫JavaScript。但是如果你只想做基本的動畫——比如將圖像作為精靈引入並四處移動——你可以用Crafty做到這一點。問題是，你並沒有完全了解幕後發生的事情。在網絡之外，如果你想製作一個遊戲，你可以使用Flash或Unity，因為它抽象了一種方法來處理複雜的動畫和物理效果。但是，對我來說，了解JavaScript意味著我可以從頭開始創建遊戲。是的，這可能很難，可能需要一段時間，但從長遠來看是值得的。如果你至少能理解它的基礎知識——for循環、數組和對象，等等——那麼當你想要進一步推進事情時，你就會真正感激它。

HTML5和JavaScript似乎導致了復古遊戲的爆炸式增長——策略遊戲、平台遊戲，以及像《Pong》這樣的舊遊戲的複活。你認為它還會走向其他方向嗎，比如更複雜、更具交互性的項目？

復古遊戲這方面很酷。 HTML5遊戲正處於一個相當簡單的階段，所以復古遊戲是完美的——它們不需要太多的能力，主要是在2D，而且很容易創建。 Flash遊戲盛行的時候也是如此。沒有什麼能阻止開發者使用JavaScript來創造更具沉浸感的體驗。我們開始看到使用WebGL的情況。很多人開始創建更接近你在iOS上看到的那些遊戲——甚至包括3D遊戲，使用諸如硬件加速之類的技術。 《Pong》很棒，但它並沒有過多地推動技術；即使是《憤怒的小鳥》也沒有過多地推動技術。我看到有人在WebGL中創建了《Quake 4》，而且運行流暢。我們需要看到更多這樣的遊戲，以幫助將網絡確立為現代遊戲的平台。我們現在擁有創建真正游戲所需的技術和能力。而我所說的真正游戲是指你可以在PC遊戲中看到的那些遊戲。我們開始看到公司和開發者朝著這個方向發展。我們需要創建為網絡而構建的網絡遊戲。現在我們看到的是互動遊戲的複興，但我們沒有看到太多專門為網絡創建的遊戲。我希望看到更多利用網絡優勢同時又意識到設備限制的遊戲。僅僅因為你可以在兩個平台上製作相同的遊戲並不意味著它應該完全相同。我認為網絡有機會成為一個獨立的遊戲平台——一個獨特的目標，而不僅僅是放置標準遊戲的另一個地方。一旦遊戲開發者掌握了這一點，我認為我們會看到一些非常有趣的東西。現在網絡上的遊戲實際上只是在復制其他平台——遊戲相當靜態，而且它們並沒有真正使用網絡提供的任何東西，例如社交功能或連接到其他API的能力。所有這些都是網絡固有的，我們正在網站中使用它，但是如果我們在遊戲中使用它會發生什麼？

許多開發者在瀏覽器遊戲中所做的事情往往涉及挖掘過去，這並非一定是壞事——但是你能看到概念和想法的擴展嗎？

那將是我的夢想。現在我認為我們對HTML和網絡作為遊戲平台是不公平的。我們將它與以前的平台進行比較；例如，我們正在移植來自iOS的遊戲——我們在網絡上運行HTML版本的《憤怒的小鳥》，但它從未為此而創建。我們把它帶過來是因為它很成功。這是不公平的；我們將網絡平台與它為之構建的原生平台進行比較。當然，原生平台更好——它是為觸摸控制、某種編程語言和技術而構建的。我們永遠不會通過將網絡限制在我們以前一直在做的事情上來讓它獨立發展。我們可以釋放網絡的強大功能，並嘗試一些不像我們通常玩的遊戲那樣受限的東西——例如，我們看到遊戲包含在瀏覽器中的一個小方框中。沒有理由讓遊戲必須作為一個網站的一部分出現在一個小方框中——它可以是網絡的一部分；你可以在網絡上追逐遊戲。沒有理由為什麼你不能在Twitter上玩遊戲。我希望隨著人們逐漸接受網絡遊戲的想法，我們會看到大量新遊戲的出現。 JavaScript API是為網絡而構建的。這是一項非常基礎的技術；建立一個web socket連接和一些事件，你就可以實時地向web服務器發送和接收消息——從那裡製作多人遊戲就不是什麼難事了。

你如何使這些想法具有市場價值？

這是我們在Mozilla試圖解決的問題之一。這也是我們從遊戲開發者那里普遍得到的問題之一——“聽起來不錯，但如果我不想免費提供我的遊戲怎麼辦？”人們習慣了DRM和代碼保護，他們來到網絡上，一切都開放了；源代碼都在那裡。所以我們這裡有兩個問題需要解決。第一：我們如何讓人們相信使用開放技術是一個好主意？我認為這個問題很容易解決，因為如果你擔心你的遊戲被盜，那麼我認為網絡不適合你。僅僅因為你可以在HTML中製作遊戲並不意味著它是你的遊戲的最佳平台。並且有一些方法可以減輕這些問題，例如，縮小代碼——這些方法可以幫助開發者對發布他們已經花費大量時間工作的代碼感到更舒服一些。第二個問題是營銷：你如何銷售你的遊戲？如果你無法謀生，那麼至少作為一個公司來說，製作遊戲就沒有意義了。你可以走一條路，如果你不花錢，你也不用太擔心阻止人們進入你的遊戲，但你可以使用捐贈模式。另一方面，如果你真的想在他們不為遊戲付費的情況下將他們拒之門外，你可以這樣做。我們在Mozilla正在開發開放式網絡應用程序API，它允許你提供需要在遊戲開發者服務器上驗證的收據。我們正在尋找方法來擁抱代碼的開放性，而不是阻止人們查看源代碼，而只是創建一個點，你可以說，你為這個遊戲付費了嗎？如果沒有，那麼你就不會獲得完整的體驗。這不是靈丹妙藥。如果它只是一個他們已經付費的單人遊戲，那麼一旦他們獲得了所有源代碼，就沒有辦法阻止他們拿走它並做人們對網絡技術所做的事情。我非常懷疑網絡上的遊戲被盜的程度不會超過其他地方的遊戲。盜版遊戲比僅僅獲取源代碼要復雜得多。如果你有一個服務器端組件，那麼你就有保護，這就是收據系統可以發揮作用的地方。如果你知道遊戲無法玩除非有人訪問你的服務器，那麼你可以控制這種體驗。如果他們竊取前端代碼，他們仍然無法玩遊戲，因為他們沒有獲得你的服務器端代碼，如果他們可以進入你的服務器，那麼你就有另一個問題了。我認為在網絡上將游戲貨幣化絕對沒有任何問題——目前的問題是我們還沒有取得巨大的成功。這是一個先有雞還是先有蛋的問題——人們正在等待成功，而成功並沒有到來，因為人們正在等待。我們需要有人站出來嘗試一下。而且是網絡，所以你不必像以前那樣銷售遊戲。你也許可以從遊戲內付費中賺錢，所以你仍然可以擁有免費的遊戲體驗，但可以控制人們在遊戲中體驗哪些東西——玩家達到的等級、他們擁有的盔甲或能量增益。一旦我們完全理解了什麼是可能的，我們就會弄清楚如何將其貨幣化，尤其是在像EA這樣的大公司加入之後——如果有人知道如何賺錢，那就是這些人。我認為獨立開發者之後也會效仿。這不像在iOS上那樣容易……但他們已經有了巨大的領先優勢。網絡上有很多方法。報紙已經開始考慮引入付費牆……這些並不一定有效。問題是，你應該屏蔽內容嗎？這是否違背了網絡的初衷？有沒有其他更適合網絡的賺錢方式？也許這就是問題的答案——不是“如果他們不付費，我該如何阻止他們玩我的遊戲？”，而是“我如何利用網絡擅長的事情從這個遊戲中賺錢？”也許這甚至不是從玩家那裡賺錢，而是從贊助商那裡賺錢。我很想知道一年後我們會處於什麼位置。我們可能會看到一系列成功的遊戲賺了很多錢。

關於HTML5遊戲和WebGL的常見問題

什麼是WebGL，為什麼它對HTML5遊戲很重要？

WebGL代表Web圖形庫。它是一個JavaScript API，允許在任何兼容的Web瀏覽器中渲染交互式3D和2D圖形，而無需插件。 WebGL對HTML5遊戲至關重要，因為它為開發者提供了創建豐富、高質量圖形體驗的能力，這些體驗可以在各種設備上流暢運行。這為遊戲開發開闢了無限可能，因為它允許創建可以直接在瀏覽器中玩耍的複雜、身臨其境的遊戲。

HTML5遊戲與傳統遊戲平台相比如何？

HTML5遊戲相較於傳統遊戲平台，擁有諸多優勢。首先，HTML5遊戲是平台無關的，可以在任何具有Web瀏覽器的設備上玩耍，包括智能手機、平板電腦和電腦。這意味著玩家可以在任何地方享受他們最喜歡的遊戲，而無需下載或安裝任何東西。其次，HTML5遊戲的開發通常比傳統平台的遊戲更快更容易，傳統平台的遊戲通常需要專門的知識和工具。最後，HTML5遊戲可以輕鬆更新和分發，這使得它們對開發者和玩家都具有吸引力。

我可以離線玩HTML5遊戲嗎？

是的，HTML5遊戲的巨大優勢之一是它們可以離線玩耍。這要歸功於HTML5的應用程序緩存功能，該功能允許Web應用程序將數據存儲在用戶的設備上，以便在沒有網絡連接時使用。這意味著即使您沒有連接到互聯網，也可以繼續玩您最喜歡的HTML5遊戲。

HTML5遊戲安全嗎？

HTML5遊戲通常與任何其他Web應用程序一樣安全。但是，與所有軟件一樣，如果設計和維護不當，它們也可能容易受到攻擊。開發者務必遵循Web安全的最佳實踐，例如使用安全協議、驗證用戶輸入以及定期更新和修補遊戲以修復任何潛在的安全問題。

一些流行的HTML5遊戲的例子是什麼？

如今有很多流行的HTML5遊戲，從簡單的益智遊戲到復雜的多人在線遊戲。一些值得注意的例子包括“2048”、“HexGL”和“寶石迷陣”。這些遊戲展示了HTML5和WebGL的強大功能和多功能性，並讓我們對基於Web的遊戲的未來有所了解。

我如何開始開發我自己的HTML5遊戲？

開發HTML5遊戲需要很好地理解HTML、CSS和JavaScript，以及熟悉WebGL API。還有一些可用的庫和框架可以簡化開發過程，例如Phaser、Pixi.js和Three.js。此外，還有許多在線教程和資源可以幫助您開始HTML5遊戲開發。

我可以將我的HTML5遊戲貨幣化嗎？

是的，有很多方法可以將HTML5遊戲貨幣化。一種常見的方法是通過廣告，可以通過在遊戲中顯示廣告或提供付費的無廣告遊戲版本來實現。另一種方法是通過遊戲內購買，玩家可以在遊戲中購買虛擬商品或服務。最後，一些開發者選擇直接銷售他們的遊戲，無論是通過他們自己的網站還是通過遊戲分發平台。

HTML5遊戲的未來是什麼？

HTML5遊戲的未來看起來非常光明。隨著Web技術的不斷進步以及移動遊戲的日益普及，未來我們很可能會看到更多創新和令人興奮的HTML5遊戲。此外，虛擬和增強現實技術的興起也可能為HTML5遊戲開發開闢新的可能性。

HTML5遊戲有什麼局限性？

雖然HTML5遊戲有很多優點，但也有一些局限性。例如，性能可能是一個問題，尤其對於更複雜的遊戲而言。此外，並非所有Web瀏覽器都完全支持HTML5和WebGL的所有功能，這可能會導致兼容性問題。但是，隨著Web技術的不斷發展和改進，這些限制正變得越來越不那麼重要。

我可以將WebGL用於非遊戲應用程序嗎？

當然！雖然WebGL通常與遊戲相關，但它也可以用於各種非遊戲應用程序。例如，WebGL可用於創建交互式3D可視化、虛擬導覽，甚至增強現實體驗。可能性幾乎是無限的。

以上是JS和HTMLGAMING：從憤怒的小鳥到ZX頻譜的詳細內容。更多資訊請關注PHP中文網其他相關文章！