Hoe om 'n flitsspel te maak: 4 stappe (met foto's)

INHOUDSOPGAWE:

Hoe om 'n flitsspel te maak: 4 stappe (met foto's)
Hoe om 'n flitsspel te maak: 4 stappe (met foto's)
Anonim

Flash is 'n gewilde formaat vir blaaier-gebaseerde videospeletjies wat op webwerwe soos Newgrounds en Kongregate gesien word. Terwyl die Flash-formaat stadigaan minder gebruik word in die lig van die groeiende mobiele programme, word daar steeds baie kwaliteit speletjies daarmee gemaak. Flash gebruik ActionScript, 'n maklik om te leer taal wat u beheer oor die voorwerpe op u skerm gee. Hierdie wikiHow -artikel sal u leer hoe u 'n basiese Flash -speletjie kan skep.

Stappe

Deel 1 van 3: Begin van die proses

381698 1
381698 1

Stap 1. Ontwerp jou spel

Voordat u begin met kodering, sal dit help om 'n goeie idee te hê van wat u met u speletjie wil doen. Flash is die beste geskik vir eenvoudige speletjies, dus fokus op die skep van 'n speletjie met slegs 'n paar meganika waaroor die speler hom kan bekommer. Probeer om 'n basiese genre en 'n paar meganika in gedagte te hou voordat u met prototipering begin. Sien hierdie gids vir meer besonderhede oor die beplanningsfases van die ontwikkeling van videospeletjies. Algemene Flash -speletjies sluit in:

  • Eindelose hardlopers: Hierdie speletjies beweeg die karakter outomaties, en die speler is verantwoordelik om oor hindernisse te spring of op 'n ander manier met die spel te kommunikeer. Die speler het gewoonlik net een of twee opsies wat betref kontroles.
  • Brawlers: Dit is tipies syrol en gee die speler die taak om vyande te verslaan om te vorder. Die spelerskarakter het dikwels verskillende bewegings wat hulle kan uitvoer om vyande te verslaan.
  • Raaisels: Hierdie speletjies vra die speler om raaisels op te los om elke vlak te klop. Dit kan wissel van Match-3-styl soos Bejeweled tot meer komplekse raaiseloplossings wat gewoonlik in avontuurspeletjies voorkom.
  • RPG's: Hierdie speletjies fokus op karakterontwikkeling en vordering, en laat die speler deur verskeie omgewings beweeg met 'n verskeidenheid vyandelike tipes. Gevegsmeganika wissel geweldig van RPG tot RPG, maar baie is op beurt gebaseer. RPG's kan aansienlik moeiliker wees om te kodeer as 'n eenvoudige aksiespel.
381698 2
381698 2

Stap 2. Leer waarop Flash uitblink

Flash is die beste geskik vir 2D-speletjies. Dit is moontlik om 3D -speletjies in Flash te skep, maar dit is baie gevorderd en vereis aansienlike kennis van die taal. Byna elke suksesvolle Flash -speletjie was 2D.

Flash -speletjies is ook die beste geskik vir vinnige sessies. Dit is omdat die meeste Flash -spelers speel wanneer hulle 'n bietjie vrye tyd het, soos tydens pouses, wat beteken dat speletjies gewoonlik 15 minute of minder is

381698 3
381698 3

Stap 3. Maak kennis met die ActionScript3 (AS3) taal

Flash -speletjies is in AS3 geprogrammeer, en u moet basiese kennis dra van hoe dit werk om 'n speletjie suksesvol te kan skep. U kan 'n eenvoudige spel skep met 'n rudimentêre begrip van hoe u in AS3 moet kodeer.

Daar is verskeie boeke oor ActionScript beskikbaar op Amazon en ander winkels, tesame met 'n groot aantal tutoriale en voorbeelde aanlyn

381698 4
381698 4

Stap 4. Laai Flash Professional af

Hierdie program kos geld, maar is die beste manier om vinnig Flash -programme te skep. Daar is ander opsies beskikbaar, insluitend open source-opsies, maar dit ontbreek dikwels verenigbaarheid of neem langer om dieselfde take uit te voer.

Flash Professional is die enigste program wat u nodig het om speletjies te begin skep

Deel 2 van 3: Skryf 'n basiese spel

381698 5
381698 5

Stap 1. Verstaan die basiese boustene van AS3 -kode

