驚くほどの超低遅延でマウスカーソルの位置を共有! 複数のユーザーが同時に楽しめる Multiuser Fluid が面白い!
まるで本当にその場で動かしているような自然さ
今回ご紹介するのは、一種の技術デモの類だと思うのですが、非常に面白いプロジェクト Multiuser Fluid です。
こちらのサイトでは、その名前が示すとおり複数のユーザーが同時に流体シミュレーションの施された Canvas 上でカーソルを動かすことができるのですが、なによりもその低遅延で動作する様子に驚かされます。
同時に接続しているユーザーがいれば、そのユーザーからの入力がどの程度の速度で反映されているのかも表示されます。
リンク:
見た目はとにかくシンプル
今回のサイトの要旨は、その超低遅延でのカーソル位置の反映にあります。
それ以外の部分は、比較的 WebGL のデモとしてはよく見かける、平面的な流体のデモという感じです。
とは言え、こういう流体的な表現は憧れている人も多いと思いますし、単純に一人でカーソルをぐりぐり動かしているだけでも楽しいです。
この上の画面を見ると、インクがより色濃く映っている部分があると思うのですが……
実際にこのキャプチャ画像を撮った瞬間には、この色の濃い部分に私の操作するマウスカーソルがありました。
一方で、左側のほうに小さな白い丸いアイコンのようなものが浮いていると思うのですが、これが世界のどこかにいる「たまたま同時に接続していた誰か」です。
キャプチャ画像では見えにくいと思いますが、丸いアイコンのそばに ○○ms
のように、ミリ秒単位でレイテンシと思われる数値も表示されています。
もし、みなさんがこのサイトを閲覧しているときに同時接続しているユーザーがいれば自ずとわかるのですが、本当に遅延がほとんど感じられない、かなりスムーズなカーソル移動を実現しています。
これは本当になかなかすごいですね……
どういう原理で動いてるのかまでは見ていませんが、近年のオンラインゲームさながらの遅延の少ないカーソル位置の移動は、見ていて単純に驚かされます。
ちなみに、ただカーソルを動かすだけだと力場に変化が加わるだけですが、マウスボタンを押しっぱなしにすることで、インクをじんわりとフィールドに配置することができます。
長時間ボタンをホールドして大量の色をばら撒いたときの様子。
画面上に映るのは、カーソルと、キャンバスだけです。
それでも、自分ではない第三者が操っているカーソルがぐいぐい動くのを見ていると、不思議とそこに「確かに誰かがいる」というふうに感じられるのが不思議です。
メッセージをやりとりできるわけでもなく、情報として読み取れるのは相手のカーソルの動きだけ……
でも、そういうなかでも人はコミュニケーションを取ることができるんだということを、なんだか感じさせてくれる作品だなと思いました。
ぜひチェックしてみてください。