Útmutató

Construct 3 vagy vanilla JavaScript HTML5 játéksablon? Így válassz

Szerkesztőben megnyíló motorprojekt, vagy sima fájlok, amelyeket bármely szövegszerkesztőben módosítasz: mit igényel mindkettő, mit ad, és hogyan tesztelheted egyiket is vásárlás előtt.

Polarzinho egy elágazásnál áll két munkapad között: az egyiken színes vizuális építőkockák vannak, a másikon billentyűzet és képernyő kapcsos zárójelekkel.

Válaszd a Construct 3 játéksablonok valamelyikét, ha a játékot vizuális szerkesztőben akarod módosítani, és nem zavar, hogy minden alkalommal meg kell nyitnod ezt a szerkesztőt. Válaszd a vanilla JavaScript játéksablont, vagyis a motor nélküli HTML5 játéksablont, ha bármely szövegszerkesztőben tudsz kódot megnyitni, vagy ha ezt valaki a te oldaladon meg tudja tenni. Egyik sem a jobb termék. A különbség az, hogy mit kell a gépen telepíteni, mielőtt bármit megváltoztathatnál.

Mi a második fajtát árusítjuk, ezért van benne érdekünk. A tisztesség kedvéért a motoros oldal nyilvános oldalait úgy olvastuk, ahogy 2026. október 24-én álltak: a Construct saját funkcióösszehasonlítását és dokumentációját, valamint négy nyilvános CodeCanyon-hirdetést HTML5 játékokhoz, amelyek Construct-projekteket szállítanak. Minden, amit a sablonjainkról mondunk, a termékoldalainkból, a feltételeinkből és a nyilvános kézikönyvekből származik, amelyeket magad is megnyithatsz.

Lentebb kapsz egy rövid döntési fát, őszinte listát arról, mit nyersz és mit adsz fel mindkét úton, két sablonunkat részletesen bemutatva, egy tesztet, amelyet fizetés előtt bármelyik fajtánál lefuttathatsz, és hat kérdést, amelyet az emberek gyakran feltesznek.

Construct 3 játéksablonok: mik ezek, és mire van szükséged a megnyitásukhoz

A Construct egy játékkészítő eszköz, amelynek vizuális szerkesztője böngészőben is fut. A gyakorlatban a Construct 3 játéksablon egy, a szerkesztőhöz készült projektfájl, plusz a játék HTML5-változata, amelyet változtatás nélkül feltölthetsz tárhelyre. A négy megnézett CodeCanyon-hirdetésnél a fájllista minden alkalommal ugyanolyan volt: egy .c3p projektfájl a HTML5 játékfájlok mellett.

Amit a négy hirdetés a szerkesztésről mondott, egyenként: az egyik szerint a kód szerkesztéséhez kell a Construct 3 eszköz, az online szerkesztőre mutat, és hozzáteszi, hogy az ingyenes verzió korlátozott. Egy másik szerint egy ingyenes, harmadik féltől származó bővítmény már a projekt megnyitásához is kell. Kettő a Construct 3-at nevezi meg szoftververzióként, és segítséget ajánl a grafikák cseréjéhez (képek cseréje képszerkesztőben; egy átdolgozási útmutató), anélkül hogy megmondaná, a motor melyik kiadására van szükség. Eladókat nem nevezünk meg: ez egy minta, nem ítélet egyikükről sem.

A motor saját oldalai 2026. október 24-én olvasva: az ingyenes kiadás tartalmazza a HTML5-be exportálást. Korlátozza az események számát (50, ha bejelentkezett és ellenőrzött e-mail-címmel vagy, 25 vendégként) és a rétegek számát (2). A funkciótáblázat az ingyenes kiadásban nem szereplő dolgok között sorolja fel a játékokból származó bevételt, a hirdetést és az alkalmazáson belüli vásárlásokat. Az oldal a fizetős csomagokat is aszerint bontja, ki vásárol, például magánszemély, bejegyzett vállalkozás vagy oktatási intézmény, ezért nézd meg, melyik a tiédhez tartozik.

