现在,Flash已基本上被HTML5元素(视频,音频,画布等)取代了,是否有基于完全开放标准(即Javascript,HTML和CSS)构建的基于Web的游戏的良好示例?我看到了很多纯HTML5实现的示例,这些实现曾经只在Flash中出现过(例如此处的内容:http : //www.html5rocks.com/),但游戏数量却很少,而这个领域似乎仍然由Flash主导。我很好奇有什么可能,有什么限制。
现在,Flash已基本上被HTML5元素(视频,音频,画布等)取代了,是否有基于完全开放标准(即Javascript,HTML和CSS)构建的基于Web的游戏的良好示例?我看到了很多纯HTML5实现的示例,这些实现曾经只在Flash中出现过(例如此处的内容:http : //www.html5rocks.com/),但游戏数量却很少,而这个领域似乎仍然由Flash主导。我很好奇有什么可能,有什么限制。
Answers:
关于HTML5的炒作很多,但要说Flash很大程度上已被它取代,这是一种夸大其词。尽管视频和音频标签可能会受到关注,但游戏将成为一个长期存在的领域,这不仅是因为更好的工具和性能,而且还因为围绕分发Swf文件构建了业务基础架构,这并不容易适应HTML和js。我所见过的使用canvas的html5游戏大致上是7年前的Flash,而到那时ie9的分布范围足够广,以至于canvas是一个可行的选择,Flash将已经引入了计划中的3d以及可能的硬件加速功能。
为了探究最新浏览器的使用范围,我和一些同事将Quake II的开源Java端口交叉编译为Safari / Chrome(它应该也可以在Firefox上运行, (最初并不是因为性能原因)。该项目位于:http : //code.google.com/p/quake2-gwt-port/
它仍然需要一些注意和投入才能启动和运行(例如,在任何运输浏览器中默认情况下仍未默认启用WebGL),但我们在此处上传了一个视频:http : //www.youtube.com/watch?v = XhMN0wlITLk(对不起,它太黑了-伽马问题仍然存在),您可以在此处查看我们的Google I / O对话:http : //code.google.com/intl/fr-FR/events/io/2010/sessions/gwt -html5.html
我不知道要花多长时间才能实际依赖所有这些新的浏览器功能(WebGL,WebSocket,音频/视频,本地存储等),但如果将它们全部整合在一起,则可能会产生巨大的变化可以直接在网络上发布游戏。但是仍然存在许多障碍(例如,不要让微软屏住呼吸在IE10中实现WebGL)。
“我很好奇这是可能的,局限性是什么。”
这些限制是基于浏览器的。如果您正在使用诸如Webkit夜间之类的热门产品,则Flash基本上无法提供浏览器无法做到的本机功能,例如:
AFAIK在Google Chrome浏览器中也可以实现(如果不能,很快就会实现)。对我来说,这听起来像一个完整的游戏环境:)
(我在初稿中包含了所有这些东西的链接,但是由于我是新手,所以StackExchange不允许我发布它们;对不起!)
一个jQuery ui家伙正在使用javascript / html构建一个名为Aves的游戏引擎。该视频描述了他在开发过程中遇到的一些挑战。他谈到了画布的速度有多慢,目前还没有加速。
您还可以找到使用Effect Games引擎开发的大量游戏。尽管该引擎看上去相当沙箱化,但那里拥有所有工具和资产。
IMO开发js / html游戏的最大限制是声音。标记在safari / firefox / chrome中的事件执行方式不同,所有标记都必须是最新版本。最后,我检查了Safari仅适用于MP3,而firefox仅适用于OGG。尽管通过服务器端逻辑的组合来克服这一点是完全可行的。
我目前爱好编写Flash游戏,直到门户网站开始接受它们或Web应用程序商店上线之前,HTML5(js / css / html)才克服了这个领域。
这款游戏是用鲜血,汗水,眼泪和HTML5精心制作的。核心矩阵转换库被分解为Matrix.js。此外,许多核心语言扩展,子画面,声音和画布库都可以在The Pixie Game Platform中使用。
没有Flash,所有HTML5画布和音频。在Chrome中效果最佳。
您真的必须签出CAAT库-太棒了!这是用于画布的场景图库(例如,thing.addchild / thing2.removechild)。
这个演示使我震惊,页面上也包含了游戏:http : //labs.hyperandroid.com/animation
如此之多,以至于我转而使用自己的游戏来使用它,它只花了我一个晚上。
参加多人雪球大战 http://holiday2010.ogilvy.com
如此之多,以至于我试图改善图书馆,并重新添加内容:http : //github.com/onedayitwillmake/CAAT-Hello
在github上可用:http : //github.com/onedayitwillmake/CAAT-Hello/tree/circlepack
即使控件搞砸了/需要工作,我还是喜欢秋叶原-http: //www.kesiev.com/akihabara/
Google Pacman必须成为我见过的最令人印象深刻的JS / HTML游戏之一(当然,这是我见过的唯一一个,但仍然非常令人印象深刻:)
Darius Kazemi和Darren Torpey在以下地方为秋叶原图书馆提供了出色的教程: 秋叶原教程
Biolab Disaster是一个非常不错的横向滚动平台游戏,它显示了html5和js可以完成的工作。http://playbiolab.com/
我刚刚完成了将太空战略游戏从Silverlight / C#移植到纯HTML5 / Javascript / Canvas的过程:
这是一个2D游戏,在图形上非常简单,因此它非常适合使用画布,因为没有太多绘画工作。话虽这么说,我对其他一些具有相同技术的动画游戏所做的事情印象深刻。就像chrome网络商店中的愤怒的小鸟:愤怒的小鸟一样,您可能还想查看Chrome Web商店中的其他一些游戏,以获取更多示例。
我移植游戏的原因之一是我希望该游戏能够在平板电脑/移动设备上运行,而无需重新编写Java或Objective C的整体代码。iOS和Android都具有“ WebView”控件,可以简化此操作,但是我在进行一些修改时遇到了麻烦(就我所知,iOS要求将所有资产都放在一个文件夹中)。
这种跨平台需求是某些人从Flash转向HTML5的一个很好的理由,但是缺点是您必须在N个不同的浏览器和版本上进行测试,并且与典型的Web开发相关联。jQuery之类的库以及此处提到的其他一些HTML5游戏库/平台都减轻了这些问题(ImpactJS是我见过但尚未尝试过的一个)。同样,当FireFox 7退出并且IE 9+变得更加普及时,这些问题也不再是一个大问题。
如果您对我在从Silverlight移植到HTML5 Canvas时遇到的一些问题感兴趣,则应在此处查看我的博客文章:使用HTML5 Canvas标记将Silverlight应用程序移植到javascript
这是使用ImpactJS引擎的3种出色游戏。
Impact是一个JavaScript游戏引擎,可让您为台式机和移动浏览器开发出色的HTML5游戏。
如果您目前不确定使用HTML5可以做什么,那么我想说这些是目前最好的例子。但是请记住,因为这是一个热门话题,所以该领域正在快速变化!
键入您要拍摄的Space Shoot'em'Up。
在“ Jump'n'Run”中与受感染的Biolab搏斗。用您的等离子枪拍摄所有移动的东西!有3个级别可以探索,还有6种类型的敌人可以战斗。
一个动作益智游戏,您可以在其中帮助年轻的寻宝者从中世纪城堡中窃取大量财宝。
巧合的是,今天在Slashdot上有一个关于html5 / javascript游戏的问题:
http://ask.slashdot.org/story/10/07/14/0632238/JavaScriptHTML-5-Gaming
它特别提到了侧面滚动太空射击游戏Galactic Plunder:
我最近偶然发现的一个非常有趣的HTML5开发框架是Sencha。它主要用于手持式/触摸式设备,但什么是不是会被基于触摸从现在起几年?以下是一些有趣的演示,包括纸牌游戏:
这是Effects Games上的一些HTML5游戏...甚至还有一些项目,您可以参与其中。大部分时间都是通过他们的Crystal Galaxy Demo消磨编译之间的时间
在站点上:“ Cycleblob使用WebGL和HTML 5 canvas元素实现,并且完全用JavaScript编写。”
尝试Private Joe做一个完整的2D复古街机射击游戏
如果您想尝试针对移动设备进行优化的游戏,请前往marketJS