Are you prepared? Get your VR controllers and jump https://aframe.io/a-blast!

Make sure you have a WebVR-enabled browser. Firefox is ready in Nightly branch. In Chromium, enable the flags for chrome://flags/#enable-webvr and chrome://flags/#enable-gamepad-extensions.

Wave shooters are probably the most popular genre in the first crop of VR games. From the point of view of the implementation, they are also the easiest to make: you don’t have to move the player around (so you don’t need to implement any locomotion feature) and this simplifies the stage since there is only one fixed point of view. Also, the interaction with the enemies is easy too: just shoot and detect bullet collisions. As simple as wave shooters are, they are quite fun to play and some of them really make you feel the anxiety of the player character (eg: Raw Data).

With A-Blast we wanted to create one game focusing on adding smooth playability, quality assets, and a real example of the capabilities of A-Frame and browser performance. We also wanted to dogfood our own tools (A-Frame and Firefox with WebVR).

During testing we found many problems with performance, so we needed to optimize several parts of the initial implementation and some features were added to A-Frame to help with this task (like the pool component ). We’ll share these details in a future post.

The gameplay is straightforward: just grab your weapons, aim to the characters floating around, and pull the trigger. You can also dodge and shoot enemy bullets in order to keep your 5 lives intact. The more characters you blast, the more points you get, and then enter the (local) Hall of Fame.

We wanted to keep the gameplay time under 5 minutes to have a good turnover in demo stations at fairs and conventions. For a full game, we would have designed more elaborate levels. (Yep, we know is too short, but please keep in mind that this is a technical demo, not a whole game with hours of content).

The game is designed for the HTC Vive but it can also be played with mouse and keyboard or in your smartphone by tapping the screen to shoot.

Using our A-Frame JavaScript VR framework, A-Blast was created by two programmers and one artist in two months. A-Blast debuted to dozens of Mozillians in December 2016 at the Mozilla All-Hands event in Hawaii.

A-Blast also served as a tour de force of A-Frame, testing it with a relatively complex application (the source code is slightly bigger than A-Painter's), helping to stress test and then improve A-Frame.

If you have ideas for improvement, like adding a global leaderboard or support for other controllers and devices, head to the A-Blast GitHub repository and send a pull request.

Many thanks to José Manuel Pérez Paredes (JosSs) for providing the soundtrack, which really improves the experience!