Ooit een online game gespeeld en gedacht: "Ik wou dat ik er zo een kon maken, ik heb geweldige ideeën"? In het verleden was het noodzakelijk om te hebben geleerd hoe te coderen in ActionScript 3, de taal die Flash aanstuurt. Dankzij sommige programma's voor het bouwen van games is codeerervaring echter een vereiste uit het verleden. Je kunt leuke, diepgaande games maken door objecten en logica te manipuleren, zonder ooit een regel code aan te raken.
Stappen
Deel 1 van 4: Het spel ontwerpen
Stap 1. Schrijf een basisbeschrijving op
Voeg functies toe en wat u wilt dat de speler bereikt. Het is goed om een basisoverzicht te hebben van wat je met je spel wilt doen, zodat je ernaar kunt verwijzen terwijl je eraan werkt.
Raadpleeg deze handleiding voor meer informatie over het schrijven van een game-ontwerpdocument
Stap 2. Teken enkele schetsen
Teken een basislay-out van hoe u wilt dat de schermen eruit zien. Deze hoeven niet erg gedetailleerd te zijn, maar je moet in ieder geval een idee hebben waar de verschillende elementen op het scherm komen te staan. Deze zullen later ongelooflijk handig zijn wanneer je begint met het bouwen van de interface voor je game.
Stap 3. Kies een methode om je spel te maken
Traditioneel zou u moeten leren coderen in ActionScript 3 om Flash-games te maken. Hoewel je dat nog steeds kunt doen, zijn er programma's beschikbaar die het maken van games veel gemakkelijker te leren maken en waarvoor geen codeerervaring vereist is. Enkele van de meest populaire opties voor het maken van games zijn:
- Stencyl - Dit is een nieuwere tool waarmee je games kunt bouwen met objecten en logische scripts. Deze games kunnen vervolgens worden omgezet in Flash-projecten en worden geüpload naar elke website die Flash-games ondersteunt.
- Construct 2 - Naarmate Flash ouder wordt, wordt het vervangen door andere manieren om games te maken. Een van de nieuwste manieren om een online game te maken, is door HTML5 te gebruiken. Normaal gesproken vereist dit veel codeerkennis, maar Construct 2 stelt je in staat om games te maken met objecten en scripts, net zoals Stencyl.
- Flash Builder - Dit is de traditionele methode voor het maken van Flash-spellen. Dit vereist een behoorlijke hoeveelheid ActionScript-kennis, maar het is een van de gemakkelijkere talen om de basis van te leren. Flash Builder kost geld, maar u kunt het open-source FlashDevelop-programma gebruiken om de meeste van dezelfde functionaliteit te krijgen.
Deel 2 van 4: Stencyl. gebruiken
Stap 1. Download en installeer Stencyl
Stencyl is een programma voor het maken van games waarvoor geen codeerkennis vereist is. In plaats daarvan kun je verschillende logische hulpmiddelen gebruiken om objecten in het spel te manipuleren.
Stencyl kan gratis worden gebruikt als je je game alleen online wilt publiceren. De gratis versie heeft aan het begin een Stencyl-logo. Als u de betaalde versie krijgt, kunt u op andere platforms publiceren
Stap 2. Maak je nieuwe game aan
Wanneer u Stencyl start, krijgt u een lijst met uw games te zien. Er zullen verschillende voorbeeldgames op de lijst staan die u kunt bekijken om te zien hoe ze werken. Om aan je eigen spel te werken, klik je op het vakje met de stippellijn met het label "Klik hier om een nieuw spel te maken".
Stap 3. Selecteer een kit
Er zijn verschillende kits die kant-en-klare middelen en objecten bevatten die je kunnen helpen je game snel aan de gang te krijgen. Selecteer een kit als je wilt, of selecteer "Blanco Game" als je van plan bent er zelf een te maken.
U kunt kits downloaden die andere gebruikers online hebben gemaakt
Stap 4. Voer je spelinformatie in
Voordat je begint met het maken van je game, moet je een paar gegevens invoeren.
- Naam - Dit is de naam van je spel. U kunt dit later wijzigen in wat u maar wilt.
- Schermgrootte - Dit is de grootte van je gamescherm en is erg belangrijk omdat het de kunst die je gebruikt beïnvloedt. Aangezien mensen je game hoogstwaarschijnlijk in hun webbrowser zullen spelen, hoeft de schermgrootte niet erg groot te zijn. Probeer Breedte: 640 px Hoogte: 480 px. Dit is een goede maat om mee te beginnen.
Stap 5. Raak vertrouwd met de lay-out
Wanneer u uw nieuwe game voor het eerst laadt, wordt u naar het Dashboard gebracht. Hier kun je alle scènes voor je game zien en toegang krijgen tot alle bronnen. Je kunt hier ook je spelinstellingen wijzigen. Je zult het grootste deel van je tijd in het Dashboard werken.
- Scènes - Dit is het hoofdvenster van het dashboard en toont het eigenlijke spel en alle activa. Je spel zal een verzameling scènes zijn.
- Bronnen - Dit is de lijst met alle objecten en activa in je spel. het bevat acteurs, achtergronden, lettertypen, scènes, logica, geluiden en tegelsets. De bronnen zijn geordend in een boom aan de linkerkant van het scherm.
- Instellingen - Met de opties Spel en Instellingen kun je aanpassen hoe de mechanica van je spel werkt, inclusief besturing, zwaartekracht, botsingen, laadschermen en meer.
Stap 6. Pas een acteur aan
Een acteur is elk object dat beweegt of waarmee interactie mogelijk is in het spel (speler, vijand, deuren, enz.). Je moet een acteur maken voor elk object in je spel. Om een acteur aan te maken, klikt u op de optie "Actortypes" in het menu Bronnen. Selecteer de gewenste acteur uit de lijst (de lijst wordt bepaald door de kit die je hebt gekozen).
- Wijs de acteur toe aan een groep (speler, vijand). Dit zal helpen bij het bepalen van de botsingseigenschappen van de acteur. Selecteer uw acteur om de acteurseditor te openen. Klik op het tabblad Eigenschappen en kies vervolgens de juiste groep in het vervolgkeuzemenu.
- Voeg gedrag toe (springen, stampen, lopen). Gedrag zorgt ervoor dat je acteur acties kan uitvoeren. Klik op het tabblad Gedrag en klik vervolgens op de knop '+ Gedrag toevoegen' in de linkerbenedenhoek. Selecteer een gedrag (zoals 'Lopen') uit de lijst en klik vervolgens op 'Kiezen'.
- Stel de bedieningselementen in. Als je een spelerspersonage maakt, wil je waarschijnlijk de speler toestaan om het te verplaatsen. Wanneer u het loopgedrag toevoegt, gaat u naar het scherm Loopattributen. U kunt de vervolgkeuzemenu's gebruiken om te kiezen met welke toetsen de acteur naar links en rechts wordt verplaatst. U kunt ook animaties toewijzen als de kit die u gebruikt er een bevat.
- U kunt meerdere gedragingen toevoegen om aan te passen wat een acteur kan doen.
Stap 7. Maak een scène
De scène is wat de speler ziet tijdens het spelen van het spel. Het is de achtergrond, maar ook alle objecten en acteurs die zichtbaar zijn. Als u een nieuwe scène wilt maken, klikt u op de optie Scènes in de bronnenstructuur en klikt u vervolgens op het gestippelde vak. Geef je nieuwe scène een naam om door te gaan.
- Achtergrond - Je scène wordt automatisch op maat gemaakt, dus daar hoef je je op dit moment geen zorgen over te maken. U kunt ervoor kiezen om een kleur als achtergrond te gebruiken, waarop tegels worden geplaatst. Je kunt kiezen uit een effen kleur of een verloop. Klik op "Maken" als u klaar bent. Dit opent de Scene Designer.
- Plaats tegels - De tegelset die in je kit zit, wordt aan de rechterkant van het venster geladen. Klik op het gereedschap Potlood in het linkermenu en klik vervolgens op de tegel die u wilt gebruiken. Je kunt de tegel vervolgens op je scène plaatsen. Klik en sleep met de muis om meerdere tegels te plaatsen.
- Acteurs plaatsen - Klik op het tabblad Acteurs boven je tegelset om over te schakelen naar je beschikbare acteurs. U moet ze eerder hebben gemaakt om ze in deze lijst te laten verschijnen. Klik op de acteur die u wilt plaatsen en klik vervolgens op de plaats in de scène waar u deze wilt laten verschijnen. Als u ⇧ Shift ingedrukt houdt, wordt de acteur naar het raster uitgelijnd.
- Zwaartekracht toevoegen - Klik op het tabblad "Natuurkunde" bovenaan het venster en voer vervolgens een waarde in het veld "Zwaartekracht (verticaal)" in. Als u 85 invoert, wordt de zwaartekracht in de echte wereld gesimuleerd.
Stap 8. Test het spel
Nadat je een scène hebt gemaakt en enkele acteurs hebt geplaatst, kun je het spel uitproberen. Klik op de knop "Spel testen" bovenaan het scherm om te spelen wat je tot nu toe hebt. Je kunt de toetsen die je instelt bij het maken van je acteurs gebruiken om je spelerspersonage te besturen.
Zoek alle aspecten die niet werken, en probeer ze op te lossen. Gedragen de vijanden zich bijvoorbeeld correct? Kun jij je vijanden verslaan? Zijn er platforms die onbereikbaar zijn of kloven die niet kunnen worden overgestoken? Ga terug naar het relevante gedeelte van je game-editor om eventuele problemen op te lossen. Dit kan even duren, maar het eindresultaat zal een veel leuker en speelbaarder spel zijn
Stap 9. Voeg meer toe
Nu je een werkende, speelbare eerste scène hebt, is het tijd om het hele spel te bouwen. Voeg meer niveaus en uitdagingen toe en blijf je toevoegingen testen om ervoor te zorgen dat ze leuk zijn en goed werken.
Stap 10. Site Vergrendel je spel
Als je de game gaat uploaden naar een site die Flash-games host, of naar je eigen site gaat uploaden, wil je waarschijnlijk "Site Locking" inschakelen. Dit voorkomt dat je spel wordt gespeeld als het niet op de lijst met toegestane sites staat.
- Open "Spelinstellingen" vanuit uw "Bronnen"-boom. Selecteer het gedeelte "Lader". Voer de sites die u wilt toestaan in het veld "Sitevergrendeling" in, gescheiden door een komma zonder spatie. Bijvoorbeeld newgrounds.com, kongregate.com.
- Terwijl u zich op dit scherm bevindt, voert u uw startpagina in het veld "Uw startpagina" in, als u er een heeft. Hierdoor kunnen spelers die uw spel spelen, worden gekoppeld aan uw site.
Stap 11. Exporteer het spel als Flash
Als je eenmaal tevreden bent met je spel, kun je het exporteren naar het Flash-formaat. Hiermee kun je de game uploaden naar een site die Flash-games host, of naar je eigen website. Klik Publiceren selecteer Web en klik vervolgens op Flash. Sla het bestand op een gemakkelijk te vinden locatie op uw computer op.
Stap 12. Publiceer het spel
Zodra u uw Flash-bestand (. SWF) hebt, kunt u het uploaden naar de host van uw keuze. Er zijn verschillende sites online die Flash-games hosten, en sommige laten je zelfs geld verdienen met advertentie-inkomsten met je game. Je kunt je game ook uploaden naar je eigen website, maar je moet ervoor zorgen dat je de bandbreedte hebt om spelers te bedienen als de game populair wordt.
- Zie deze handleiding voor het uploaden van je game naar je eigen website.
- Als je je game wilt uploaden naar een site zoals Newgrounds of Kongregate, moet je een account maken en vervolgens het uploadproces voor de site doorlopen. De voorwaarden verschillen van site tot site.
- Als je je game naar de Stencyl Arcade wilt publiceren, kun je dat doen vanuit het Stencyl-programma. Klik Publiceren selecteer Stencyl en klik vervolgens op Arcade. De game wordt automatisch geüpload, dus zorg ervoor dat je tevreden bent met de naam voordat je dit doet. Stencyl Arcade heeft een maximale bestandsgrootte van 8 MB.
Deel 3 van 4: Construct 2 gebruiken
Stap 1. Download en installeer Construct 2
Met dit programma kun je HTML5-spellen maken met heel weinig codering. U zult enkele variabelen moeten toewijzen, maar dit gebeurt allemaal via menu's zonder dat er daadwerkelijke codering nodig is.
Construct 2 is gratis, hoewel sommige functies beperkt zijn, tenzij je een upgrade uitvoert. De gratis versie kan niet worden gepubliceerd op andere platforms dan HTML5
Stap 2. Maak een nieuw project aan
Wanneer u Construct 2 voor het eerst start, wordt u begroet met een welkomstmenu. Klik op de link "Nieuw project" om een nieuw spel te beginnen. Er zijn ook een paar voorbeelden die u kunt gebruiken om te zien hoe basisspellen worden gemaakt.
Wanneer u een nieuw project aanmaakt, krijgt u een lijst met sjablonen. Voor je eerste project wil je waarschijnlijk beginnen met een leeg project. Hiermee kunt u de basis onder de knie krijgen zonder dat sjablonen in de weg zitten
Stap 3. Pas uw projectinstellingen aan
In het linkerframe van het projectvenster ziet u een reeks items in het Properties-frame. U kunt dit gebruiken om uw schermgrootte in te stellen en uw spel- en bedrijfsinformatie in te voeren.
Stap 4. Voeg een achtergrond in
Dubbelklik op de lay-out. Selecteer "Betegelde achtergrond" in het gedeelte Algemeen. Klik op je lay-out om de achtergrond te plaatsen. Hiermee wordt de achtergrondeditor geopend. U moet uw eigen beeldbewerkingssoftware maken of texturen van verschillende locaties online downloaden.
- Stel de achtergrond in op de grootte van de lay-out. Doe dit door het achtergrondobject te selecteren en de grootte te wijzigen in het venster Eigenschappen.
- Verander de naam van de laag en vergrendel deze. U wilt de laag vergrendelen om te voorkomen dat u deze per ongeluk verplaatst terwijl u andere objecten plaatst. Klik op het tabblad "Lagen" aan de rechterkant van het scherm. Selecteer de laag en klik op het potloodpictogram. Noem de laag "Achtergrond" en klik vervolgens op de knop "Hangslot" om de achtergrond te vergrendelen.
Stap 5. Maak een nieuwe laag aan
Klik op het tabblad Lagen op de knop "+" om een nieuwe laag te maken. Hernoem het naar "Hoofd". Dit is de laag waarop de meeste van je game-objecten zich bevinden. Zorg ervoor dat de hoofdlaag is geselecteerd voordat u doorgaat.
Stap 6. Voeg ingangen toe voor je spel
In Construct 2 moeten je invoer als objecten aan je spel worden toegevoegd. Ze zijn onzichtbaar en maken het gebruik van toetsenbord en muis gedurende het hele project mogelijk.
Dubbelklik op uw lay-out en selecteer "Muis" in het gedeelte Invoer. Doe hetzelfde om het object "Toetsenbord" in te voegen
Stap 7. Objecten toevoegen
Het is tijd om wat game-objecten aan je lay-out toe te voegen. Dubbelklik op de lay-out en selecteer "Sprite" in het gedeelte Algemeen. Gebruik het dradenkruis om te kiezen waar je de sprite wilt plaatsen. De afbeeldingseditor wordt geopend, zodat u een bestaande sprite kunt laden of een nieuwe kunt maken.
Wanneer u de sprites in uw lay-out selecteert, worden de eigenschappen van de sprite in het linkerframe geladen. Verander de naam van de sprite zodat je hem gemakkelijker kunt identificeren en ernaar kunt verwijzen
Stap 8. Voeg gedrag toe aan uw objecten
Om een gedrag toe te voegen, klikt u op het object waaraan u een gedrag wilt toevoegen om het te selecteren. Klik op de link "Toevoegen/bewerken" in het gedeelte Gedrag van het venster Eigenschappen. Er verschijnt een lijst met beschikbare gedragingen.
Gedragingen zijn voorgeconfigureerde stukjes logica waarmee u snel functionaliteit aan uw objecten kunt toevoegen. U kunt kiezen uit een breed scala aan vooraf ingestelde gedragingen die een breed scala aan functies kunnen uitvoeren. Om de vloer bijvoorbeeld solide te maken, geeft u deze het gedrag "Solid". Om het speler-personage in acht richtingen te verplaatsen, geef het het gedrag "8 richtingen beweging"
Stap 9. Gedragseigenschappen wijzigen
U kunt bestaand gedrag bewerken om de manier waarop uw objecten werken aan te passen. U kunt de waarden wijzigen om de snelheid, richting en andere eigenschappen te wijzigen.
Stap 10. Begrijp hoe gebeurtenissen werken
Evenementen zijn een lijst met voorwaarden en zijn de drijvende kracht achter het spel. Als aan de voorwaarden wordt voldaan, vindt er een gebeurtenis plaats. Als niet aan de voorwaarden wordt voldaan, vindt er geen gebeurtenis plaats. Het gebeurtenisblad wordt meestal ongeveer 60 keer per seconde uitgevoerd. Elke keer dat het wordt uitgevoerd, wordt een "tick" genoemd.
Stap 11. Maak een evenement aan
Dubbelklik in het lege gebeurtenisblad. Er verschijnt een lijst met beschikbare objecten. Selecteer het object waarvoor u een gebeurtenis wilt maken, of u kunt een systeemgebeurtenis maken.
- Selecteer wanneer de actie plaatsvindt. Nadat u het object hebt geselecteerd, wordt u gevraagd te selecteren wanneer de gebeurtenis moet plaatsvinden. Dit kan op basis van andere evenementen of op bepaalde tijden. "Elk vinkje" is altijd.
- Voeg een actie toe. U wordt gevraagd een van uw objecten te selecteren. Kies uit een lijst met acties. Als je bijvoorbeeld een top-down shooter maakt en je wilt dat het personage van de speler altijd naar de muis kijkt, dan zou je een actie "Zet hoek in de richting van positie" maken op elke tick die is ingesteld op het Player-object. Wanneer u om de coördinaten wordt gevraagd, voert u "Mouse. X" in voor X en "Mouse. Y" voor Y. Hierdoor blijft het schip van de speler altijd naar de cursor gericht.
Stap 12. Voeg meer gebeurtenissen en gedrag toe
Deze vormen de ruggengraat van je spel. Door gedrag en gebeurtenissen toe te voegen en aan te passen, kun je een uniek en leuk spel maken dat mensen graag willen spelen. Experimenteer met verschillende evenementen om te proberen het exacte spel te krijgen dat je wilt.
Stap 13. Voeg enkele variabelen toe
Er zijn twee soorten variabelen in Construct 2: instantievariabelen en globale variabelen. Hiermee kunt u aangepaste waarden instellen voor uw objecten en spel, zoals gezondheid, tijdslimieten, scores en meer.
- Instantievariabelen - Instantievariabelen zijn variabelen die aan afzonderlijke objecten zijn toegewezen. Ze worden gebruikt voor zaken als de gezondheid van vijanden en spelers. U kunt instantievariabelen toevoegen nadat u een object hebt geselecteerd door op de link "Toevoegen/bewerken" in het gedeelte Variabelen van het frame Eigenschappen te klikken. Geef de variabele een naam waarnaar in een gebeurtenis kan worden verwezen, evenals een beginwaarde.
- Globale variabelen - Globale variabelen zijn variabelen die aan het hele spel zijn toegewezen. Ze worden gebruikt voor zaken als de spelersscore. Om een globale variabele te maken, opent u het Event-blad en klikt u met de rechtermuisknop op een lege ruimte. Klik op "Algemene variabele toevoegen", geef het een naam waarnaar in een gebeurtenis kan worden verwezen en voer vervolgens een beginwaarde in.
Stap 14. Maak een interface
Bij het maken van een interface is het meestal het beste om dit op een nieuwe laag te doen. Dit komt omdat de interface zelden beweegt of verandert, dus het is goed om het op een vergrendelde laag te hebben. Zet in het Eigenschappen-frame voor de nieuwe laag "Parallax" op 0. Dit zorgt ervoor dat de laag niet kan scrollen als het scherm dat doet.
Gebruik tekstvakken en variabelen om uw interface te maken. Je kunt je tekstvakken instellen om de resterende gezondheid, score, munitie of iets anders weer te geven dat de speler regelmatig zou moeten zien
Stap 15. Test en herzie je spel
Nu je een aantal objecten op het scherm hebt met gebeurtenissen en gedragingen, kun je beginnen met het testen en toevoegen van inhoud. Klik op de "Play"-knop bovenaan het scherm om het spel te bouwen en te testen. Noteer alles wat niet werkte en probeer het te repareren zodat je spel speelbaar en leuk wordt.
Stap 16. Exporteer het spel
Als je tevreden bent met je spel, kun je het exporteren zodat het kan worden geüpload naar een website en door iedereen kan worden gespeeld. Om het spel te exporteren, klik op de Bestand menu en selecteer Exporteren. Sla het project op een locatie op die u gemakkelijk kunt vinden.
Stap 17. Publiceer het spel
Er zijn verschillende sites waarmee je HTML5-games kunt uploaden zodat anderen ze kunnen spelen. Je kunt het spel ook toevoegen aan je eigen website. Zie deze handleiding voor details over het uploaden van de game naar je eigen website.
Deel 4 van 4: Coderen vanaf nul
Stap 1. Download een programmeer-IDE (Integrated Development Environment) die HTML ondersteunt, zoals Game Maker Studio
Sommige zijn gratis beschikbaar, hoewel veel van de beste IDE's honderden dollars kosten.
Stap 2. Leer de IDE te gebruiken
Leren programmeren in je omgeving is ontzettend belangrijk. Het onthouden van de meeste algemene code en leren hoe je dingen op de juiste manier kunt implementeren, kan weken of zelfs maanden duren. Wees geduldig en het zal allemaal zijn vruchten afwerpen!
Stap 3. Maak je game als je denkt dat je er klaar voor bent
Een ontwerpdocument maken of ideeën opschrijven is een goed begin. Het programmeren van een game kan maanden duren of als je echt serieus een hit wilt maken, zelfs een jaar of twee.
Stap 4. Test het spel
Zorg ervoor dat je gekke of onverwachte dingen doet en verpletter zoveel mogelijk bugs. Probeer ook te bepalen of de gameplay is zoals je het wilde, of dat je terug moet gaan om wijzigingen aan te brengen.
Stap 5. Publiceer het
Publiceer je game online op een website zoals Kongregate. Je moet voorbereid zijn op opbouwende kritiek en misschien wil je je game updaten om aan de wensen van je playerbase te voldoen.
Tips
- Als u meer wilt weten over de code achter Flash-games, kunt u Flash Builder- en ActionScript 3-code gebruiken om aangepaste games te maken. Dit duurt langer, maar kan resulteren in een meer unieke ervaring. Raadpleeg deze handleiding voor details over programmeren in Actions Script 3.
- Geef erkenning aan alle bronnen waaruit je ideeën of inhoud hebt gehaald, en aan alle anderen die hebben geholpen bij het maken van de game.
