状態間のトランジション · A から B へ
ピクセル溶解像素溶解
- デジタル
- 順序
- レトロ
次の画像はフェードではなく、マス目ごとに「生えて」きます。しきい値は対角位置+ゆらぎなので、斜めに掃引します。
使いどころ
「別の画像に替える」「別の色味に替える」といった等価な差し替えに向きます。ビフォーアフター、フィルターの切り替え、写真のスタイル変更などです。ページ間の遷移には使わないでください。マス目ごとの溶解は 1 秒前後かかり、通常のトランジションよりずっと遅いので、固まって見えます。細部を見せる必要のある画像にも使わないでください。溶解中は細部が砕けます。
パラメータ
32×18 cells (10×10px) · threshold = diagonal + jitter, normalised 0–0.94 · per frame, no easing · 6% growth room
レシピ
条件 threshold = diagonal + jitter, normalised 0–0.94毎フレーム積分、イージングなしピクセル溶解 → 32×18 cells (10×10px) · per frame, no easing · 6% growth room
AI に渡す一文
ピクセル溶解のトランジションを作ってください。キャンバスを 32×18 のマス(各 10×10px)に切り、各マスにしきい値を与えます。値は対角位置(行 割る 総行数 足す 列 割る 総列数 を 2 で割ったもの)に少しのゆらぎ(プラスマイナス 0.17)を足したもので、その後すべてのしきい値を 0 から 0.94 に正規化します。上限を 1 未満にするのは、各マスに 6% の成長余裕を残すためです。そうしないと最後の一群が満ちません。進捗 p を 0 から 1 まで動かします。しきい値が p 未満のマスが新しい画像を描き、自分の中心から実寸まで成長します(grow = min(1, (p マイナス しきい値) 割る 0.06))。サンプリングの前に、2 枚の元画像をそれぞれキャンバスと同じ大きさのオフスクリーンキャンバスへ縮小して描き、すべての drawImage はそこから取ってください。元画像をキャンバス座標で直接取ると、別の絵の左上を切り出します。