Grundlegendes Wissen zum Erstellen von HTML / JavaScript-basierten Spielen [geschlossen]


17

Ich habe mich gefragt, ob Experten das Wissen und die Ressourcen teilen könnten, die erforderlich sind, um Spiele mit den neuesten HTML-Standards und JavaScript (oder wie manche HTML 5 nennen) zu erstellen. Gibt es JavaScript-Bibliotheken, die für den Prozess wesentlich sind? <canvas>Welche anderen HTML-Elemente müssen außer dem Tag beachtet werden?

Antworten:


9

Sie sollten die Audio- und Video- Tags kennen. Web-Speicher ist sehr wichtig, wenn Sie viele Daten für gespeicherte Spiele usw. speichern müssen.

Es gibt bereits einige Javascript-HTML5-Frameworks, Akihabara ist eher beliebt.

Soweit andere Bibliotheken, sind Jquery und Functional Javascript 2 meiner Favoriten.


Was sind die Stärken der einzelnen Frameworks? Welches ist das einfachste, robusteste und mit dem saubersten Code? Das Wort "Funktional" im funktionalen Javascript-Begriff klingt interessant, worum geht es wirklich? Welchen Rahmen würdest du Pythonisten vorschlagen?

Was bietet Web Storage, was eine Datenbank nicht kann?
abgelaufen am

@expiredninja eine Datenbank wäre eigentlich besser, aber Web-Speicher ist lokal auf dem Computer des Benutzers. Kein Hosting und schneller als Ajax-Anrufe usw. Diese Antwort ist (etwas) veraltet mit den Techniken, die für moderne browserbasierte Spiele verwendet werden.
Jdeseno

6

Es gibt bereits einige Frameworks: GameQuery und Akihabara , ein Plugin für jQuery, mit dem Sie einige spielbezogene Aktivitäten ausführen können, z. B. Animationen, Gruppieren von Sprites, Erkennen von Kollisionen und Lesen von Spielereingaben.


4

Schauen Sie sich RaphaelJS an, um mehr Ressourcen zur Verfügung zu stellen . Es ist eine sehr schöne SVG-Zeichnungs- und Animationsbibliothek mit einer schönen API. Vergiss nicht, dir die Demos anzuschauen.

Insgesamt würde ich <canvas>Tags über die direkte DOM-Manipulation empfehlen (z. B. jedes Sprite für sich allein <div>machen, um das Testen von Treffern erstaunlich einfach zu machen). Es ist einfach, DOM-Manipulationen falsch und schlecht durchzuführen, während herkömmliche 2D-Entwicklungsstrategien auf einer HTML-Zeichenfläche gut funktionieren.


3

Zusätzlich zu einigen der vorhandenen Frameworks für die Erstellung von Spielen sollten Sie die Burst Engine kennen, ein JS-Framework für die Anzeige von SVG-basierten Animationen in einem HTML5-Canvas:

http://burst.bocoup.com/

Bisher haben Leute die Tags und erwähnt, aber es gibt noch andere DOM-Dinge, die für die Entwicklung von JS / HTML-Spielen von entscheidender Bedeutung sind, darunter Dinge wie das Hinzufügen von EventListener-Rückrufen zum Element für Ereignisse wie 'mousemove' und 'mousedown'. Dies nimmt beispielsweise das erste Zeichenflächenelement, das es finden kann, und richtet es so ein, dass es beim Klicken auf die Zeichenfläche eine von Ihnen definierte Funktion namens "shootAtClick" aufruft:

document.getElementsByTagName ("CANVAS") [0] .addEventListener ('mousedown', shootAtClick, false);

Sie können es in Aktion in diesem Beispiel sehen, in dem ich die Akihabara-Engine erweitert habe, um grundlegende Maussteuerung zu akzeptieren. (Drücken Sie Z, um zu beginnen, verwenden Sie die Pfeiltasten, um sich zu bewegen, und klicken Sie mit der Maus, um in Richtung des Cursors zu schießen.)


