Rubics cube in your browser

Rubic’s Cube had it’s 40th Anniversary this week. Although the Rubik’s Cube reached its height of mainstream popularity in the 1980s (from where I remember it most), it is still widely known and used. Since then it’s sold over 350 million units, making it the best-selling toy ever. Rubik’s Cube is a hard task to solve, thus some modern time hackers have built even smart phone powered LEGO devices that can solve it.

In honor of the 40th anniversary of the Rubik’s Cube, Google adorned its Doodle space with an interactive version of the insanity-inducing puzzle: Google put an impressive simple browser-based Rubic’s Cube Doodle game up on its homepage. Built thanks to advances in CSS and a few smart design tricks, it’s one of the most challenging doodles the company has done so far.

The widespread support for CSS 3-D Transforms on most browsers meant the team could build the cube in a way that was playable for most users: CSS 3-D Transforms lets us display the cube in a 3-D space. It is quite amazing that can be done with those transformations. I have earlier written on using CSS3 for video effects.

Chrome, complete with Javascript engine, allows the Cube to be twisted on any device. HTML5 & CSS3 allows the style to appear 3D and help make the Cube motions fluid. Three.js 3D-library allows the cube to be rendered in real time. Here is the Rubik’s Cube from Google:

2 Comments

  1. Tomi Engdahl says:

    Algorithmic Solution to Solve Rubik’s Cube in Only 20 Moves
    https://www.eeweb.com/profile/max-maxfield/articles/algorithmic-solution-to-solve-rubiks-cube-in-only-20-moves

    The Rubik’s Cube has only six faces, each presenting only nine cubelets, but the end result is to offer a mind-boggling number of permutations, only one of which embodies the desired solution.

    Although the standard Rubik’s Cube has only six faces, each presenting only nine cubelets, the end result is to offer a mind-boggling number of permutations, only one of which embodies the desired solution.

    Wow! That sure is a lot of permutations. So, you can only imagine my surprise when I ran across this video, which purports to offer a universal solution that can solve the cube from any initial scrambled condition in at most 20 moves using the following algorithm: L R2 B L’ R U2 F2 L B D U2 B L’ R2 B2 L’ D2 U L’ B2 U2 R2 B D2.

    https://www.youtube.com/watch?v=D3g1BH6Yo8M&feature=youtu.be

    Reply
  2. Tomi Engdahl says:

    Self-Solving Rubik’s Cube Robot!
    https://m.youtube.com/watch?v=2PGjTt4xkWM

    This self-solving Rubik’s Cube robot was one of the coolest things we saw at Maker Faire 2019. Its creator Takashi Kaburagi shows us how it works and we take a peek beneath the tiles to see its robotic core. Watch it come alive and perform a solve!

    Find more of Takashi’s projects here:
    https://m.youtube.com/user/meiji0vs0lotte/featured

    Reply

Leave a Comment

Your email address will not be published. Required fields are marked *

*

*