Project Overview: Development of a fast-paced, web-based 2D action-platformer prototype featuring jetpack mechanics. The core technical challenge revolved around a unique game economy loop: collected coins simultaneously serve as the player’s health currency (a Sonic-style damage-drop mechanic) and as consumable resources for purchasing ammunition and jetpack fuel. This architecture demanded strict, real-time resource-state synchronization.
Key Technical Solutions & Engineering Achievements:
React & Phaser Architecture Integration: Architected a decoupled system where the Phaser game loop seamlessly communicates with a React-based UI layer via MobX. This approach allowed the HUD and menus to be rendered as clean, high-performance web components outside the main canvas.
Complex Resource State Management: Engineered a centralized MobX data store to orchestrate the “coin-as-health/currency” logic, ensuring atomic state updates and instant synchronization between the physics world and the UI.
Game AI & Physics Engineering: Programmed Finite State Machines (FSM) to handle enemy behavior algorithms and fine-tuned Arcade Physics constraints to deliver responsive jetpack propulsion and realistic coin scatter trajectories upon player impact.
Level Design Ingestion Pipeline: Integrated tilemaps generated via Tiled, optimizing viewport rendering, parallax layers, and collision-matrix binding within the browser enviornment.
Outcome: A fully playable, highly optimized web game prototype. The project highlights my tech-agnostic versatility and ability to rapidly adopt, architect, and deploy solution-driven workflows using React and MobX to bridge the gap between heavy gaming logic and modern web interfaces.
