1本の糸がカーソルを追いかけ、近くの点と点が結ばれていく。
「人と人がつながる」系サイトの定番モチーフ。
糸は50個の点の連なりです。それぞれの点が「慣性」と「隣と一定距離を保つ」という 2つのルールだけで動いており(バーレー積分)、それだけで絹糸のようなしなやかさが生まれます。
先頭の点だけがカーソルに引き寄せられ、残り49個は物理法則で追従します。背景の点群は互いの距離を総当たりで監視し、近づいた点同士に線を張っています(距離に応じて透明度が変化)。
コミュニティ、マッチング、採用サイトなど「つながり」がコンセプトのFVに。カーソルに生き物のように反応するため、コンセプトの体感として説得力が出ます。
Canvas 2D のみ。物理エンジン等のライブラリは不使用で、コードは約150行。触っていない間も糸が8の字に泳ぐ「アイドルモーション」を入れて、初見でも動きが伝わるようにしています。