雰囲気と背景 · ページの空気
コンステレーション星座连线
- 点が漂う
- 近づくと繋がる
- 線は生まれて消える
いくつかの点がゆっくり漂います。二つが一定距離まで近づくと線が繋がり、離れると切れます。線の不透明度は距離で決まるので、徐々に生まれて徐々に消えます。オンオフで切り替わることはありません。
使いどころ
「つながり、ネットワーク、関係、データ」といったテーマの背景に使い、デスクトップではポインタによる吸引と相性が良いです。点の数が肝心です。60 を超えると線が毛糸玉になり、毎フレームの総当たり距離計算は二乗で増えます。
パラメータ
42 nodes · drift 8px/s · link when distance < 104px · line opacity 1−(d/104)² · per frame, no easing
レシピ
コンステレーション → 42 nodes · drift 8px/s · link when distance < 104px · line opacity 1−(d/104)² · per frame, no easing
AI に渡す一文
コンステレーションの背景を作ってください。42 個の点がそれぞれ約 8px/s で漂い、枠を出たら反対側へ回ります。毎フレーム総当たりで比較し、104px 未満なら線を引きます。線の不透明度は 1−(d/104)² で減衰させ、しきい値でちょうど 0 になるようにします。突然切れてはいけません。毎フレーム進め、イージングは掛けないでください。点は 60 個以下に。総当たりの計算は二乗で増えます。