It’s estimated that by 2020 there will be 1 million unfilled computer science jobs than qualified applicants. This inspired me to build a prototype game about coding that teaches computer science fundamentals in virtual reality and in 3D through the browser. I hope this project will help to inspire, attract and empower the next generation of computer programmers.

What it does

Virtual Coder is an interactive puzzle game that teaches programming principles and introduces JavaScript using a block-based programming approach. It is designed for children and/or adults who don’t have any experience with coding. It’s aim is to make them ready to learn conventional text-based computer programming languages. In this game users will use their problem-solving skills to get the robot to the goal while learning the basics of programming. Currently the game has eleven levels, each level gets a bit more challenging and introduces the player to programing concepts such as functions, loops and conditionals.

How I built it

Since the idea was to create an application that will teach programming in VR and 3D, I had to figure out how to make the app usable in both case. The first approach involved creating a text IDE within the scene that would allow users to type the code, but that idea would not workout because VR users will not be able to access the keyboard that easily. So I had to think of another way to allow users to code within the scene. While doing some research I came across a block-based programing library called Blockly, this library is used for creating visual block programming languages and editors, this was perfect for my project as it would allow VR users to drag blocks around with a pointer and also allow browser users to drag blocks with a mouse, track-pad or touchscreen.
The next step was to integrate Blockly with Amazon Sumerian, this was a challenge, but after a few days I managed to setup the scene with an HTML-3D entity that displays the Blockly toolbox and workspace. Next I had to figure out how to control the 3D objects in the scene using the Blocks on the HTML-3D entity this was also a challenge, but I figured out how to do it by emitting messages to the state machine each time the user drags a block to the workspace. Next I programmed an 8x8 grid that would define the path the robot has to take to get to the goal and I also designed and implemented some levels. Next I created 2 more HTML-3D entities, one to display the generated JavaScript code and the other to display information. Lastly I added a Sumerian host with a dialog component to access the Amazon Lex chatbot.

Challenges I ran into

Making the Blockly library work with Amazon Sumerian was a bit of a challenge.

Accomplishments that I'm proud of

Creating something that might inspired the next generation of computer programmers.

What I learned

It was my first time using Amazon Sumerian and I learned a lot about it.

What's next for Virtual Coder

Next I plan to add more levels with more programming concepts for players to learn, I also plan to add other game modes to make the game more fun and also add better visuals.

Note: This game is intended to work both as a VR and 3D application, but it has not been tested with any VR hardware yet.

Built With

+ 3 more
Share this project: