アルゴリズムで未来を創る
AlgoCreation

デジタル万華鏡

WEBブラウザで無料で遊べるデジタル万華鏡アプリです。色彩と対称性の織りなす美しい世界をお楽しみ下さい。PC/スマホにレスポンシブ対応しています。

特徴

シミュレーション

デジタル万華鏡内部には色とりどりの小さなオブジェクトが封入されており、物理演算によって本物の万華鏡さながらのシミュレーションが行われています。

シミュレーションの様子

回転モード

万華鏡の回転の方法を選べるようにしました。

  • 自動的に回転する(画面も回転)
    本物の万華鏡と同様に回転し、画面下側に重力がかかります。
  • 自動的に回転する(画面は固定)
    画面は固定した状態で、画面を一周するように重力方向が回転します。
    (画面が回転すると目が回る人向け)
  • デバイスの向きを使用する
    (下記ジャイロセンサーを御覧ください)
  • 回転しない
    全てのシミュレーションを停止します。
回転モードの選択画面

ジャイロセンサー

デバイスがスマホの場合、ジャイロセンサーを用いた回転モード デバイスの向きを使用 に対応しています。スマホを傾きと万華鏡を連動させることができます。(落とさないように気をつけて遊んで下さい)

ジャイロセンサーによる回転の様子

主な使用技術

開発言語

TypeScript

ライブラリ

  • three.js: 3D描画ライブラリ
  • cannon-es: 物理シミュレーションライブラリ
  • next.js: Reactフレームワーク

ヒストリー

  • 2024/12/17: 初版公開