Tiled map editor segítségével:

1. térkép létrehozása
2. tileset betöltése
3. tile layer-ek létrehozása: Egyszerű képi információkat tartalmaznak.
4. object layer-ek létrehozása: A felhasználó számára közvetlenül nem látható objektumokat tartalmaznak, melyeknek saját tulajdonságai lehetnek. Az objektumokat a játékprogram fogja feldolgozni (pl. spawner-ek, portálok, effektek, savepoint-ok létrehozása céljából).
5. térkép exportálása
   1. az exportált .tmx fájlt később lehet szerkeszteni Tiled-ban
   2. az exportált .json fájlt a Phaser közvetlenül be tudja tölteni

1. asset-ek betöltése
2. tilemap létrehozása
3. tileset betöltése
4. layer-ek létrehozása, ütközések beállítása
5. térkép metaadatok kinyerése (spawner objektumok)
6. játékos követése a kamerával

Hozzunk létre egy új fájlt a js/classes mappában, spawner.js néven, a következő tartalommal:

class Spawner {
    constructor(config, clock, spawnLocations, addObject, deleteObject) {
        this.id = config.id;
        this.spawnInterval = config.spawnInterval;
        this.limit = config.limit;
        this.objectType = config.objectType;
        this.clock = clock;
        this.spawnLocations = spawnLocations;
        this.addObject = addObject;
        this.deleteObject = deleteObject;

        this.objectsCreated = [];

        this.objectId = 1;
    }
}

Ez az osztály fogja szabályozni a spawner-ek működését. Az osztály konstruktora a következő adatokat fogadja:

• config objektum:
  • id: a spawner azonosítója,
  • spawnInterval: objektum spawn-olás időköze,
  • limit: aktív objektumok maximális száma,
  • objectType: objektum típusa (MONSTER vagy CHEST)
• clock: a megfelelő scene-hez tartozó Clock objektum (this.time)
• spawnLocations: az objektumok lehetséges pozíciói,
• addObject, deleteObject: callback függvények, melyeket valamely objektum hozzáadása, illetve törlése esetén fog meghívni a Spawner osztály.

Az objectsCreated tömb a spawner által létrehozott aktív objektumokat tartalmazza, az objectId pedig az első létrehozandó objektum egyedi azonosítóját.

Az osztályon belül hozzunk létre egy start metódust, mely az objektumok spawn-olását fogja időzíteni:

start() {
        this.interval = this.clock.addEvent({
            delay: this.spawnInterval,
            loop: true,
            callback: () => {
                if (this.objectsCreated.length < this.limit) {
                    this.spawnObject();
                }
            }
        });
    }

A konstruktorban, az adattagok inicializálását követően hívjuk is meg ezt a metódust: this.start();

• health bar létrehozása a játékosnak és az ellenségeknek,
• health érték meghatározott időközönkénti töltése,
• ellenségek mozgatása véletlenszerű irányba,
• object pooling alkalmazása a ládákra/szörnyekre,
• achievement rendszer létrehozása,
• új itemek bevezetése (pl. pajzs, páncélzat, stb.),
• inventory rendszer létrehozása,
• kereskedés az itemekkel.