A Construct dokumentációja és weboldala eseménylapokból épülő játékokat ír le: a szerkesztőben látható feltételekből és műveletekből álló eseményekből, a haladó felhasználóknak pedig JavaScript is választható. Ez az út fő vonzereje, a következő szakaszokban ezzel külön foglalkozunk.

Nézd meg a Polar Games piacterét

HTML5 játéksablon motor nélkül: mit jelent ez a katalógusunkban

A sima JavaScript sablon HTML-, CSS-, JavaScript- és JSON-fájlok mappája. Bármely szövegszerkesztő megnyitja őket, a böngésző pedig akkor futtatja, ha webtárhelyen vannak. Az index.html dupla kattintással nem működik, mert a böngészők a file:// alatt blokkolják a modulokat.

Itt pontosnak kell lennünk, mert a „motor nélkül” nem ugyanaz, mint a „nincs építési lépés”. A piactér minden tételének követelményeit elolvasva a kiadások három csoportba esnek:

  • Szerkesztés és feltöltés, semmit nem kell telepíteni: Ricopop (a game/ mappa maga a szerkeszthető forrás: szerkesztesz, feltöltesz, frissítesz), Velvet Pool és Puttide (nincs npm, nincs építési lépés, nincs PHP, nincs adatbázis; a Velvet Pool kézikönyve szerint a source/ mappában szerkesztesz, és a módosított fájlokat átmásolod a game/ mappába). A Node.js csak a választható fejlesztői eszközökben jelenik meg, azokban a kiadásokban, amelyekben van ilyen.
  • Sima fájlok egy kis építési segédprogrammal: Gridspark és Solitaire Links (utóbbi sima HTML, CSS és JavaScript). Telepítéshez és játékhoz egyiknél sem kell építés. A Gridspark kézikönyve szerint a source/ mappában dolgozol, és futtatod az npm test és npm run build parancsot (Node.js 20+, npm-függőségek nélkül), hogy a játszható fájlok a game/ mappába kerüljenek; a beállításfájlja sima szöveg. A Solitaire Linksben a beállításfájl építés nélkül szerkeszthető, a Node.js 20+ csak a tesztekhez és a nyelvek generálásához kell, a grafikákhoz, szabályokhoz és szövegekhez pedig a kézikönyv a választható forrás-kiadást és az újraépítést említi.
  • TypeScript-projektek: Beep Out, Pinloop, Riffvolt, Sunset Rally, Trimora és Twirldrop (Vite-építés), Zabum (React és TypeScript), valamint Tenguin, Mochi Monsters, Deepforge és Barricade Z. A tárhelyre feltöltött game/ mappa olvasható JavaScript, de a TypeScript-forrás módosításához és újraépítéséhez Node.js kell (a Trimora követelményei között az npm ci, npm test és npm run build szerepel). A pontos verzió minden tétel Követelmények fülén található.

Minden kiadásban a készre épített game/ mappa változtatás nélkül fut statikus tárhelyen. Egyik követelménylista sem említ játékmotor-szerkesztőt vagy motorlicencet, és egyik sem kér fiókot a szerkesztéshez. Ez maga az állítás. Nem mondjuk, hogy itt minden sablon kihagyja az építési lépést, mert ez nem lenne igaz.

Rövid döntési fa: ha ezt akarod, azt válaszd

