Skip to content

Igamingdev1/rubik-s-cube

Repository files navigation

🎯 Rubik's Cube - Interactive 3D Puzzle Game

Experience the classic Rubik's Cube puzzle in stunning 3D! 🎲

A modern, interactive Rubik's Cube game built with Three.js and TypeScript, featuring smooth 3D graphics, touch controls, and support for multiple cube sizes from 2x2 to 10x10. Perfect for puzzle enthusiasts, developers learning 3D graphics, or anyone who wants to enjoy the timeless Rubik's Cube experience in their browser.

✨ Features

🎮 Interactive Gameplay

  • Multi-size support: Play with 2x2, 3x3, 4x4, 5x5, 6x6, 7x7, 8x8, 9x9, and 10x10 cubes
  • Smooth 3D controls: Intuitive mouse and touch controls for rotating the cube
  • Real-time rendering: High-performance WebGL graphics with smooth animations
  • Responsive design: Works perfectly on desktop, tablet, and mobile devices

🎨 Visual Excellence

  • Stunning 3D graphics: Powered by Three.js for realistic cube rendering
  • Smooth animations: Floating cube animation and seamless transitions
  • Dynamic lighting: Realistic shadows and lighting effects
  • High-resolution display: Optimized for retina and high-DPI screens

🛠 Technical Features

  • TypeScript: Modern, type-safe codebase for better development experience
  • WebGL acceleration: Hardware-accelerated 3D graphics
  • Touch-friendly: Optimized controls for mobile devices
  • Cross-platform: Works on all modern browsers
  • MIT licensed: Free to use, modify, and distribute

🎮 How to Play

Basic Controls

  • Mouse/Touch: Click and drag to rotate the cube
  • Cube Size: Use the dropdown to select different cube sizes (2x2 to 10x10)
  • Restore: Click "还原" (Restore) to solve the cube instantly
  • Disorder: Coming soon - automatically scramble the cube

Game Modes

  • Free Play: Explore and experiment with different cube sizes
  • Challenge Mode: Try to solve increasingly complex puzzles
  • Learning Mode: Perfect for beginners learning cube notation

📱 Screenshots

Desktop Experience

Desktop Gameplay Smooth 3D rendering with intuitive controls

Mobile Interface

Mobile Interface Touch-optimized controls for mobile devices

Multiple Cube Sizes

Multiple Sizes Support for cubes from 2x2 to 10x10

🛠 Technology Stack

  • Frontend: TypeScript, HTML5, CSS3
  • 3D Graphics: Three.js, WebGL
  • Build Tools: Rollup, Web Dev Server
  • Development: Concurrently, Rimraf
  • License: MIT

🎯 Perfect For

🧩 Puzzle Enthusiasts

  • Classic Rubik's Cube experience in your browser
  • Multiple difficulty levels with different cube sizes
  • No need to carry physical cubes

👨‍💻 Developers

  • Learn Three.js and 3D graphics programming
  • Study TypeScript implementation patterns
  • Understand WebGL and 3D rendering concepts

🎓 Students & Educators

  • Interactive way to learn about 3D geometry
  • Visual representation of spatial reasoning
  • Great for computer graphics courses

📱 Mobile Users

  • Touch-optimized interface
  • Works offline after initial load
  • No app installation required

Star this repository if you find it helpful!

About

A modern, interactive Rubik's Cube game built with **Three.js** and **TypeScript**.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published