Share
Wat je gaat creërenZoals je wellicht weet, is de derde editie van de js13kGames-wedstrijd hier: de officiële start is gepland voor 13 augustus, 13:00 CEST. Js13kGames is een competitie voor HTML5-game-ontwikkelaars waarbij het leuke en uitdagende deel van de compo je hele spel onder 13 KB houdt.
Dit artikel moet een goed beginpunt zijn als u wilt leren hoe u de items kunt genereren en de code kunt verkleinen en comprimeren, zodat u aan de vereisten voor de concurrentie kunt voldoen. Ik zal u ook tools bieden die u kunnen helpen bij uw dagelijkse projecten als u uw middelen licht moet houden.
De js13kGames-wedstrijd is gewijd aan de HTML5-game-ontwikkelaars en JavaScript-programmeurs die hun vaardigheden willen testen in gevechten met andere ontwikkelaars, de regels volgen, zich houden aan de deadline en prijzen winnen. De competitie loopt van 13 augustus tot 13 september - je hebt de hele maand om te coderen en je inzending in te dienen. Er zijn echter geen externe bibliotheken of bronnen zoals Google-lettertypen toegestaan; alles wat u in uw spel wilt gebruiken, moet passen in 13 kilobytes van een ZIP-pakket. De competitie is gratis voor iedereen, maar de broncode moet op GitHub worden gehost zodat anderen er in de toekomst van kunnen leren.
De limiet van 13 kilobyte is erg beperkend, maar beperkingen brengen vaak creativiteit voort: je moet goed nadenken over hoe je je ideeën kunt implementeren, omdat elke byte echt telt.
Het belangrijkste doel van de compo is plezier. De deadline helpt om het leuk te houden, omdat je op een gegeven moment het project moet beëindigen en er niet voor eeuwig mee kunt blijven zwoegen.
Deelnemen aan de competitie verbetert je vaardigheden, helpt je om je tijd besteed aan het project te beheren en geeft je de mogelijkheid om samen te werken met de gemeenschap. Bovendien is er een kans dat je veel interessante prijzen kunt winnen, bekend kunt worden en uiteindelijk een hoop geld kunt verdienen als ontwikkelaar van een spel. Wat heb je nog meer nodig?
Laten we de specifieke tips en trucs bekijken die u kunt gebruiken om de broncode van uw spel en alle gebruikte activa te verkleinen, van JavaScript-verkleining, tot het snijden van afbeeldingsformaten, tot procedureel niveau en het genereren van audio.
Je hebt een hele maand om je spel te coderen, zodat je het hele weekend geen slapeloze nachten hoeft door te brengen met koffie en energiedrankjes om te concurreren met anderen. Je kunt in je eigen tempo werken, wanneer je tijd hebt en wanneer je maar wilt.
Vanwege de strenge beperkingen van de omvang van het uiteindelijke pakket, is het bijna onmogelijk om een framework te gebruiken. Natuurlijk, als je een kleine set van hulpfuncties kunt voorbereiden die passen in de 13 kilobyte limiet, dan ben je meer dan welkom om dat te doen..
Hetzelfde geldt voor de afbeeldingen: screenshots van de games zijn vaak groter dan de games zelf, dus je moet slim zijn. Je zult sowieso alles zelf genereren, of heel kleine gecomprimeerde items gebruiken; dat is de beste manier om het hele spel in de maximale grootte te passen.
De belangrijkste kern van je JavaScript-game is de broncode - je kunt mogelijk absoluut alles genereren, zonder andere bronnen zoals afbeeldingen of geluiden te gebruiken, dus het optimaliseren van deze code is erg belangrijk.
Het gemakkelijkste is om de code te verkleinen, wat betekent dat het witruimte wordt verwijderd (tabs, spaties, nieuwe regels, enzovoort), zonder dat de code zelf wordt gewijzigd.
Je kunt dit verder nemen door andere tools te gebruiken die je originele broncode wijzigen om de grootte ervan zoveel mogelijk te comprimeren, door kortere variabelenamen en andere dergelijke trucs te gebruiken. Als bijwerking zullen deze tools ook de broncode verbergen en onleesbaar maken verduistering. Een van de belangrijkste concurrentieregels is dat je hoe dan ook een leesbare versie van je inzending op GitHub moet hebben, dus elke byte knijpen door de code in het gezipte pakket onleesbaar te maken is helemaal goed.
Hulpprogramma's zoals Google Closure Compiler, YUI Compressor of UglifyJS en online services zoals Compressor Rater, JSMini of JSObfuscate, kunnen u helpen uw code zo veel mogelijk te comprimeren. Gebruik ze in uw voordeel.
Er zullen niet veel afbeeldingsbestanden in je game zitten als je deze in 13 kilobytes wilt passen, maar toch, als je een afbeelding wilt gebruiken, moet je deze zo veel mogelijk comprimeren. Er zijn online tools zoals TinyPNG en Optimizilla, installeerbare applicaties zoals ImageOptim, opdrachtregelprogramma's en build-scripts om dat te doen, zodat u iets kunt vinden dat past bij uw workflow.
Je kunt ook je spel in lage resolutie coderen met kleine afbeeldingen en alles dan opschalen, of alle afbeeldingen weggooien en alles op het canvas vanuit het niets genereren.
Gezien de beperkte beschikbare ruimte, is het verstandig om na te denken over het randomiseren van de niveaus in je spel. De beste manier om de hoge replay-waarde van je spel te behouden, is door je levels procedureel te genereren, zodat je in plaats van een of twee vaste niveaus een andere ervaring kunt geven elke keer dat het spel wordt gespeeld.
De beste voorbeelden in die categorie zijn roguelikes die doolhoven en kerkers gebruiken voor hun niveaus. Je kunt een enorme wereld genereren met slechts een paar kleine stukjes, en het kan anders zijn elke keer dat je het spel start. Dankzij deze aanpak zullen uw spelers zich niet te snel vervelen.
Audio toevoegen aan je game verhoogt de algehele ervaring, maar met nummers die doorgaans 5MB of meer wegen, hoe kun je die in je js13k-vermelding passen? Jsfxr tot de redding!
In plaats van een MP3 te verkleinen, kunt u uw eigen muziek- en geluidseffecten genereren. Jsfxr is een JavaScript-poort van de sfxr-bibliotheek en werd veel gebruikt door de deelnemers aan de wedstrijd van vorig jaar, wat betekent dat het gevechtstests zijn en geweldige resultaten oplevert.
Naast de reeds genoemde hulpmiddelen, kunt u uzelf helpen door een aantal taken die u heeft te automatiseren; het bouwen van systemen zoals Grunt of Gulp kan het voorbereiden van al uw activa veel gemakkelijker maken.
Als je een fan bent van Gulp, dan is er een hele reeks bouwtaken om uit te kiezen: Jack Rugile suggereert een Gulp-combinatie van gulp-uglify + gulp-htmlmin + gulp-zip + gulp-bestandsgrootte terwijl Csaba Csecskedi toevoegt slok-imagemin tot deze verzameling. Je hoeft het niet te gebruiken als je je niet prettig voelt bij Gulp of gewoon op de ouderwetse manier wilt werken, maar deze set kan je algehele workflow voor je js13kGames-vermelding aanzienlijk verbeteren.
De enige structurele eis naast de groottelimiet is dat u de index.html bestand in de hoofddirectory van het pakket - al het andere is optioneel. U kunt uw code naar wens structureren, mappen voor JavaScript, CSS en afbeeldingsbestanden apart opnemen of alles in het HTML-bestand plaatsen en al het andere vergeten. Je kunt alles handmatig doen of browserify gebruiken, je CSS verbeteren met MINDER of SASS, of zelfs je code pluis maken met ESLint. (Dat is wat Florent Cailhol heeft voorbereid in zijn experimentele js13k boilerplate repository op GitHub.) Nogmaals: dit kan u allemaal helpen, maar geen van alle is vereist.
Dit is misschien vanzelfsprekend, maar vergeet niet zorgvuldig een geschikt type spel te kiezen dat in 13 kilobytes past, omdat sommige spellen moeilijker te bouwen zijn (en kleiner te houden) dan andere. Ik zeg niet dat je geen 3D first-person shooter, realtime-strategie, stadssimulator, 3D-racegame, verkeerslichtmanager of zelfs een naakt bloederig blokspel kunt maken zoals sommige gekke ontwikkelaars in de afgelopen jaren, maar de enorme de meeste inzendingen gaan over eenvoudige spellen met één kernmonteur waarin je je spel rondbrengt, sommige gegenereerde afbeeldingen en soms eenvoudig geluid.
Onthoud dat het afmaken van alles beter is dan het hebben van een enorm, onafgewerkt project dat mensen nooit zullen zien. Volg het One Game a Month-initiatief, houd je aan de deadline en probeer je aanmelding op tijd af te ronden. Houd het zowel qua omvang als qua omvang; als je tevreden bent met het werkende prototype en wat vrije ruimte beschikbaar hebt, kun je later altijd nieuwe functies aan het spel toevoegen. Poets je project zoveel mogelijk en je zult in staat zijn om de competitie te winnen door spellen zoals SpacePi of Radius Raid te bouwen.
Dit zijn de basistips en -technieken die je kunnen helpen bij het coderen van je spel voor de js13kGames-competitie, maar je hoeft ze niet te gebruiken. Er zijn veel tools die u in uw spel kunt gebruiken om de maximale grootte te behouden; het hangt af van je voorkeuren. Als je echter geen ervaring hebt, kun je het beste van anderen leren.
Je kunt de broncode van de inzendingen van de afgelopen jaren bekijken, de spellen spelen en zien wat er mogelijk is binnen de limiet, door de blogposts gaan die de ervaringen van mensen uitleggen, en hun broncode lezen en ervan leren. Stel vragen via sociale media, bespreek uw ideeën en problemen met anderen. Dat is het mooie van een wedstrijd - je bent niet de enige; je kunt in een mum van tijd samenwerken met anderen, teams vormen en je vaardigheden verbeteren.
Alle tools en services die in dit artikel worden vermeld, moeten je helpen je voor te bereiden op de js13kGames-competitie. Het is belangrijk om uw aandacht niet alleen op de tools te vestigen; je moet ook kijken naar wat anderen doen, van hun ervaringen leren en deel uitmaken van de gemeenschap.
Als je verschillende manieren hebt om jezelf voor te bereiden op de wedstrijd, deel deze dan in de reacties! Laten we allemaal profiteren, leren en elkaar helpen. De competitie begon immers leuk en vermakelijk te worden, met onderweg een beetje leren.
Bekijk deze aanvullende bronnen voor de competitie:
Accentsconagua