# 🗺️ KICKSTARTER DEMO MAP - "MICRO FARM 8x8" **Map Name:** `demo_micro_farm.tmx` **Size:** 8×8 tiles (64 tiles total) **Tile Size:** 64×64 pixels **Total Map Size:** 512×512 pixels **Style:** Dual (can switch Style A ↔ Style B) --- ## 📐 LAYOUT DESIGN ``` 0 1 2 3 4 5 6 7 ┌──┬──┬──┬──┬──┬──┬──┬──┐ 0 │🌳│🌱│🌱│🌱│🪨│🌱│🌱│🌱│ ├──┼──┼──┼──┼──┼──┼──┼──┤ 1 │🌱│🟫│🟫│🟫│🌱│🌱│⛺│🌱│ ├──┼──┼──┼──┼──┼──┼──┼──┤ 2 │🌱│🟫│🌾│🌾│🌱│🌱│🌱│🌱│ ├──┼──┼──┼──┼──┼──┼──┼──┤ 3 │🌱│🟫│🌾│🌾│🌱│🌱│🌱│🌱│ ├──┼──┼──┼──┼──┼──┼──┼──┤ 4 │🌱│🌱│🌱│🌱│🧟│🌱│🌱│🌱│ ├──┼──┼──┼──┼──┼──┼──┼──┤ 5 │🌱│🌱│👤│🌱│🌱│🌱│🔥│🌱│ ├──┼──┼──┼──┼──┼──┼──┼──┤ 6 │🌱│🌱│🌱│🌱│🌱│🌱│🌱│🌱│ ├──┼──┼──┼──┼──┼──┼──┼──┤ 7 │🌱│🌱│🌱│🌱│🌱│🌱│🌱│🌱│ └──┴──┴──┴──┴──┴──┴──┴──┘ ``` **Legend:** - 🌱 = Grass terrain tile - 🟫 = Tilled soil (dry/watered) - 🌾 = Wheat crops (various growth stages) - 👤 = Kai spawn point (2,5) - 🧟 = Zombie worker spawn (4,4) - ⛺ = Tent (player base) (6,1) - 🔥 = Campfire (6,5) - 🌳 = Dead tree decoration (0,0) - 🪨 = Rock decoration (0,4) --- ## 🎯 GAMEPLAY FLOW (Demo Script) ### **Act 1: TUTORIAL (30 seconds)** 1. **Kai spawns** at (2,5) - center left 2. **Text appears:** "Use WASD to move" 3. **Kai walks around** - shows 4-directional idle + walk animations 4. **Camera follows** Kai smoothly ### **Act 2: FARMING (60 seconds)** 5. **Text:** "Press E near tilled soil to plant wheat" 6. **Kai walks to** (1,2) - tilled soil patch 7. **Kai uses hoe** - hoe action animation plays 8. **Plant seeds** - wheat_stage0 appears 9. **Text:** "Press W to water crops" 10. **Kai waters** - watering animation + water effect 11. **Wheat grows!** - stage0 → stage1 → stage2 → stage3 → stage4 (timelapse 10 seconds) 12. **Text:** "Press H to harvest" 13. **Kai harvests** - wheat disappears, inventory +1 wheat bundle 14. **UI shows:** Inventory slot with wheat bundle icon ### **Act 3: WORLD ALIVE (30 seconds)** 15. **Camera pans to** zombie at (4,4) 16. **Zombie idle** animation loops 17. **Text:** "Workers till the fields while you're away..." 18. **Zombie starts digging** - dig animation 19. **Camera pans back** to Kai 20. **Style switch!** - A→B or B→A (show dual art system) 21. **Campfire flickers** in background 22. **Fade to black** ### **Act 4: TEASER (15 seconds)** 23. **Text overlay:** "This is just the beginning..." 24. **Text:** "Explore 18 biomes" 25. **Text:** "Meet 50+ NPCs" 26. **Text:** "Solve Ana's mystery" 27. **Logo:** DOLINASMRTI 28. **Text:** "Coming 2025 - Support us on Kickstarter!" **Total Demo Length:** ~2.5 minutes --- ## 🎨 TILED PROJECT SETUP ### **Tilesets to Create:** **1. Terrain Tileset** (`terrain_demo.tsx`) - grass_tile_styleA.png - grass_tile_styleB.png - dirt_tile_styleA.png - dirt_tile_styleB.png - tilled_dry_styleA.png - tilled_dry_styleB.png - tilled_watered_styleA.png - tilled_watered_styleB.png **2. Crops Tileset** (`crops_demo.tsx`) - wheat_stage0_styleA.png → wheat_stage4_styleA.png - wheat_stage0_styleB.png → wheat_stage4_styleB.png **3. Buildings Tileset** (`buildings_demo.tsx`) - tent_styleA.png - tent_styleB.png **4. Environment Tileset** (`environment_demo.tsx`) - dead_tree_styleA.png - dead_tree_styleB.png - rock_styleA.png - rock_styleB.png - campfire_styleA.png - campfire_styleB.png **5. Characters Tileset** (`characters_demo.tsx`) - All Kai frames (idle north/south/east/west, walk south, actions) - Zombie idle + dig frames --- ## 🔧 TILED LAYERS STRUCTURE ### **Layer Order (bottom to top):** 1. **Base Terrain** (Tile Layer) - Grass tiles fill - Dirt patches 2. **Tilled Soil** (Tile Layer) - Farmable areas - Can swap dry/watered 3. **Crops** (Tile Layer) - Wheat growth stages - Dynamic (changes during gameplay) 4. **Buildings** (Object Layer) - Tent (collision object) - Campfire (decoration) 5. **Decorations** (Object Layer) - Tree, rocks - No collision 6. **NPCs** (Object Layer) - Zombie spawn point - Custom properties: `type: "zombie_worker"` 7. **Player Spawn** (Object Layer) - Kai start position (2,5) - Custom properties: `type: "player_spawn"` 8. **Collision** (Object Layer) - Invisible collision boxes - Tent, tree, rocks --- ## 📝 CUSTOM PROPERTIES ### **Map Properties:** - `style` (string): "A" or "B" - current art style - `can_switch_style` (bool): true - `demo_version` (string): "1.0" ### **Object Properties:** **Kai Spawn:** - `name`: "kai_spawn" - `type`: "player" - `facing`: "south" **Zombie Spawn:** - `name`: "zombie_1" - `type`: "zombie_worker" - `ai`: "idle_dig_loop" **Tent:** - `name`: "tent" - `type`: "building" - `collision`: true - `interactable`: false **Tilled Soil Tiles:** - `farmable`: true - `watered`: false (default) --- ## 🎮 PHASER.JS INTEGRATION NOTES ### **Loading Map:** ```javascript this.load.tilemapTiledJSON('demo_map', 'maps/demo_micro_farm.json'); ``` ### **Creating Layers:** ```javascript const map = this.make.tilemap({ key: 'demo_map' }); const terrainTileset = map.addTilesetImage('terrain_demo', 'terrain_tiles'); const baseTerrain = map.createLayer('Base Terrain', terrainTileset, 0, 0); ``` ### **Spawning Player:** ```javascript const spawnPoint = map.findObject('Player Spawn', obj => obj.name === 'kai_spawn'); player = this.physics.add.sprite(spawnPoint.x, spawnPoint.y, 'kai_idle_south_1_A'); ``` --- ## 📊 ESTIMATED TIME TO BUILD **Tiled Editor Work:** - Create tilesets: 30 min - Place tiles: 20 min - Add objects: 15 min - Set properties: 10 min - Test export: 5 min **Total:** ~80 minutes (1.5 hours) --- ## ✅ NEXT STEPS 1. ⏳ Wait for background removal to finish (~5 more min) 2. ✅ Open Tiled Editor (already installed?) 3. ✅ Create new map: 8×8, tile size 64×64 4. ✅ Add tilesets (link PNG files) 5. ✅ Paint terrain layer 6. ✅ Place objects 7. ✅ Export as JSON 8. ✅ Test in Phaser.js **Map ready for integration in ~2 hours!** 🎯