Grubix - WebGL Rubik's Cube

Demo

➡️ GitHub Pages deploy

Game controls

• Click and drag on the pieces to move faces/slices
• Manage the state of the cube from the last section in the sidebar

Graphics controls

• Manage lights, ambients and advanced effects from the sidebar
• 🤫 Press C to spawn confetti 🎊

Graphics features

Diffuse

• Lambert
• Toon

Specular

• Phong
• Blinn

Lights

• Directional
• Spotlight
• Point

Ambient

• Homogeneous
• Hemispheric
• Skybox + Irradiance

Texture

• Regular texture mapping
• Normal mapping

Advanced

• Parallax Occlusion Mapping
• Cook-Torrance BRDF

Acknowledgements

• Original utils.js from the course materials
• Original skybox texture from Learn OpenGL
• cube.js from cubejs
• Normal and displacement maps from ambientCG
• Useful tutorials from Learn OpenGL