3

Kenntnisse darüber, welche HTML5-Komponenten in welchen Browsern unterstützt werden.

Obwohl die browserübergreifende Kompatibilität mit der Zeit immer besser und einheitlicher wird, werden einige der neueren Komponenten immer noch nicht vollständig gleichermaßen unterstützt.

Der lokale Speicher kann einige browserspezifische Unterschiede aufweisen, und für die Unterstützung älterer Versionen benötigen Sie auf jeden Fall eine Bibliothek wie jStorage oder YUI Storage Lite .

Auch Web-Sockets können browserspezifische Unterschiede aufweisen, aber socket.io sieht aus wie eine vielversprechende Bibliothek, die eine bequeme Abstraktion bietet.

Audiokompatibilität ist eine ziemlich wichtige Komponente, die unterschiedliche Audiodateien für unterschiedliche Browser erfordert: http://html5doctor.com/native-audio-in-the-browser/

Chrome weist einige schwerwiegende Audiobugs auf, z. B. die Unfähigkeit, kurze Audiodateien abzuspielen , und das Abspielen vieler Sounds gleichzeitig kann den gesamten Browser zum Absturz bringen.

Die Hauptsache ist, die Unterschiede zwischen den Browsern zu verstehen, Bibliotheken zu verwenden, um zu abstrahieren und bei Bedarf ältere Versionen zu unterstützen.


1

HTML und JavaScript sind ehrlich gesagt ziemlich schlechte Plattformen für die Spieleentwicklung, aber das spielt keine Rolle, bis Sie sich für eine Art Spiel entschieden haben. Die Antwort wäre für einen Ego-Shooter, ein RTS oder ein Puzzlespiel völlig anders.

Beachten Sie, dass Sie anfangen, vage, von Hand gewellte Antworten zu erhalten, die zufällige Technologien verfälschen, die ordentlich erscheinen. Dies ist ein Warnsignal dafür, dass Sie keine Frage mit einer besonders legitimen Antwort gestellt haben.

Sie können auch fragen, welche C ++ - Inhalte Sie zum Schreiben von Anwendungen benötigen. Das hängt davon ab. Wenn Sie uns mehr über das Projekt erzählen, erhalten Sie möglicherweise eine nützliche Antwort.

Im Großen und Ganzen gibt es einen Grund, warum fast alle Web-Spiele immer noch Flash sind.


4
Ich würde zustimmen, dass die Frage vage und die Antworten überall sind, aber nicht einverstanden, dass "HTML und [JS] ... schlechte Plattformen für die Spieleentwicklung sind." Erinnerst du dich an Googles Pac-Man-Doodle? Straight HTML und JS. Ich denke, eine bestimmte Art von Gelegenheitsspiel funktioniert auf dieser Plattform ziemlich gut, und Menschen, die das Internet nutzen, haben bereits die Laufzeit. (=
drhayes

1
Wow, Pac-Man. Bahnbrechend. Es gibt einen Grund, warum niemand HTML / JS für Spiele verwendet, außer für technische Demos.
John Haugeland

1
@ Edmundito: Wenn Sie der Meinung sind, dass diese "Frage" so lauten sollte, sollte sie als CW markiert sein.
Jesse Dorsey

12
-1 wertlose Antwort. Wenn Sie der Meinung sind, dass Web-Spiele keine gute Plattform sind, setzen Sie sich. Ich weiß nicht, warum es so viele positive Stimmen gab, vielleicht teilen andere Leute Ihre Meinung, aber es trägt überhaupt nicht dazu bei, diese Frage zu beantworten.
Ricket

1
Jungs, hört auf zu toben. Die Antwort war 2010 ganz anders als heute im Jahr 2014. Ich habe momentan eine Reihe von HTML-Spielen im Angebot.
John Haugeland
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.