ドミノ倒しDomino Wave
並んだ板が端から順に倒れて隣の板にもたれかかり、しばらく止まったあと逆の順で起き上がるドミノの動きです。
どう計算しているか
- 板は床に接する角を回転軸にして傾けます。最大の傾き角は asin(すき間 / 板の高さ) で、ちょうど板の上端が隣の板に触れる角度です。
- 各板の時刻は u = fract(t − 板の番号·「1枚ごとの遅れ」 − 列番号·「列ごとの遅れ」) です。番号が進むほど遅れるので、倒れる動きが波のように伝わります。
- u の区間を「倒れる」「倒れている時間」「起き上がる」の3つに分け、倒れる区間と起き上がる区間にそれぞれイージングを掛けて角度を決めます。
- 「列ごとに逆向き」をオンにすると、奇数列を左右反転して描くので、倒れる向きが列ごとに交互になります。
u = fract(t − k·lag − r·rowLag), θ = f(u)·asin(gap/h)ループがつながる理由
各板の角度は、u が0のときも1に近づいたときも0（直立）になるように区間を組んでいます。u は fract で1ループに1回巡るので、どの板も同じ姿勢でループをまたぎます。
調整できるパラメータ
形
| 列の数 | 1 〜 16（初期値 6） |
|---|---|
| 板の高さ | 30 〜 300（初期値 110） |
| 板の厚み | 3 〜 40（初期値 12） |
| 板の間隔 | 15 〜 200（初期値 46） |
| 床の線 | オン／オフ（初期値 オン） |
動き
| 1枚ごとの遅れ | 0 〜 0.05（初期値 0.012） |
|---|---|
| 列ごとの遅れ | 0 〜 0.3（初期値 0.05） |
| 倒れている時間 | 0 〜 0.6（初期値 0.25） |
| 列ごとに逆向き | オン／オフ（初期値 オン） |
| イージング | linear・sine・quad・cubic・quint・expo・back・elastic |
同じ分類のシーン（タイル・格子）
- グリッド × 位相Ripple Grid格子に並んだ図形が、中心からの距離などで決まる時間差をもって伸縮・回転・公転し、波紋のような動きを作ります。
- 図と地の反転Flip Tiles市松模様の正方形が90°回転し、回り終えるたびに図と地が入れ替わって、同じ模様が続いていく反転タイルです。
- 十字・図と地Cross Tiles平面をすき間なく埋める十字形が90°回転し、前半と後半で図と地が入れ替わって模様が途切れずに続きます。
- 三角・六角タイルTri / Hex Tiling三角形や六角形の敷き詰めが位置ごとの時間差で回転し、重なった部分をXOR合成で抜いて模様を作ります。
- トルシェ・タイルTruchet Flow四分円や対角線を描いた正方形タイルが波のように90°ずつ回転し、つながった曲線の迷路が組み替わり続けます。
- スライドパズルSlide Grid格子の行が左右に1マス、続いて列が上下に1マスずれる動きを交互の向きで繰り返す、スライドパズルのような模様です。
- 網点Halftone Waves印刷の網点のように並んだ点の大きさを、円軌道を回る波源から広がる波の重ね合わせで変化させます。
- 歪む市松Warp Checker市松模様の上を見えないレンズが円軌道で周回し、模様を膨らませたりへこませたりするオプアートです。
- 折り紙Origami Foldマスごとの正方形が対角線で半分に折れて裏の色を見せ、また開いて元に戻る、折り紙のような動きです。
- ヘリンボーンHerringbone杉綾模様に組んだ長方形のレンガが、長い辺を軸に1枚ずつ裏返って色が入れ替わっていく動きです。
- 菱形・5回対称Rhombus Rosette太い菱形と細い菱形を同心円状のリングに並べ、リングごとに時間差をつけて半回転させる回転対称の模様です。
- ピクセルの崩落Pixel Fallドット絵の図形がブロックごとに下へ崩れ落ち、画面の上から降ってきて元の位置に積み上がる動きです。
- SDF・ドメイン反復GLGoo Grid格子状に繰り返した距離関数の図形が、隣同士で溶け合いながら伸縮・回転・公転するシェーダーの模様です。
- 反応拡散風・シェーダーGLTuring Pattern複数方向の波を重ねてしきい値で切り分け、豹柄やサンゴ、迷路のような斑点や縞をうごめかせるシェーダーの模様です。