曲線・補間 · 2 / 10
ベジェ曲線
制御点を動かして軌跡やUIの曲がり方を調整する。
動くデモで比較する
Interactive demo
UIの移動
A比較対象
直線移動
Bベジェ曲線100%
ハンドルで調整できる軌跡になる
時間を動かすと停止して観察できます。変化量 0% で A と同じ状態、100% で B の効果を表示します。8 秒で繰り返します。
見るポイント：制御点に引かれて進む → 終点へ曲がって到着。
ゲームでの使いどころを示す小さな描画サンプルです。実際のゲームでは、素材や他の技法と組み合わせて使います。
コマ送りで解説を読む
例: UIの移動
1. 開始
開始位置にある
2. 変化
制御点に引かれて進む
3. 結果
終点へ曲がって到着
技法のしくみ
1. 入力
両端と制御点
2. 処理
制御点で形を調整
3. 結果
ハンドルに沿う曲線
さらに調べる
The Book of Shaders — Shaping Functions ↗この分野の参考資料です。個々の項目を直接説明する資料とは限りません。