As u 'n basiese spel skep, is daar verskillende kode -strukture wat u sal gebruik. Daar is drie hoofdele van enige AS3 -kode:

  • Veranderlikes - Dit is hoe u data gestoor word. Data kan getalle, woorde (snare), voorwerpe en meer wees. Veranderlikes word gedefinieer deur die kode var en moet een woord wees.

    var playerHealth: Number = 100; // "var" dui aan dat u 'n veranderlike definieer. // "playerHealth" is die veranderlike se naam. // "Nommer" is die tipe data. // "100" is die waarde wat aan die veranderlike toegeken word. // Alle reëls vir aksieskrif eindig met ";"

  • Gebeurtenishanteerders - Gebeurtenishanteerders soek na spesifieke dinge wat gebeur, en vertel dan die res van die program. Dit is noodsaaklik vir die invoer van die speler en die herhaling van kode. Gebeurtenishanteerders gebruik gewoonlik funksies.

    addEventListener (MouseEvent. CLICK, swingSword); // "addEventListener ()" definieer die gebeurtenishanteerder. // "MouseEvent" is die kategorie insette waarna geluister word. // ". CLICK" is die spesifieke gebeurtenis in die MouseEvent -kategorie. // "swingSword" is die funksie wat genoem word wanneer die gebeurtenis plaasvind.

  • Funksie - Gedeeltes kode wat aan 'n sleutelwoord toegewys is wat later aangevra kan word. Funksies hanteer die grootste deel van die programmering van u spel, en komplekse speletjies kan honderde funksies hê, terwyl eenvoudiger speletjies slegs 'n paar kan hê. Hulle kan in elke volgorde wees, aangesien hulle slegs werk wanneer hulle versoek word.

    funksie swingSword (e: MouseEvent): leeg; {// Jou kode gaan hier}} // "funksie" is die sleutelwoord wat aan die begin van elke funksie verskyn. // "swingSword" is die naam van die funksie. // "e: MouseEvent" is 'n bykomende parameter, wat toon dat die funksie // van die gebeurtenisluisteraar gebel word. // ": void" is die waarde wat deur die funksie teruggestuur word. As geen waarde // teruggestuur word nie, gebruik: void.

381698 6
381698 6

Stap 2. Skep 'n voorwerp

ActionScript word gebruik om voorwerpe in Flash te beïnvloed. Om 'n speletjie te maak, moet u voorwerpe skep waarmee die speler kan kommunikeer. Afhangende van die gidse wat u lees, kan na voorwerpe sprites, akteurs of filmknipsels verwys word. Vir hierdie eenvoudige spel skep u 'n reghoek.

  • Maak Flash Professional oop as u dit nog nie gedoen het nie. Skep 'n nuwe ActionScript 3 -projek.
  • Klik op die gereedskapteken in die paneel Gereedskap. Hierdie paneel kan op verskillende plekke wees, afhangende van die opset van Flash Professional. Teken 'n reghoek in jou toneelvenster.
  • Kies die reghoek met die keuringshulpmiddel.
381698 7
381698 7

Stap 3. Ken eiendomme toe aan die voorwerp

As u nuutgeskepte reghoek gekies is, maak die kieslys verander en kies "Skakel na simbool". U kan ook F8 as 'n kortpad druk. Gee die voorwerp 'n maklik herkenbare naam in die venster 'Skakel na simbool', soos 'vyand'.

  • Soek die venster Eienskappe. Bo -aan die venster verskyn 'n leë teksveld met die naam "Voorbeeldnaam" as u daaroor beweeg. Noem dit dieselfde as wat jy gedoen het toe jy dit in 'n simbool ('vyand') omskep het. Dit skep 'n unieke naam waarmee interaksie met AS3 -kode gebruik kan word.
  • Elke "instansie" is 'n aparte voorwerp wat deur kode beïnvloed kan word. U kan die reeds gemaakte instansie verskeie kere kopieer deur op die blad Biblioteek te klik en die instansie na die toneel te sleep. Elke keer as u een byvoeg, word die naam verander om aan te dui dat dit 'n aparte voorwerp is ("vyand", "vyand1", "vyand2", ens.).
  • As u na die voorwerpe in die kode verwys, moet u eenvoudig die naam van die instansie gebruik, in hierdie geval 'vyand'.
381698 8
381698 8

Stap 4. Leer hoe u die eienskappe van 'n instansie kan verander

Sodra u 'n instansie gemaak het, kan u die eienskappe aanpas deur middel van AS3. Hiermee kan u die voorwerp om die skerm beweeg, die grootte daarvan verander, ens. U kan eiendomme aanpas deur die instansie te tik, gevolg deur 'n punt ".", Gevolg deur die eiendom, gevolg deur die waarde:

  • vyand.x = 150; Dit beïnvloed die posisie van die vyandelike voorwerp op die X-as.
  • vyand.y = 150; Dit beïnvloed die posisie van die vyandelike voorwerp op die Y-as. Die Y-as word vanaf die bokant van die toneel bereken.
  • vyand.rotasie = 45; Draai die vyandelike voorwerp 45 ° kloksgewys.
  • vyand.skaalX = 3; Strek die wydte van die vyandelike voorwerp met 'n faktor 3. 'n (-) nommer draai die voorwerp om.
  • vyand.skaalY = 0.5; Druk die voorwerp tot die helfte van sy hoogte.
381698 9
381698 9

Stap 5. Ondersoek die spoor () opdrag

Hierdie opdrag gee die huidige waardes vir spesifieke voorwerpe terug en is nuttig om te bepaal of alles werk soos dit moet. U wil moontlik nie die opspooropdrag in u finale kode insluit nie, maar dit is handig om te ontfout.

381698 10
381698 10

Stap 6. Bou 'n basiese spel met behulp van bogenoemde inligting

Noudat u 'n basiese begrip van die kernfunksies het, kan u 'n speletjie skep waar die vyand elke keer as u daarop klik, die grootte verander totdat dit nie meer gesond is nie.

var vyandHP: Getal = 100; // stel die vyand se HP (gesondheid) aan die begin op 100. var playerAttack: Number = 10; // stel die spelers se aanvalskrag in as hulle klik. vyand.addEventListener (MouseEvent. CLICK, attackEnemy); // Deur hierdie funksie direk by die vyandelike voorwerp te voeg, // gebeur die funksie slegs as die voorwerp self // geklik word, in teenstelling met enige plek op die skerm. setEnemyLocation (); // Dit noem die volgende funksie om die vyand // op die skerm te plaas. Dit gebeur wanneer die spel begin. function setEnemyLocation (): void {vyand.x = 200; // skuif die vyand na 200 pixels van links van die skerm vyand.y = 150; // beweeg die vyand 150 pixels van die bokant van die skerm af vyand.rotasie = 45; // draai die vyand 45 grade met die kloksgewys spoor ("vyand se x-waarde is", vyand.x, "en vyand se y-waarde is", vyand.y); // Toon die huidige posisie van die vyand vir ontfouting} funksie attackEnemy (e: MouseEvent): void // Dit skep die aanvalfunksie vir wanneer op die vyand geklik word {vyandHP = vyandHP - spelerAanval; // Trek die aanvalswaarde af van die HP -waarde, // wat die nuwe HP -waarde tot gevolg het. vyand.skaalX = vyandHP / 100; // Verander die breedte op grond van die nuwe HP -waarde. // Dit word gedeel deur 100 om dit in 'n desimaal te verander. vyand.skaalY = vyandHP / 100; // Verander die hoogte op grond van die nuwe HP -waardespoor ("Die vyand het", vyandHP, "HP links"); // Stel hoeveel HP die vyand oor het}

381698 11
381698 11

Stap 7. Probeer dit

Sodra u die kode geskep het, kan u u nuwe speletjie toets. Klik op die Control -kieslys en kies Test Movie. U spel begin, en u kan op die vyandelike voorwerp klik om die grootte daarvan te verander. U Trace -uitsette word in die uitvoervenster vertoon.

Deel 3 van 3: Leer gevorderde tegnieke

381698 12
381698 12

Stap 1. Leer hoe pakkette werk

ActionScript is gebaseer op Java en gebruik 'n baie soortgelyke pakketstelsel. Met pakkette kan u veranderlikes, konstantes, funksies en ander inligting in aparte lêers stoor en dan hierdie lêers in u program invoer. Dit is veral handig as u 'n pakket wil gebruik wat iemand anders ontwikkel het, wat u spel makliker sal maak.

Raadpleeg hierdie gids vir meer inligting oor hoe pakkette in Java werk

381698 13
381698 13

Stap 2. Bou u projekvouers

As u 'n speletjie met veelvuldige beelde en klankgrepe skep, wil u 'n vouerstruktuur vir u spel skep. Hiermee kan u u verskillende elemente maklik stoor, sowel as verskillende pakkette wat u kan aanroep.

  • Skep 'n basismap vir u projek. In die basismap moet u 'n "img" -gids vir al u kunsbates hê, 'n "snd" -gids vir al u klankbates en 'n "src" -gids vir al u speletjiepakkette en -kode.
  • Skep 'n "Game" -map in die "src" -map om u Constants -lêer te stoor.
  • Hierdie spesifieke struktuur is nie nodig nie, maar dit is 'n maklike manier om u werk en materiaal te organiseer, veral vir groter projekte. Vir die eenvoudige spel wat hierbo verduidelik word, hoef u geen kaarte te skep nie.
381698 14
381698 14

Stap 3. Voeg klank by jou spel

'N Spel sonder klank of musiek sal die speler vinnig vervelig raak. U kan klank by voorwerpe by Flash voeg met die Gereedskap vir lae. Sien hierdie gids vir meer besonderhede.

381698 15
381698 15

Stap 4. Skep 'n Constants -lêer

As u spel baie waardes het wat dieselfde sal bly gedurende die hele spel, kan u 'n Constants -lêer skep om almal op een plek te stoor, sodat u dit maklik kan aanroep. Konstante kan waardes insluit soos swaartekrag, spelsnelheid en enige ander waarde wat u herhaaldelik moet aanroep.

  • As u 'n Constants -lêer skep, moet dit in 'n gids in u projek geplaas word en dan as 'n pakket ingevoer word. Byvoorbeeld, laat ons sê dat u 'n Constants.as -lêer skep en dit in u spelgids plaas. Om dit in te voer, gebruik u die volgende kode:

    pakket {import Game.*; }

381698 16
381698 16

Stap 5. Kyk na ander mense se speletjies

Alhoewel baie ontwikkelaars nie die kode vir hul speletjies bekend sal maak nie, is daar 'n verskeidenheid tutoriale vir projekte en ander oop projekte waarmee u die kode kan sien en hoe dit met spelvoorwerpe kan reageer. Dit is 'n uitstekende manier om 'n paar gevorderde tegnieke te leer wat u spel kan help uitstaan.

Aanbeveel: