Skip to main content

Qubix (multiplayer 3D game)

Qubix is a real time multiplayer web browser 3D game, created by using three.js and socket.io. Three.js is a cross-browser JavaScript library/API, used to create and display animated 3D computer graphics in a web browser, based on WebGL. Socket.IO is a JavaScript library for real time web applications, and enables real time, bi-directional communication between web clients and servers.

The goal of the game is to change as many objects to your color as possible, before the time expires. Click your opponent's objects to change them to your color. There are two types of objects, cubes and diamonds. Cubes are worth 1 point, and diamonds are worth 3 points. The player who has the most points after 30 seconds, wins.

Three.js enables players to experience a 3D environment game. There are two main events, mouse click and key press. When the player clicks an object, three.js calculates the location of the click and determines which object is clicked in the 3D environment. It changes the color of the object and changes the score accordingly. When the player press a key, it changes either the location or view of the player, and allows the player to move around the game map.

Socket.io enables players to have a real time multiplayer game. There are two main events, broadcasting and connection. For broadcasting, socket.io updates the game information every time there is a data change and broadcasts it to the other player. Additionally, the color of objects and score is broadcasted immediately. For connection, when players first log in, their user names are updated on the “Players” list and shared with all players online.

Try the game on qubixgame.herokuapp.com and compete with your friends on your clicking skills!

Project Members: Jisoo Ryu

Find the program that fits your life.

Learn about our coding, cybersecurity, and data analytics bootcamps offered on full-time and part-time schedules.