Stack City - Build Your Dream City

Seele01-Flash
By
Stack City is an innovative merge game that lets you design and build your own dream city by stacking scaffoldings, stores, and buildings. Earn money from your constructions to expand into new territories and create even grander structures.

Prompt

MODEL: Seele01-Flash
Please use Three.js to generate a **mobile-first game** with the theme "**Stack City**". Please read the following detailed game design requirements first, and then generate the code accordingly: ### 1. Assets & Environment * **Visual Style:** Create a vibrant, low-poly aesthetic similar to "Poki" web games. Use bright, saturated colors. The world should feel like a "floating island" set against a dynamic skybox (gradient blue with rotating white "sun rays" to simulate a cheerful atmosphere). * **Models (Procedural/Primitive fallback):** * **Base Grid:** A clean 5x5 grid plane floating in the center. Some tiles must be color-coded (e.g., red, blue) to indicate building restrictions. * **Units:** Instead of complex external models, use composed `THREE.Group` primitives to represent tiers: * *Tier 1 (Scaffolding):* Simple wireframe box or semi-transparent grey cube. * *Tier 2 (Shop):* A solid cube with a flat color (e.g., red) and a simple "awning" geometry. * *Tier 3 (Apartment):* Taller rectangular prism with window textures or emission materials (like the screenshot). * **Money:** Floating green bill sprites or simple billboard planes that spawn above buildings. * **Performance:** strict mobile optimization. Use `THREE.InstancedMesh` if many identical building blocks appear. Limit real-time shadows; use baked ambient occlusion or simple blob shadows under buildings. Texture resolution max 512x512. ### 2. Audio Requirements * **BGM:** A relaxing, lo-fi "bossa nova" or light acoustic guitar loop that plays in the background. It should be non-intrusive and suggest productivity. * **Sound Effects (SFX):** * *Spawn:* A "whoosh" sound when buying new scaffolding. * *Drag:* A subtle "click" or suction sound when lifting a piece. * *Merge:* A satisfying, high-pitched "Pop" or "Ding" sound (critical for player satisfaction). * *Money Collection:* A "Ka-ching" or coin jingle. * *Error:* A low-pitched "thud" or buzzer if trying to place a building on the wrong color tile. ### 3. Gameplay Loop * **Core Mechanic (Merge & Stack):** * The player starts with an empty grid. * **Action:** Player clicks a "Buy" button to spawn a Level 1 "Scaffolding" on a free tile. * **Merge:** Dragging a Level X building onto another Level X building merges them into a Level X+1 building (Scaffolding -> Shop -> Apartment -> Skyscraper). * **Constraint:** Specific grid tiles are colored (e.g., Red Tile). Only buildings that match that color family or neutral scaffoldings can be placed there. * **Economy (Idle Tycoon):** * Every building generates $X per second based on its level. * Money accumulates automatically or spawns floating bills to be tapped. * Cost of new scaffolding increases exponentially with each purchase. * **Progression:** Unlocking adjacent grid tiles (expanding the island) using earned money. ### 4. Mobile Controls & Interaction * **Touch Controls (Raycaster):** * Implement robust `touchstart`, `touchmove`, and `touchend` event listeners. * **Drag & Drop:** When a user touches a building, it should lift slightly (Y-axis offset) and scale up (1.1x) to show selection. It must follow the finger/cursor precisely. * **Snap-to-Grid:** When dragging, show a "ghost" outline on the grid tile closest to the finger to indicate where it will land. * **Camera:** Isometric view (OrthographicCamera preferred for grid precision). Allow simple pinch-to-zoom and limited panning, but lock rotation to maintain the fixed perspective. * **UI Layout:** * **Top Center:** Total Money display (large, bold font). * **Bottom Center:** A large, circular floating action button (FAB) for "Buy Scaffolding". * **Bottom Right:** A smaller button for "Map/Expand". * **Touch Areas:** Ensure all UI buttons have a hit area of at least 44x44 pixels. * **Feedback:** * **Haptic:** Trigger `navigator.vibrate(50)` on a successful merge. * **Visual:** Use Tweening (e.g., GSAP or TWEEN.js) for "bouncy" spawn animations and a particle explosion effect upon merging. Do not ask for clarification. Do not request confirmation. Directly execute the generation task based on the given instructions.

Game Introduction

About Stack City

Stack City is a captivating merge and construction game that combines city building with strategic stacking mechanics. In this colorful 3D world, you have complete freedom to design your ideal urban landscape by merging scaffoldings and buildings to create towering structures. The game features intuitive drag-and-drop gameplay where every building you construct generates passive income, allowing you to expand your empire and explore new territories.

Core Features

Creative City Building

Unleash your architectural creativity with complete design freedom. Stack City offers unlimited possibilities for creating unique cityscapes, from cozy neighborhoods to towering metropolitan areas.

Strategic Merge Mechanics

The game combines traditional city building with innovative merge gameplay. Combine similar structures to create more advanced buildings, each with enhanced earning potential and visual appeal.

Passive Income System

Every building you construct becomes a money-generating asset. Watch your city come alive as each structure contributes to your growing wealth, enabling continuous expansion and development.

Color-Coded Building System

Master the strategic element of color-matching! Certain grid squares are color-coded, requiring you to place matching colored buildings. This adds a puzzle-like challenge to your city planning.

Progressive Expansion

Start small and grow big! Use your earnings to unlock new lands and purchase additional scaffoldings, constantly expanding your urban empire across diverse terrains.

3D Visual Experience

Enjoy stunning 3D graphics that bring your city to life. Watch your buildings stack skyward with smooth animations and vibrant colors that make each construction feel rewarding.

Gameplay Mechanics

Building Process

The core gameplay revolves around strategic placement and stacking. Drag scaffoldings from your inventory and drop them onto the building grid. Stack identical or compatible pieces to create taller, more valuable structures.

Resource Management

Balance your spending between purchasing new scaffoldings and unlocking additional building plots. Smart resource allocation is key to maximizing your city's growth potential.

Territory Expansion

As your income grows, invest in new territories to expand your building options. Each new area offers unique challenges and opportunities for creative city design.

How to Play

Basic Controls

  • Mouse : Drag and drop scaffoldings onto the building grid
  • Left Click : Select and place building components
  • Scroll : Navigate around your expanding city

Getting Started

  1. Begin with basic scaffoldings and place them on available grid squares
  2. Stack compatible pieces to create taller buildings
  3. Pay attention to color-coded squares - only matching colors can be placed
  4. Collect income generated by your buildings
  5. Use earnings to buy more scaffoldings and unlock new territories
  6. Continue expanding and designing your dream city

Pro Tips

  • Plan your layout carefully - taller buildings generate more income
  • Match colors strategically to maximize building potential
  • Balance between immediate building needs and long-term expansion
  • Experiment with different architectural styles across territories

Why Play Stack City

Relaxing Gameplay

Stack City offers a peaceful, meditative gaming experience perfect for unwinding. The cozy atmosphere and satisfying building mechanics provide stress-free entertainment.

Creative Freedom

Express your architectural vision without restrictions. Every city you build is unique, reflecting your personal style and strategic decisions.

Progressive Satisfaction

Experience continuous growth and achievement as your city expands. The combination of immediate building satisfaction and long-term progression keeps gameplay engaging.

Cross-Platform Accessibility

Enjoy the same high-quality experience whether you're playing on desktop, tablet, or smartphone. The game adapts seamlessly to any screen size.

Free-to-Play Experience

Access all core gameplay features completely free. Build your empire without any upfront costs or mandatory purchases.

Stack City successfully merges the satisfaction of construction games with the strategic depth of merge mechanics, creating an addictive and rewarding experience for players of all ages.

Frequently Asked Questions (FAQ)