A döntést az első napon elvárt tevékenységből indulj ki, ne a technológiából.

  • Ha szinteket, grafikákat és szabályokat akarsz átírni kódírás nélkül, és hajlandó vagy megtanulni a szerkesztőt, vagy már használod: motoros sablon. A vizuális események pont erre készültek.
  • Ha már használod a Constructot, és előnyt szeretnél egy játéktípussal: motoros sablon, mert a projektet olyan eszközben nyitod meg, amelyet ismersz.
  • Ha te vagy a fejlesztő, vagy a fejlesztőd kódszerkesztőben dolgozik, verziókövetéssel, és minden változtatást szöveges különbségként akarsz látni: sima JavaScript sablon.
  • Ha csak a nevet, a színeket, a szövegeket és a szinteket akarod módosítani, majd feltölteni: bármelyik jó. Ellenőrizd, hogy a hirdetés megnevezi a fájlokat (sima JavaScript), vagy hogy az ingyenes kiadás meg tudja nyitni a projektet (motoros út).
  • Ha a játékot olyan ügyfélnek kell átadnod, akinek nincs motor-előfizetése: a sima fájlokat könnyebb továbbadni, mert bármely szövegszerkesztő megnyitja őket. Ha az ügyfél már a motorban dolgozik, a projektfájl a jobb átadás.
  • Ha hirdetésből akarsz bevételt szerezni: olvasd el a motor licenctáblázatát, mielőtt elkezdesz, mert az ingyenes kiadás a hirdetést nem tartalmazza, és olvasd el bármely sablon licencét is. A mi licencünk megengedi, hogy a végterméket hirdetéssel monetizáld, de a játékok hirdetési hálózat nélkül érkeznek.
  • Ha egyiket sem ismered: próbáld ki mindkettőt egy órán át (lásd lent a tesztet), és tartsd meg azt, amelyikkel már nem küzdesz.

Nézd meg a Ricopopot: sima JavaScript sablon, amelynek szintjei szöveges térképek

A motoros út: mit nyersz és mit adsz fel

Komolyan vedd a motoros utat. Azért létezik, mert sokan úgy akarnak játékot készíteni vagy átírni, hogy nem kell programozniuk, és ebben jó. Egyes vásárlóknak ez egyszerűen a megfelelő eszköz.

Mit nyersz

  • Vizuális szerkesztés: elrendezések, objektumok és eseménylapok, amelyeket képernyőn olvasol és módosítasz, nem kódban.
  • Dokumentáció, oktatóanyagok és felhasználói fórum a motor saját oldalán. Ha elakadsz, nyilvános válaszokat kereshetsz, ami egy egyetlen stúdió által eladott sablonnál nem lehetséges.
  • Kiegészítők: a motor oldala felsorolja a mellékelt kiegészítőket, és lehetővé teszi, hogy a projekthez harmadik féltől származó kiegészítőket mentsél, így a funkciók kiegészítőként érkeznek, nem olyan kódként, amelyet neked kell megírni.
  • Amit megtanulsz, azt átviszed: a második játékodban ugyanaz a szerkesztő és ugyanazok az események lesznek.
  • A HTML5-exportálás része az ingyenes kiadásnak, így csomag választása előtt építhetsz és tesztelhetsz.

Mit adsz fel

  • Szükséged van a szerkesztőre, és az ingyenes kiadás korlátozza az események és a rétegek számát.
  • Egyes projektek extra bővítményt igényelnek (az egyik általunk olvasott hirdetés szerint igen).
  • A játékból származó bevétel a motor saját licencétől és csomagjától függ.
  • A projekt egy eszközhöz készült: ott módosítod, nem szövegszerkesztőben.

A sima JavaScript-út: mit nyersz és mit adsz fel

A vanilla JavaScript játéksablon a szerkesztőt szöveges fájlra cseréli. Ha tudsz kódot olvasni, ez jó üzlet, ha nem, rossz.

Mit nyersz

  • Bármely szövegszerkesztő megnyitja a fájlokat, és bármely statikus webtárhely kiszolgálja őket.
  • Szerkesztéshez nincs szükség motor-előfizetésre vagy fiókra.
  • Olvasható, formázott forrás, olyan kézikönyvekkel, amelyek megmutatják, hol vannak a logó, a színek, a szabályok és a szövegek.
  • A változtatások sima szövegként jelennek meg, ami működik a verziókövetéssel.
  • Opcionális automatikus tesztek néhány kiadásban (Node.js 20+). A Velvet Poolban ezek a fizikát, a 8-ball szabályokat, a CPU-meccseket és a fordítási kulcsokat fedik le.

