雰囲気と背景 · ページの空気
漂う粒子粒子漂浮
- 軽い
- 奥行き
- 静か
小さな粒が画面の中をゆっくり漂います。手前の粒は大きく明るく、奥の粒は小さく暗く、互いにぶつかりません。雪でも星空でもなく、粒はあらゆる方向へ動くので「空気の中に何かが浮いている」ように見えます。ポインタが近づくとそっと避けます。
使いどころ
余白の多い紹介ページや待機画面に向きます。ファーストビュー、ローディング画面、グラフの下地などです。表・フォーム・行を追って読むリストには使わないでください。粒を目で追ってしまいます。同じページでオーロラやグリッドと重ねるのも避け、背景は 1 層で十分です。
パラメータ
74 particles · depth 0.25–1 · 12px/s · per-frame integration, no easing · pointer pushes within r 95px · ≤30fps
レシピ
条件 ≤30fps漂う粒子 → 74 particles · depth 0.25–1 · 12px/s · per-frame integration, no easing · pointer pushes within r 95px
AI に渡す一文
この領域に粒子の漂いを追加してください。小さな円を 74 個、それぞれ 0.25〜1 の奥行き値を持たせ、その値で大きさ（1〜2.6px）・速度・明るさを決めます。手前は大きく明るく、奥は小さく暗くします。粒は全方向へ等速で漂い、画面外に出たら反対側から戻ります。ポインタが 95px 以内に入ったら進行方向と逆向きに押しやり、近いほど強く、ただし「吸い寄せる」のではなく「避ける」程度の弱さにします。この層は 30fps を上限にし、動きの抑制時は静止した 1 フレームだけ残します。