Making a whole browser game in one HTML file: procedural art and Web Audio music
How Danphe Dash, a game I built with AI, draws four Nepali landscapes in code, synthesizes folk-inspired music with the Web Audio API and holds 60 fps on phones.
GameBuilt with AI
Danphe Dash - Nepali Arcade Flyer
An arcade flyer built with AI, starring the Danphe in a Dhaka topi: four Nepali biomes drawn in code, synthesized folk music and a daily challenge, all in one HTML file.
Built with AI
HTML5 Canvas
Web Audio API
Procedural Art
PWA
Game Design
Nepal
Unity Port
Project Overview
Danphe Dash (डाँफे उडान) is a Nepali-themed arcade flyer starring the Danphe, Nepal's national bird, in a Dhaka topi. You flap through four biomes (the Terai, the hills, the Himalaya and a Tihar festival night), grabbing boons, dodging omens and chasing a date-seeded daily challenge.
I built it with AI, out of boredom, and I want that to be clear up front. Read this page as a breakdown of how the finished game works, not a claim that I wrote every line by hand.
The whole game is one HTML file. Every visual is drawn procedurally on canvas, and all music and sound effects are synthesized live with the Web Audio API to evoke madal, bansuri and sarangi. It installs as an offline PWA and is playable now in the browser.
I also prepared a Unity 6 port kit from the prototype: 2× sprites exported from the game's own render code, seamless audio loops, per-theme metadata and ten C# starter scripts, with a roadmap for Android and iOS.
4
Nepali Biomes
100%
Art & Audio Made in Code
8
Boons & Omens
1
HTML File
Key Features
Core functionality and capabilities that make this project stand out
Four Nepali Biomes
Terai plains with sal forest and rhino, hills with pagodas and prayer flags, Himalayan peaks with a painted-eye stupa, and a Tihar night lit with diyas and rangoli.
Procedural Art
Every visual, from the Danphe in its Dhaka topi to the obstacle crowns, is drawn from shapes on canvas and pre-rendered to offscreen layers for smooth parallax.
Synthesized Folk Soundtrack
Music and sound effects are synthesized live with the Web Audio API, evoking madal, bansuri and sarangi through a lookahead sequencer playing original pentatonic phrases.
Boons & Omens
Grab boons (shield, tiny, slow-mo, magnet) for power. Omens (wind, heavy, rush, fog) only hit when you choose to touch one, so the game is never unfair by default.
Daily Challenge & Progression
A date-seeded daily run that is identical for every player, plus coins, medals and unlockable bird skins.
Installable & Accessible
An offline-ready PWA with a bilingual English and Nepali interface, haptics, and an option to reduce flashing and motion.
Technology Stack
Key Technologies I Used on This Project
How It Was Built
AI-Assisted Development
Game
JavaScriptHTML5 Canvas 2DOffscreen Canvas Caching
Audio
Web Audio APILookahead Sequencer
Platform
PWA (Service Worker)Vercel
Native Port Kit
Unity 6 (2D URP)C#2× Sprite ExportSeamless WAV Loops
Challenges Overcome
• Drawing four detailed, seamlessly wrapping parallax worlds entirely in code while holding 60 fps on phones.
• Approximating Nepali folk instruments with raw oscillators and keeping the music in time with a lookahead scheduler.
• Designing rage-game mechanics that stay fair: punishing effects only fire when the player opts in.
• Rendering Devanagari correctly, and planning the Unity port around TextMeshPro's lack of complex-script shaping.
Key Learnings
• Offscreen canvas caching turns heavy procedural art into cheap per-frame draws.
• The Web Audio API can carry a whole soundtrack with zero audio files.
• A single-file prototype makes an exact spec for a native port: every constant, hitbox and layer speed carries straight over.
Writing about this project
Deeper dives into how parts of it were built.
Interested in This Project?
This project showcases practical development skills and problem-solving experience. Explore the features, review the implementation, or get in touch to discuss similar work.