Mit adsz fel

  • Kódot szerkesztesz: egy eltévedt vessző képernyőt törhet el.
  • Nincs vizuális szerkesztő a szintekhez vagy elrendezésekhez. A Ricopop szintjei szöveges térképek, egy ellenőrzővel, amely megmondja, hogy egy szint még megnyerhető-e.
  • Egy sablonhoz nincs nyilvános fórum: a kérdések az eladóhoz mennek, és a támogatásnak vannak korlátai. 6 hónap jár hozzá, vagy 12 a bővítéssel; a testreszabás, az új funkciók, a tárhely és az SDK- vagy portálintegráció külön, árajánlattal kért szolgáltatás.
  • Ami egy kiadásból kimaradt, az kimarad. A Gridspark például nem tartalmaz online ranglistákat, fiókokat, hirdetési SDK-kat vagy natív alkalmazásbolti buildeket.

Minden tétel oldalán olvasd el a „Nem szerepel ebben a kiadásban” listát. A Velvet Pool felsorolja az online többjátékos módot, az online ranglistákat, a hirdetési SDK-kat és a natív alkalmazásokat. A Ricopop felsorolja a natív Android- vagy iOS-buildeket, az online többjátékos módot vagy a szerveren ellenőrzött versenyranglistát, valamint a hirdetési hálózati fiókokat és a játékportál-SDK-integrációkat.

Két sima JavaScript-sablon részletesen: Ricopop és Gridspark

Nyilvános kézikönyveik fájlnévvel válaszolnak arra, hogy „hol kell ezt átírnom?”. A Ricopop jön először, mert a game/ mappája a forrás.

Ricopop: szintek szövegként, építés nélkül

  • Szintek: a src/levels.js tartalmazza az 50 szintet szöveges térképként, par- és megoldásadatokkal, a fájl tetején lévő megjegyzés magyarázza a formátumot.
  • Szabályok és számok: a src/sim/config.js tartalmazza a labdák számát egy sorozatban, a labdasebességet és a pontozási értékeket.
  • Színek és a menü megjelenése: style.css.
  • Logó: kóddal rajzolva a src/ui/logo.js fájlban, nem képként.
  • Szövegek és a 14 nyelv: src/locales.js.
  • Hirdetési és ranglista-beállítások, mindkettő alapértelmezetten kikapcsolva: ricopop.config.js.

A kézikönyv munkafolyamata: szerkesztés, feltöltés, kemény frissítés (hard refresh). Kódszerkesztőt ajánl, például a VS Code-ot vagy a Notepad++-t, és a szövegszerkesztőt nem javasolja. Egy pálya módosítása után a tools/validate.mjs opcionális eszköz ellenőrzi, hogy minden szint még megnyerhető-e, a node tools/validate.mjs --solve 12 parancs pedig megoldást keres a 12. szintre. Az eszközökhöz Node.js 20+ kell.

Ricopop 1. szint: három számozott zöld kristály, egy kis ágyú alul x10 jelöléssel, a pontszám balra, a csillagcélok jobbra
Ricopop, az 50 szint közül az 1. A szintek szöveges térképek a src/levels.js fájlban.

Gridspark: beállítások szövegfájlban, szabályok megnevezett modulokban

  • Felületi szöveg és nyelvek: src/locales.js.
  • Konstansok és paletta: src/config.js. Felületi színek: style.css.
  • Puzzle-szabályok: game.js, board.js, generator.js és shapes.js.
  • Logó, arcok és blokkok: a src/logo.js fájlban rajzolva.
  • Kezdőképernyő és teljes képernyős gomb: gridspark.config.js, egy sima szöveges fájl, amelyhez nincs szükség újraépítésre.

