Mario-Style Platformer Game

A complete retro platformer game built with HTML5, CSS3, and JavaScript.

Features

• Player Character: Red Mario-like character with smooth movement and animations
• Environment: Retro pixel-art ground, platforms, pipes, and background elements
• Collectibles: Animated coins with sparkle effects and collection sounds
• Enemies: Two enemy types (Goomba and Koopa) that patrol and can be defeated by jumping
• Physics: Natural gravity, jumping, and collision detection
• UI/HUD: Retro-styled score, coin count, and lives display
• Visual Effects: Particle effects for jumping, landing, and collecting items
• Win/Lose Conditions: Complete level by reaching the flag, lose lives by touching enemies

Controls

• Arrow Keys: Move left/right
• Spacebar: Jump
• Goal: Reach the flag at the end of the level

How to Play

1. Open index.html in a web browser
2. Use arrow keys to move and spacebar to jump
3. Collect coins for points
4. Jump on enemies to defeat them
5. Avoid touching enemies from the side
6. Reach the flag to win!

File Structure

mario-game/
├── index.html          # Main game file
├── css/
│   └── style.css      # Game styling
├── js/
│   └── game.js        # Game logic
├── sprites/           # Character sprites (placeholder)
├── tilesets/          # Environment tiles (placeholder)
└── sounds/            # Sound effects (placeholder)

Technical Details

• Pure HTML5 Canvas rendering
• 60 FPS game loop with requestAnimationFrame
• Smooth camera following
• Collision detection system
• Particle effect system
• Responsive retro UI design

Browser Compatibility

Works in all modern browsers that support HTML5 Canvas and ES6 JavaScript.