Interactive browser game
Endless Surfer
A hand-drawn endless surfing mini-game built directly into my portfolio, featuring canvas-based movement, world-space waves, shark hazards, scoring, local high scores, and escalating difficulty.
Overview
What I built
Endless Surfer is a small arcade-style browser game where the player stays centered while the ocean moves around them. The surfer can be controlled with WASD, arrow keys, or drag input.
Gameplay loop
Shark fins spawn from off-screen and semi-target the player with variation. When a shark gets close, it enters a warning state, then transitions into a chomp and splash animation if the player does not escape.
Technical focus
The game is rendered with an HTML canvas inside a Next.js client component. Movement uses velocity, acceleration, friction, and max speed values to create a smooth surfing feel. Sharks, waves, scoring, and player movement run inside a requestAnimationFrame loop.
Key features
- Canvas-rendered endless surfer game
- Keyboard and pointer/drag controls
- World-space waves that move around a centered player
- Hand-drawn surfer, wave, shark fin, chomp, and splash assets
- Shark warning, chomp, splash, and game-over state machine
- Continuously scaling difficulty
- Local high score saved in the browser
- Integrated as an interactive portfolio easter egg
Why I added it
I wanted the portfolio to feel more personal and interactive than a standard static project site. Instead of only describing my work, this project gives visitors something small they can actually play. It also shows how I think through polish, game feel, interaction design, and iterative tuning.