Share
Was Sie erstellen werdenWie Sie vielleicht wissen, ist die dritte Ausgabe des Wettbewerbs js13kGames hier: Der offizielle Start ist für den 13. August um 13:00 Uhr MESZ geplant. Js13kGames ist ein Wettbewerb für Entwickler von HTML5-Spielen, bei dem der unterhaltsame und herausfordernde Teil des Compos das gesamte Spiel unter 13 KB hält.
Dieser Artikel sollte ein guter Ausgangspunkt sein, wenn Sie lernen möchten, wie Sie die Assets generieren und den Code minimieren und komprimieren, damit Sie die Anforderungen für den Wettbewerb erfüllen können. Ich stelle Ihnen auch Tools zur Verfügung, die Sie in Ihren täglichen Projekten unterstützen können, wenn Sie Ihre Ressourcen gering halten müssen.
Der js13kGames-Wettbewerb richtet sich an HTML5-Spieleentwickler und JavaScript-Programmierer, die ihre Fähigkeiten im Kampf mit anderen Entwicklern testen, die Regeln befolgen, sich an die Deadline halten und Preise gewinnen möchten. Der Wettbewerb läuft vom 13. August bis zum 13. September - Sie haben den ganzen Monat Zeit, um Ihren Beitrag zu kodieren und einzureichen. Es sind jedoch keine externen Bibliotheken oder Ressourcen wie Google Fonts erlaubt. Alles, was Sie in Ihrem Spiel verwenden möchten, muss in 13 Kilobyte eines ZIP-Pakets passen. Der Wettbewerb ist für alle kostenlos, aber der Quellcode muss auf GitHub gehostet werden, damit andere in der Zukunft daraus lernen können.
Das 13-Kilobyte-Limit ist sehr restriktiv, aber Einschränkungen bringen oft Kreativität hervor: Sie müssen sorgfältig darüber nachdenken, wie Sie Ihre Ideen umsetzen müssen, da jedes Byte wirklich zählt.
Der Hauptzweck des Compos ist Spaß. Die Frist trägt dazu bei, dass es Spaß macht, denn Sie müssen das Projekt irgendwann beenden und können nicht für immer davon abhauen.
Die Teilnahme am Wettbewerb verbessert Ihre Fähigkeiten, hilft Ihnen bei der Verwaltung Ihrer Zeit für das Projekt und gibt Ihnen die Möglichkeit, mit der Community zusammenzuarbeiten. Außerdem besteht die Chance, dass Sie viele interessante Preise gewinnen, bekannt werden und schließlich als Entwickler eines Spiels eine Menge Geld verdienen. Was brauchst du noch?
Gehen wir die spezifischen Tipps und Tricks durch, die Sie verwenden können, um den Quellcode Ihres Spiels und alle verwendeten Assets zu minimieren, von der Minimierung von JavaScript über das Reduzieren der Bildgröße bis hin zur Prozedurebene und zur Audioerzeugung.
Sie haben einen ganzen Monat Zeit, um Ihr Spiel zu codieren. Sie müssen also nicht das ganze Wochenende schlaflose Nächte damit verbringen, Kaffee und Energiegetränke zu trinken, um mit anderen zu konkurrieren. Sie können in Ihrem eigenen Tempo arbeiten, wann immer Sie Zeit haben und wann Sie Lust dazu haben.
Aufgrund der strengen Begrenzung der Größe der Endverpackung ist es nahezu unmöglich, irgendwelche Rahmen zu verwenden. Wenn Sie einen kleinen Satz von Hilfsfunktionen vorbereiten können, die in das 13-Kilobyte-Limit passen, können Sie dies natürlich gerne tun.
Dasselbe gilt für die Bilder - Screenshots der Spiele sind oft größer als die Spiele selbst, also muss man schlau sein. Sie generieren wahrscheinlich sowieso alles selbst oder verwenden sehr kleine, komprimierte Assets. Das ist der beste Weg, um das gesamte Spiel an das Größenlimit anzupassen.
Der Kern Ihres JavaScript-Spiels ist der Quellcode. Sie können absolut alles generieren, ohne andere Ressourcen wie Bilder oder Sounds zu verwenden. Daher ist die Optimierung dieses Codes sehr wichtig.
Am einfachsten ist es, den Code zu minimieren. Das bedeutet, dass Leerzeichen (Tabs, Leerzeichen, Zeilenumbrüche usw.) entfernt werden, ohne dass der Code selbst geändert wird.
Sie können dies noch weiter ausführen, indem Sie andere Tools verwenden, mit denen der ursprüngliche Quellcode so geändert wird, dass seine Größe so weit wie möglich komprimiert wird, indem kürzere Variablennamen und andere solche Tricks verwendet werden. Als Nebeneffekt blenden diese Tools auch den Quellcode aus und machen ihn unlesbar Verschleierung. Eine der wichtigsten Wettbewerbsregeln ist, dass Sie auf GitHub ohnehin eine lesbare Version Ihrer Einreichung haben müssen. Es ist also völlig in Ordnung, jedes Byte zu quetschen, indem Sie den Code des gezippten Pakets unlesbar machen.
Tools wie Google Closure Compiler, YUI Compressor oder UglifyJS sowie Onlinedienste wie Compressor Rater, JSMini oder JSObfuscate können Ihnen dabei helfen, Ihren Code so weit wie möglich zu komprimieren. Nutzen Sie sie zu Ihrem Vorteil.
Es gibt nicht viele Bilddateien in Ihrem Spiel, wenn Sie es in 13 Kilobyte anpassen möchten. Wenn Sie jedoch ein Bild verwenden möchten, müssen Sie es so stark wie möglich komprimieren. Es gibt Online-Tools wie TinyPNG und Optimizilla, installierbare Anwendungen wie ImageOptim, Befehlszeilen-Tools und Build-Skripte, mit denen Sie dies tun können. So können Sie etwas finden, das zu Ihrem Workflow passt.
Sie können Ihr Spiel auch in niedriger Auflösung mit kleinen Bildern codieren und dann alles skalieren oder alle Bilder wegwerfen und alles auf der Leinwand von Grund auf neu generieren.
Angesichts des begrenzten verfügbaren Platzes ist es ratsam, über die zufälligen Einstellungen der Ebenen in Ihrem Spiel nachzudenken. Um den hohen Wiederholungswert Ihres Spiels am besten zu erhalten, sollten Sie Ihre Levels prozedural generieren, sodass Sie nicht ein oder zwei feste Level haben, sondern jedes Mal, wenn Sie das Spiel spielen, eine andere Erfahrung machen.
Die besten Beispiele in dieser Kategorie sind Roguelikes, die für ihre Levels Labyrinthe und Dungeons verwenden. Sie können aus nur wenigen kleinen Stücken eine riesige Welt erzeugen, die bei jedem Start des Spiels anders sein kann. Dank dieser Vorgehensweise wird es Ihren Spielern nicht zu schnell langweilig.
Das Hinzufügen von Audio zu Ihrem Spiel steigert das Gesamterlebnis, aber mit Songs, die normalerweise bei 5 MB oder mehr wiegen, wie können Sie diese in Ihren js13k-Eintrag einfügen? Jsfxr zur Rettung!
Anstatt eine MP3 zu verkleinern, können Sie Ihre eigene Musik und Soundeffekte erzeugen. Jsfxr ist ein JavaScript-Port der sfxr-Bibliothek und wurde im letzten Jahr von den Teilnehmern des Wettbewerbs in großem Umfang genutzt, was bedeutet, dass es im Kampf getestet wurde und großartige Ergebnisse liefert.
Neben den bereits erwähnten Tools können Sie sich selbst helfen, indem Sie einige Ihrer Aufgaben automatisieren. Build-Systeme wie Grunt oder Gulp können die Vorbereitung aller Assets wesentlich erleichtern.
Wenn Sie ein Gulp-Fan sind, stehen Ihnen eine Vielzahl von Build-Aufgaben zur Auswahl: Jack Rugile schlägt eine Gulp-Combo vor gulp-uglify + gulp-htmlmin + gulp-zip + gulp-filesize während Csaba Csecskedi hinzufügt gulp-imagemin zu dieser Sammlung. Sie müssen es nicht verwenden, wenn Sie sich mit Gulp nicht wohl fühlen oder einfach nur auf die gute alte Weise arbeiten möchten. Dieses Set kann jedoch Ihren gesamten Workflow für Ihren js13kGames-Eintrag erheblich verbessern.
Die einzige strukturelle Anforderung neben der Größenbeschränkung besteht darin, dass Sie die index.html Datei im Hauptverzeichnis des Pakets - alles andere ist optional. Sie können Ihren Code nach Ihren Wünschen strukturieren, Ordner für JavaScript-, CSS- und Bilddateien separat einfügen oder einfach alles in die HTML-Datei einfügen und alles andere vergessen. Sie können alles von Hand machen oder browserisieren, Ihr CSS mit LESS oder SASS verbessern oder sogar Ihren Code mit ESLint einfetten. (Das ist, was Florent Cailhol in seinem experimentellen js13k-Plattenlager-Repository auf GitHub vorbereitet hat.) Noch einmal: Das könnte Ihnen alles helfen, aber es ist nichts davon erforderlich.
Dies mag offensichtlich sein, aber vergessen Sie nicht, sorgfältig eine geeignete Spielart zu wählen, die in 13 Kilobyte passt, da einige Spiele schwerer zu bauen (und klein zu bleiben) als andere sind. Ich sage nicht, dass Sie keinen 3D-Ego-Shooter, Echtzeit-Strategie, Stadtsimulator, 3D-Rennspiel, Ampelmanager oder gar ein nacktes gelbes Blockspiel wie einige verrückte Entwickler in den vergangenen Jahren erstellen können, sondern die riesigen Bei den meisten Einträgen handelt es sich um einfache Spiele mit einem Kernmechanismus, mit dem Sie Ihr Spiel herumwickeln, einige generierte Bilder und manchmal einfachen Sound.
Denken Sie daran, dass es besser ist, etwas zu beenden, als ein riesiges, unfertiges Projekt zu haben, das die Menschen niemals sehen werden. Folgen Sie der One Game a Month-Initiative, halten Sie sich an die Deadline und versuchen Sie, Ihren Eintrag rechtzeitig abzuschließen. Halten Sie den Umfang und die Größe klein; Wenn Sie mit dem funktionierenden Prototyp zufrieden sind und freien Speicherplatz zur Verfügung haben, können Sie dem Spiel später jederzeit neue Funktionen hinzufügen. Polieren Sie Ihr Projekt so gut wie möglich und Sie können den Wettbewerb durch das Erstellen von Spielen wie SpacePi oder Radius Raid gewinnen.
Dies sind die grundlegenden Tipps und Techniken, mit denen Sie Ihr Spiel für den Wettbewerb js13kGames programmieren können. Sie müssen sie jedoch nicht verwenden. Es gibt viele Tools, die Sie in Ihrem Spiel verwenden können, um das Größenlimit einzuhalten. es hängt von Ihren Vorlieben ab. Wenn Sie jedoch keine Erfahrung haben, ist es das Beste, von anderen zu lernen.
Sie können den Quellcode der Einträge aus den vergangenen Jahren überprüfen, die Spiele spielen und sehen, was innerhalb der Grenzen möglich ist, die Blogeinträge durchsuchen, in denen die Erfahrungen der Menschen erläutert werden, und deren Quellcode lesen und daraus lernen. Stellen Sie Fragen über soziale Medien, diskutieren Sie Ihre Ideen und Probleme mit anderen. Das ist die Schönheit eines Wettbewerbs - du bist nicht allein; Sie können mit anderen zusammenarbeiten, Teams bilden und Ihre Fähigkeiten in kürzester Zeit verbessern.
Alle in diesem Artikel aufgelisteten Tools und Dienste sollten Ihnen helfen, sich auf den Wettbewerb js13kGames vorzubereiten. Es ist wichtig, dass Sie Ihre Aufmerksamkeit nicht allein auf die Werkzeuge richten. Sie sollten auch sehen, was andere tun, aus ihren Erfahrungen lernen und Teil der Gemeinschaft sein.
Wenn Sie sich auf verschiedene Weise auf den Wettbewerb vorbereiten können, teilen Sie diese bitte in den Kommentaren! Lasst uns alle profitieren, lernen und einander helfen. Schließlich war der Wettbewerb so lustig und unterhaltsam wie möglich.
Schauen Sie sich diese zusätzlichen Ressourcen für den Wettbewerb an:
Accentsconagua