ITエンジニア/デザイナ向けにオープンソースを毎日紹介

html5rubikはHTML5を使って描かれた遊べるルービックキューブです。

昔懐かしいおもちゃのルービックキューブ。高速で解き明かす人、コンピュータに解かせるなどまだまだ人気のあるおもちゃですが、HTML5を使ってWeb上で遊べるようにしたのがhtml5rubikです。


HTML5で作られています。


マウスで動かしてごちゃ混ぜにしてみました。


ボタン一つで解き明かしてしまいます。


ルービックキューブの向きは自由に変えられます。


デモ動画です。ボタン一つで解き明かしているところに注目。

HTML5とCSS3を駆使することで3Dで表示できるようになっています。自由に回転させたり、面を動かして遊べます。一人はもちろん、友達同士で遊んでも面白いかもしれません。

html5rubikはHTML5/JavaScript製のソフトウェア(ソースコードは公開されていますがライセンスは明記されていません)です。


MOONGIFTはこう見る

古いコンテンツを掘り起こして再ブレークさせるというアイディアはたくさんあります。おもちゃやお菓子でも復刻版は人気があります。そこにさらに現代風のエッセンスを付け加えればヒットする可能性があります。

コンピュータやインターネットは発展していますが、人自体は数十年前から大して変わっていませんので、心に刺さる部分も大差はなかったりします。アイディアに詰まったら昔を振り返ってみるのも一つの手です。

HTML5 Rubik's cube (CSS3 + JS)

dferreiroval/html5rubik

 

MOONGIFTの関連記事

  • DevRel
  • Com2