Kódmódosításhoz a kézikönyv a source/ mappában dolgozik, majd npm test és npm run build. Ehhez Node.js 20+ kell, de függőséget nem telepít.

Gridspark játékmenet: 8×8-as tábla mosolygó kék, rózsaszín és narancssárga blokkokkal, két villámblokkal, jobbra három várakozó elem, balra a pontszám
Gridspark: a 8×8-as tábla, a három alakzatból álló kéz, a pontszám és a ZAP-töltés.

A Velvet Pool ugyanezt követi 3D-ben. Logója az assets/logo/ mappában van, a szőnyeg- és ütőstílusok a src/game/progress.js fájlban, a CPU viselkedése a src/core/ai.js fájlban, a fizika pedig a src/core/physics.js fájlban. Opcionális tesztjei (npm test a source/ mappában, Node.js 20+) a fizikát, a 8-ball szabályokat, a CPU-meccseket és a fordítási kulcsokat fedik le, a kézikönyv pedig egyértelműen kimondja, hogy ezek nem helyettesítik a böngészőkben és eszközökön végzett tesztelést.

Nézd meg a Gridsparkot élő előnézettel és kézikönyvvel

Hogyan teszteld mindkét fajtát fizetés előtt

Nem nyithatsz meg olyan projektfájlt, amelyet nem vettél meg, de szinte mindent tesztelhetsz körülötte. Ezeket sorrendben, időzítővel csináld.

Mindkét fajtánál

  1. Játszd le a pontos kiadás demóját azon a telefonon, amelyet a játékosaid használnak. Forgasd el, töltsd újra, válts nyelvet.
  2. Olvasd el a követelményeket és a ki nem terjesztett listát. Írd le, mit kellene még megépítened vagy megvásárolnod.
  3. Keresd meg a licencet, és olvass el három mondatot: hány terméket fed le, engedélyezett-e a hirdetés, és mit nem adhatsz tovább.

Motoros sablonnál

  1. Kérdezd meg, melyik kiadású és verziójú motor nyitja meg a projektet, és kell-e hozzá extra bővítmény.
  2. Kérdezd meg, hány eseményt és réteget használ a projekt, és vesd össze a számokat az ingyenes kiadás korlátaival a motor oldalán.
  3. Nyisd meg önmagában a szerkesztőt, és építs egy egyképernyős tesztet, hogy tudd, szeretsz-e vele dolgozni.
  4. Ha bevételt tervezel a játékból, olvasd el a motor licencét erre vonatkozóan, mielőtt bármit megvennél.

Sima JavaScript sablonnál

  1. Nyisd meg a nyilvános kézikönyvet, és keresd meg, hol vannak a logó, a színek, a szabályok és a szövegek.
  2. Ellenőrizd, mit igényel a szerkesztés: semmit, vagy Node.js-t és npm-et. Minden tétel Követelmények fülén látszik, melyik.
  3. Futtasd a kézikönyv szerint. A Velvet Pool kézikönyve például a game/ mappában a python -m http.server 8765 parancsot javasolja helyi teszthez, majd a http://localhost:8765/ megnyitását.
  4. Nyiss meg a demó egyik szkriptjét a böngésző fejlesztői eszközeiben. Ha követni tudod, szerkeszteni is tudod.

Nálunk a sablonok digitális termékek: csak akkor térítünk vissza egy vásárlást, ha még nem töltötted le a sablont, vagy ha a szolgáltatott sablonban olyan hiba van, amelyet nem tudunk javítani. Ehhez írj nekünk a licencszámoddal. A visszatérített vásárlás megszünteti a licencet. Mivel a letöltés lezárja ezt az ajtót, futtasd le a fenti teszteket vásárlás előtt, mindenképpen pedig letöltés előtt.

