Gibt es gute Beispiele für webbasierte Spiele, die auf vollständig offenen Standards basieren (dh Javascript, HTML und CSS), da Flash weitgehend durch HTML5-Elemente (Video, Audio, Leinwand usw.) ersetzt wird? Ich sehe viele Beispiele für reine HTML5-Implementierungen dessen, was einst nur in Flash war (wie hier: http://www.html5rocks.com/ ), aber nicht viele Spiele, eine Domäne, die immer noch von Flash dominiert zu sein scheint. Ich bin gespannt, was möglich ist und welche Grenzen es gibt.
flash
web
html5
javascript
Zuch
quelle
quelle
Antworten:
Es gibt viel Hype um HTML5, aber zu sagen, dass Flash größtenteils durch HTML5 ersetzt wird, ist übertrieben. Während Video- und Audio-Tags an Bedeutung gewinnen können, wird das Spielen ein Bereich sein, der sich lange Zeit als interessant erweist, nicht nur wegen der besseren Tools und Leistung, sondern auch, weil es eine Geschäftsinfrastruktur gibt, die auf dem Verteilen von SWF-Dateien basiert, was nicht einfach ist an HTML und js anpassen. Die HTML5-Spiele, die ich mit Canvas gesehen habe, befanden sich ungefähr vor 7 Jahren in Flash, und als IE9 so weit verbreitet ist, dass Canvas eine gangbare Option ist, hat Flash bereits die geplanten 3D- und möglicherweise Hardwarebeschleunigungsfunktionen eingeführt.
quelle
Um herauszufinden, wie weit Sie mit den neuesten Browsern kommen können, haben ich und einige Kollegen den Open-Source-Java-Port von Quake II auf Safari / Chrome crosskompiliert (irgendwann sollte es auch mit Firefox funktionieren). obwohl dies anfangs nicht der Fall war, hauptsächlich aus Performancegründen). Das Projekt ist hier: http://code.google.com/p/quake2-gwt-port/
Es bedarf noch einiger Sorgfalt und Fütterung, um es zum Laufen zu bringen (z. B. ist WebGL in keinem Versandbrowser standardmäßig aktiviert), aber wir haben hier ein Video hochgeladen: http://www.youtube.com/watch?v = XhMN0wlITLk (sorry, es ist so dunkel - Gamma-Probleme bleiben bestehen) und Sie können unsere Google I / O-Diskussion hier sehen: http://code.google.com/intl/fr-FR/events/io/2010/sessions/gwt -html5.html
Ich weiß nicht, wie lange es dauern wird, bis wir uns realistisch auf all diese neuen Browserfunktionen verlassen können (WebGL, WebSocket, Audio / Video, lokaler Speicher usw.), aber wenn alles zusammenkommt, kann es einen großen Unterschied machen in der Fähigkeit, Spiele direkt im Web zu versenden. Es bleiben jedoch noch viele Hürden offen (z. B. halten Sie nicht den Atem an, damit Microsoft WebGL in IE10 implementiert).
quelle
EAs Lord of Ultima ist wahrscheinlich das visuell beeindruckendste Javascript / HTML-basierte Spiel, das ich je gesehen habe.
Hinweis: Es ist ein Strategiespiel und kein Action-Titel. Obwohl es eine schöne, flüssige Scrolling-Karte hat, gibt es in Bezug auf direkte Interaktivität nichts anderes, als auf Schaltflächen zu klicken.
quelle
"Ich bin gespannt, was möglich ist und wo die Grenzen liegen."
Die Einschränkungen sind browserbasiert. Wenn Sie etwas Heißes wie das Webkit Nightlies verwenden, kann Flash im Grunde nichts, was der Browser von Haus aus nicht kann.
AFAIK, das alles ist auch in Google Chrome möglich (und wenn nicht, wird es bald sein). Klingt für mich nach einer vollständigen Spielumgebung :)
(Ich habe in meinem ersten Entwurf Links zu all diesen Dingen eingefügt, aber StackExchange hat es mir nicht erlaubt, sie zu posten, da ich neu bin. Entschuldigung!)
quelle
Schauen Sie sich diese Websites an:
quelle
Ein Benutzer von jquery ui baut eine Spiel-Engine namens Aves mit Javascript / html. Dieses Video beschreibt einige der Herausforderungen, denen er während der Entwicklung begegnet ist. Er hat viel darüber gesprochen, wie langsam die Leinwand war und dass sie derzeit nicht beschleunigt wird.
Sie können auch eine ganze Reihe von Spielen finden, die mit der Effect Games-Engine entwickelt wurden. Obwohl die Engine ziemlich sandkastenartig in seiner Site aussieht, mit allen Werkzeugen und Ressourcen, die dort vorhanden sind.
IMO ist die größte Einschränkung bei der Entwicklung eines js / html-Spiels der Klang. Das Tag verhält sich je nach Safari / Firefox / Chrome ereignisabhängig. Die neueste Version muss vorliegen. Zuletzt habe ich geprüft, dass Safari nur mit MP3 funktioniert und Firefox nur mit OGG. Obwohl es durchaus machbar ist, dies mit einer Kombination aus serverseitiger Logik zu überwinden.
Ich schreibe zurzeit gerne Flash-Spiele und kann nicht sehen, dass diese Domain von HTML5 (js / css / html) überwunden wird, bis Portale sie akzeptieren oder die Web-App-Stores online gehen.
quelle
Contrasaurus
Dieses Spiel wurde sorgfältig mit Blut, Schweiß, Tränen und HTML5 erstellt. Die Kern-Matrix-Transformationsbibliothek wurde als Matrix.js ausgelagert . Außerdem arbeiten viele der wichtigsten Spracherweiterungen, Sprites, Sounds und Canvas-Bibliotheken in The Pixie Game Platform mit .
Kein Flash, alles HTML5 Canvas und Audio. Funktioniert am besten in Chrome.
quelle
Sie müssen sich unbedingt die CAAT-Bibliothek ansehen - es ist großartig! Es ist eine Scenegraph-Bibliothek (zB thing.addchild / thing2.removechild) für Canvas.
Diese Demo hat mich umgehauen, zusammen mit dem Spiel, das auch auf dieser Seite enthalten ist: http://labs.hyperandroid.com/animation
So sehr, dass ich unser eigenes Spiel übertrug, um es zu benutzen, und es dauerte nur eine Nacht.
Besuchen Sie die Multiplayer-Schneeballschlacht http://holiday2010.ogilvy.com
So sehr, dass ich versucht habe, das Lirary zu verbessern und neue Inhalte hinzuzufügen: http://github.com/onedayitwillmake/CAAT-Hello
Verfügbar auf github: http://github.com/onedayitwillmake/CAAT-Hello/tree/circlepack
quelle
Obwohl die Kontrollen vermasselt sind / Arbeit brauchen, mag ich Akihabara - http://www.kesiev.com/akihabara/
quelle
Google Pacman muss eines der beeindruckendsten JS / HTML-Spiele sein, die ich je gesehen habe (zugegeben, es ist das einzige , das ich gesehen habe, aber es ist immer noch sehr beeindruckend :)
Quellcode-Speicherorte
quelle
Es gibt ausgezeichnete Tutorials für die Akihabara-Bibliotheken, die von Darius Kazemi und Darren Torpey unter: Akihabara Tutorials zusammengestellt wurden
quelle
Biolab Disaster ist ein ziemlich guter Plattform-Entwickler, der zeigt, was mit html5 und js alles möglich ist. http://playbiolab.com/
quelle
Ich habe gerade mein Space Strategy-Spiel von Silverlight / C # auf reines HTML5 / Javascript / Canvas portiert:
Astriarch - Herrscher der Sterne
Es ist ein 2D-Spiel und grafisch sehr einfach, daher eignet es sich gut für die Verwendung der Leinwand, da nicht viel gemalt wird. Davon abgesehen bin ich beeindruckt, was einige der anderen, animierteren Spiele mit der gleichen Technologie leisten. Ähnlich wie bei Angry Birds im Chrome Web Store: Angry Birds möchten Sie vielleicht auch einige der anderen Spiele im Chrome Web Store ausprobieren, um weitere Beispiele zu erhalten.
Ein Grund, warum ich mein Spiel portiert habe, war, dass es auf Tablets / Mobilgeräten ausgeführt werden kann, ohne dass das Ganze in Java oder Objective C neu codiert werden muss. IOS und Android haben beide 'WebView'-Steuerelemente, um dies zu vereinfachen, aber Ich hatte Probleme beim Herumbasteln (iOS erfordert, dass sich alle Assets in einem Ordner befinden, soweit ich das gesehen habe).
Diese Art der plattformübergreifenden Anforderungen ist ein guter Grund, warum manche Leute von Flash zu HTML5 wechseln. Der Nachteil ist jedoch, dass Sie N verschiedene Browser und Versionen testen müssen und alle Probleme haben, die mit der typischen Webentwicklung verbunden sind. Diese Probleme werden durch Bibliotheken wie jQuery und einige der anderen hier erwähnten HTML5- Spielbibliotheken / -plattformen gelindert ( ImpactJS habe ich gesehen, aber noch nicht ausprobiert). Auch diese Probleme werden kein so großes Problem sein, wenn FireFox 7 nicht mehr verfügbar ist und der IE 9+ weiter verbreitet ist.
Wenn Sie sich für einige der Probleme interessieren, mit denen ich bei der Portierung von Silverlight auf HTML5 Canvas konfrontiert war, sollten Sie meinen Blogeintrag hier lesen : Portierung der Silverlight-App auf JavaScript mithilfe des HTML5 Canvas-Tags
quelle
Hier sind 3 großartige Spiele mit der ImpactJS- Engine.
Wenn Sie sich derzeit nicht sicher sind, was Sie mit HTML5 tun können, sind dies derzeit die besten Beispiele. Bedenken Sie jedoch, dass sich das Feld schnell ändert, da es ein so heißes Thema ist!
Z-Typ
Biolab
Kreaturen & Burgen
quelle
Zufälligerweise gab es heute bei Slashdot eine Frage zu HTML5 / Javascript-Spielen:
http://ask.slashdot.org/story/10/07/14/0632238/JavaScriptHTML-5-Gaming
Es erwähnt speziell Galactic Plunder, einen Side-Scrolling-Weltraum-Shooter:
http://dougx.net/plunder/plunder.html
quelle
http://www.javascriptgaming.com/
quelle
Ein wirklich interessantes HTML5-Entwicklungsframework, auf das ich kürzlich gestoßen bin, ist Sencha. Es ist hauptsächlich für Handheld- / Touch-Geräte gedacht, aber was wird in ein paar Jahren nicht mehr touchbasiert sein? Hier sind einige faszinierende Demos, einschließlich eines Kartenspiels:
http://www.sencha.com/products/touch/demos.php
quelle
Hier sind einige HTML5-Spiele zu Effects Games ... es gibt sogar Projekte, in die man sich einmischen kann. Habe die Zeit zwischen den Kompilierungen meistens mit der Crystal Galaxy Demo verbracht
quelle
Von der Site: "Cycleblob wird mithilfe von WebGL- und HTML 5-Zeichenflächenelementen implementiert und vollständig in JavaScript geschrieben."
http://cycleblob.com/
quelle
Probieren Sie Private Joe für einen kompletten 2D-Retro-Arcade-Shooter
Wenn Sie Spiele ausprobieren möchten, die für Handys optimiert sind , besuchen Sie marketJS
quelle