"From Space to Campus in One Epic Descent"
A high-stakes vertical falling game where Starsky the Ram descends from the stars to Earth through 10 increasingly challenging atmospheric stages. Navigate through space debris, weather phenomena, and urban obstacles while threading the needle for near-misses and maximum points.
- 10 Unique Atmospheric Stages - Journey from Low Earth Orbit to the OCU campus
- Stage-Specific Visuals - Parallax backgrounds with dynamic weather and environmental effects
- Risk/Reward Gameplay - Thread the needle between obstacles for bonus points
- Progressive Difficulty - Each stage introduces new obstacles and mechanics
- Story-Driven Campaign - Comic-style narrative panels between stages
- Leaderboard System - Firebase-powered global and per-level rankings
- Interactive Tutorial - Learn the ropes with guided practice mode
- Grading System - Earn S through F ranks based on performance
- Star Collection - Unlock content and track completion across all levels
This game showcases the power and flexibility of PixiJS v8, a modern 2D rendering library that leverages WebGPU for high-performance graphics.
Graphics & Rendering:
- WebGPU Renderer - Hardware-accelerated graphics with fallback to WebGL2
- Render Groups - Optimized batching for UI, game objects, and particle layers
- Sprite System - Efficient texture management and atlas support
- Graphics API - Procedural shapes for obstacles, UI, and effects
- Particle Container - High-performance particle systems (10,000+ particles)
Scene Management:
- Container Hierarchy - Modular scene architecture (Menu, Game, Level Select, etc.)
- Display Object System - Transform inheritance for camera and world positioning
- Masking & Clipping - UI panels and viewport management
Animation & Effects:
- Ticker System - Frame-perfect game loop and animation timing
- Sprite Animations - Character state machines and obstacle behaviors
- Parallax Scrolling - Multi-layer backgrounds with depth perception
- Particle Effects - Speed lines, near-miss sparks, collision impacts
Asset Management:
- Assets API - Lazy loading and bundle management per stage
- Texture Atlas - Optimized sprite sheet packing
- Dynamic Loading - On-demand asset streaming for story panels
Performance Optimizations:
- Object Pooling - Reusable obstacle and particle instances
- Culling - Only render visible objects
- Spatial Partitioning - Efficient collision detection grid
- Resolution Scaling - Device pixel ratio adaptation
- Firebase - Authentication, Firestore database, and leaderboard hosting
- Vite - Lightning-fast build tool and dev server
- ES6+ Modules - Modern JavaScript architecture
- CSS Variables - Theme-aware styling system
This project was built with extensive AI assistance, showcasing how modern AI tools can accelerate game development while maintaining high code quality.
- Architecture Design - Scene management, collision systems, particle effects
- Feature Implementation - Tutorial system, leaderboards, grading mechanics
- Code Refactoring - Performance optimizations and bug fixes
- Documentation - Inline comments and system explanations
- Image Generation - Character sprites, story panels, UI elements
- Concept Art - Level themes and visual style direction
- Prompt Engineering - Iterative refinement of visual assets
- Background Elements - Atmospheric layers and environmental details
- UI Graphics - Icons, buttons, and decorative elements
The game began as an experiment to explore PixiJS v8's new WebGPU capabilities. Initial prototyping focused on smooth scrolling mechanics and collision detection, quickly evolving into a full-featured arcade game.
AI Collaboration Workflow:
- Conceptual Phase - Discussed game mechanics and visual style with Claude, establishing the "Duke Nukem meets mascot platformer" aesthetic
- Technical Foundation - Built scene management, physics engine, and rendering pipeline with AI-assisted architecture
- Visual Development - Generated 100+ story panels and sprites using ChatGPT and Gemini's image generation
- Feature Expansion - Iteratively added tutorials, leaderboards, and polish with AI suggesting optimizations
- Bug Fixing - Rapid debugging sessions with AI identifying edge cases and providing solutions
Key AI Contributions:
- Code Generation Speed - Complex systems like parallax backgrounds implemented in minutes vs. hours
- Best Practices - AI suggested PixiJS v8 patterns like render groups and proper container hierarchies
- Problem Solving - Collision detection refinement, landing zone protection, and combo system logic
- Asset Iteration - Rapid visual prototyping with dozens of variations to find the right style
Human Direction:
- Game design decisions and difficulty balancing
- Story writing and character personality
- Final asset selection and curation
- Gameplay feel and polish tuning
The result is a production-quality game built in a fraction of the traditional development time, demonstrating the synergy between human creativity and AI execution.
one-jump/
├── public/
│ └── assets/ # Images, story panels, sprites
├── src/
│ ├── config/ # Game constants and configuration
│ │ ├── Constants.js
│ │ └── StageThemes.js
│ ├── entities/ # Game objects
│ │ ├── Player.js
│ │ └── Obstacle.js
│ ├── managers/ # System managers
│ │ ├── LevelManager.js
│ │ ├── FirebaseManager.js
│ │ ├── LeaderboardManager.js
│ │ ├── AssetManager.js
│ │ └── SaveManager.js
│ ├── scenes/ # Game scenes
│ │ ├── MenuScene.js
│ │ ├── GameScene.js
│ │ ├── LevelSelectScene.js
│ │ ├── StoryScene.js
│ │ ├── LeaderboardScene.js
│ │ └── TutorialScene.js
│ ├── systems/ # Game systems
│ │ ├── CollisionSystem.js
│ │ ├── ObstacleManager.js
│ │ ├── BackgroundManager.js
│ │ ├── ParticleSystem.js
│ │ └── InputManager.js
│ ├── ui/ # UI components
│ │ ├── HUD.js
│ │ ├── Button.js
│ │ └── ResultScreen.js
│ ├── Game.js # Main game class
│ └── main.js # Entry point
├── docs/
│ └── devDocs/
│ └── gdd.md # Game Design Document
└── package.json
Scene Management:
- Modular scene architecture with BaseScene inheritance
- Smooth transitions with fade effects
- Asynchronous asset loading per scene
Physics Engine:
- Custom gravity and velocity system
- Collision detection with spatial grid optimization
- Near-miss detection with distance thresholds
Scoring System:
- Base points for completion
- Near-miss bonuses (50-300 points based on proximity)
- Combo multipliers (up to 10x)
- Time bonuses and grade calculation
Stage Progression:
- 10 unique atmospheric environments
- Dynamic obstacle generation based on level config
- Progressive difficulty with new obstacle types
Shift+U- Unlock all levels (Level Select)Shift+D- Toggle debug overlay (Game)- Firebase emulator support for local development
- Lead Developer - Bobby Reed
- AI Development Assistant - Claude 3.5 Sonnet (Anthropic)
- Game Engine - PixiJS v8
- AI Image Generation - ChatGPT-4, Google Gemini 2.5 Flash
- Character Design - Starsky the Ram, OCU Mascot
- Visual Style - 80s/90s arcade inspired
- Oklahoma City University for mascot inspiration
- PixiJS community for documentation and examples
- Firebase for backend infrastructure
Made with ❤️ using PixiJS v8 and AI assistance