Nézd meg a Velvet Poolt: kézikönyv, élő előnézet és a fent említett tesztek

Gyakran ismételt kérdések

Kell játékmotor egy HTML5 játéksablon szerkesztéséhez?

Attól függ, hogyan készült a sablon. A motoros sablon olyan projektet szállít, amely annak a motornak a szerkesztőjében nyílik meg, a Construct projektfájljai pedig .c3p kiterjesztésűek. A sima JavaScript sablon olyan fájlok, amelyeket bármely szövegszerkesztő megnyit. A Polar Games piacterének egyik követelménylistája sem nevez meg játékmotor-szerkesztőt. Több kiadáshoz Node.js, néha npm is kell, csak a TypeScript-forrás újraépítéséhez.

Szerkeszthetek Construct 3 sablont az ingyenes kiadással?

Egy adott projektre nem tudunk válaszolni. Amit a motor oldala 2026. október 24-én mutatott, az az, hogy az ingyenes kiadás HTML5-be exportál, az eseményeket 50-re (vendégként 25-re), a rétegeket 2-re korlátozza, és egy általunk olvasott hirdetés szerint az ingyenes verziónak vannak korlátai. Kérdezd meg az eladótól, hány eseményt és réteget használ a projekt, és hasonlítsd össze.

Nehezebb szerkeszteni a vanilla JavaScript játéksablont, mint a motoros sablont?

Ha nem írsz kódot, igen: nincs vizuális szerkesztő, és egy elírás képernyőt törhet el. Ha írsz, a szín, a szöveg vagy a szint megváltoztatása egy megnevezett fájl szerkesztése, a kézikönyvek pedig megmondják, melyiké. A Ricopop szintjei szöveges térképek, a Gridspark beállításfájlja pedig sima szöveg.

Kell npm vagy építési lépés a sablonjaidhoz?

Van, amelyiknek kell, van, amelyiknek nem. A Ricopopnak, a Velvet Poolnak és a Puttide-nak egyik sem kell. A Gridspark telepítéshez és játékhoz nem igényel építést, a függőségmentes építés (npm test, npm run build, Node.js 20+) csak akkor kell, ha a source/ mappában kódot módosítasz. A TypeScriptben készült kiadásokhoz, például a Trimorához és a Twirldrophoz, Node.js és npm kell az újraépítéshez, bár a tárhelyre feltöltendő game/ mappa már elkészült. Minden tétel Követelmények fülén szerepel.

Használhatom a sablont ügyfélnek, és tehetek rá hirdetést?

A licencünk egy végtermékre vonatkozik, a tiédre vagy egy ügyfél termékére, a játékosok pedig ingyen vagy hirdetésből finanszírozva férhetnek hozzá. A benne lévő kódot, grafikát és hangot átalakíthatod, a sablont vagy a forrását viszont nem adhatod tovább. A játékok hirdetési hálózat nélkül érkeznek, ezért annak csatlakoztatása és jóváhagyatása a te feladatod. Motoros sablonnál a motor licencét is olvasd el, nem csak az eladóét.

Mi van, ha rossz fajtát választok?

Teszteld előbb, a fentiek szerint. Visszatérítés csak akkor lehetséges, ha még nem töltötted le a sablont, vagy ha a szolgáltatott sablonban olyan hiba van, amelyet nem tudunk javítani. Ha később az egyik útról a másikra váltasz, a játékot újra kell építened a másik eszközben, ezért a fizetés előtti egy óra jól megtérül.

Nyiss meg egyet, mielőtt döntesz

A legolcsóbb összehasonlítás egy órába kerül: játszd le a demót, olvasd el a kézikönyvet, nyisd meg a szerkesztőt. Csináld meg egyszer a motoros sablonnal és egyszer a sima JavaScript sablonnal, aztán válaszd azt, amelyiknek a megnyitásától nem riadtál vissza.

Nézd meg a Polar Games piacterét, és nyiss meg egy kézikönyvet