Boxgun - a simple projectile game

Hi everyone!

This is Boxgun, my first game with BabylonJs!
It’s a projectile game. You have 10 seconds to drag and shake the crystal you see on-screen to charge the box cannon, with which you try to fire a box as far as you can! The game stops when it detects your box is done moving.

(in menu)
Z or Enter: ‘OK’ in menu
up, down: move up and down the current menu.
(in game)
Spacebar: fire
P: pause, unpause
…or you can just use your fingers or a mouse

Known issues / TODO:
This game isn’t really designed for mobile landscape mode, and my research tells me there isn’t a cleancut way to fix that atm.
I should prolly add a pause button for mobile
I should prolly add keyboard control hints somewhere.
Sometimes the doesn’t resize with the right proportions.
Sometimes the box will actually fall through the ground, it usually requires a very high charge to make the box go fast.

^that said, I consider this project more like a technical demo of sorts? It does some things different from what I’ve seen in other BJS projects.
All the UI you see including the shake-crystal is actually HTML5 DOM layered on top of the element which only draws the 3D parts. I came up with this actually as I was playing an old Paper Mario game and realized, “hey, you could technically remake this in HTML5 putting the 3D in the back and layering the UI in the front,” so I did. Oh, and this project uses service workers to cache the game assets.

I was originally working on something more grand in scale (I had questions in html5gamedevs for it) and thought I should first try making something smaller and practice deploying and showcasing something first, so here I am! :slight_smile: Enjoy!


Yeah! love it!

Do you want to add a reference to it for our homepage on ?
Website/config.json at master · BabylonJS/Website · GitHub

1 Like


Sure feel free to link it! I’m glad that you consider it cool enough to post on your site!

                    "desc": "Boxgun",
                    "author": "by vtange",
                    "link": "",

feel free to download the above image for the img {} settings

Please do a Pull request to change the file directly :slight_smile: