Above Par-adowski: WebXR Mini-Golf in 40 Hours or Less

Could one of the holes be in VR?

You can make anything you want.

We will give you no notes.

It’s in like, two weeks.

The Super Soaker is a great (mostly) non-violent alternative shooting mechanic.
A preview panel to the right will hot-reload whenever changes are made in the code editor on the left.
Our design team’s posterized take on the game loop — er, rules — of mini golf.
We’re able to derive static physics meshes from whatever 3D course model mesh is passed in.
How many tries did it take me to hit this shot?

“When this project was hinted at in one of our team’s stand-up meetings, I started thinking about how fun the space could be and all of the cool things we could add to it. Stylized art is my forte, and once I found out that there were practically no limitations on what the design could be, I knew this was my chance to play to my strength! We have a profound fondness towards animals at our agency, so a wildlife sanctuary-like space made perfect sense as a setting. Having done plenty of research and tests towards creating heavily optimized assets for different prior client projects, the process of creating this small forest like space with a lot of animated elements was much quicker than I anticipated. With a combined file size of just under 4mb, I’m personally really happy with how all of the assets used in the game turned out while utilizing very little video memory.” — AJ Johri, 3D Technical Artist

AJ’s art through the lens of A-Frame’s “inspector mode,” which offers another Unity-like way to view and manipulate your scene and its components. The noble capybara was added in tribute to AJ’s great work.

“One of the biggest challenges when rapidly prototyping any physics-based interactive experience is solving for edge cases caused either by unexpected interactions or instability within the physics system. With a catch-all already in place for the former problem, the only thing left to do was tune the physics to work as well as possible, as often as possible.

“Unfortunately, because this experience runs in a browser and at somewhat limited framerates, this wasn’t easy. For starters, I increased the collision margins on everything in order to prevent ‘quantum tunneling’ (basically, physics objects phasing through each other). We increased the physical size of the course boundaries as well to alleviate the ball clipping through the walls. Finally, I also enabled CCD — continuous collision detection, which trades a little bit of performance for collision detection between frames.

“But collisions weren’t the only problems that sprang up. Perhaps the trickiest one to solve was simply to get the ball to stop rolling. While simply turning up the drag and the friction seems like the one-stop solution, the physics library we ended up using failed to slow the ball further when friction and drag values were low (I assume due to some floating-point rounding error). Instead, I added a supplementary check on the ball every tick to see if it had fallen below a certain speed, and then after that, gradually reduced its velocity each tick until it came to a stop.” — Ethan Michalicek, Immersive Tech Lead

We cleared space, set up the Guardian fence, and used a Chromecast to stream the VR user’s point of view to a projector for the whole crowd to see.
We opted for a single-controller input style, which let me demonstrate proper controller use with the off-hand. In a production setting, much of this instruction would be automated and tutorialized within the game itself.
In this game, you can pet the capybara.



Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store