イージング機能とは何ですか？

ゲーム開発用のこのクールなWebサイトを見つけました。これにはイージング機能のリストがあります。

サイトには目的の説明が含まれていますが、それは私の頭に浮かびます。イージング機能とは何ですか？

更新

Phaser.ioのソースコードから関数自体のより良い例を見つけました。これらの関数は、ここでの答えが示唆するよりもはるかに単純です。パラメータは1つのみkです。答えの一部として、これらの使用方法を知りたいです。

イージング関数は、通常、アニメーション/キネマティックモーションの補間に使用されます（必須ではありません）。線形補間（lerp）は聞いたことがあるかもしれません。画面の隅から隅までスマイリーの顔を強打したとしましょう（あなたのイメージのように）。これは、スマイリーがポイントAからポイントBに一定の速度で移動することを意味します。これを四肢の動きに適用すると、非常にロボット的で不自然に見えます-ロボットが使用するアクチュエータ/サーボは、この方法で実行します。明らかに、人間の手足は非常に異なる方法で動きます。また、自然界で見られるほとんどのモーションには、線形補間で見られる安定した不変の速度ではなく、興味深いモーションカーブがあります。

イージングを入力します。動きの緩和とは、速度が一定でないことを意味します。これにより、よりリアルに見えるようになります。人を見たり、さまざまな動物を見たり、植物が風になびいたり、雨の日が豪雨の日にどのように方向を変えたりするのかを見ます。空中に投げ上げ、再び下に落ちてくるボールの速度を観察します。あなたがそれを摘むようにギターの弦の動きを見てください。これらの各タイプのモーションには、速度を表す異なる曲線があります。

GreenSockのGSAPオンラインでプレイして、さまざまな種類のイージングカーブがモーションに関してどのような結果をもたらすかを把握することをお勧めします。特定の名前の付いた曲線を、思い通りの動きにマッピングするのに時間と練習が必要なことの1つです。しかし、基本を理解したら、たくさんの楽しみがあります。

PS私が言ったように、イージングは​​アニメーションだけに使用されるわけではありません。サウンドのパンニング、論理的/モデルレベルでの骨格運動の実現、または時間の経過とともに特定の滑らかな変化が必要と思われるその他のあらゆるものに使用できます。

イージング関数を使用すると、「イージング関数」と呼ばれるものを使用して、特定の間隔である値から別の値に値を補間できます。これらは、値を取得するように設計された関数であり、間隔内の任意の時点で、特定の時点で値を出力します。

これは、コードスニペットを見ると最もよく説明できます。

// simple linear tweening - no easing, no acceleration


Math.linearTween = function (t, b, c, d) {
    return c*t/d + b;
};

@tは、トゥイーンの現在の時間（または位置）です。これは、秒またはフレーム、ステップ、秒、ミリ秒など、単位が合計時間で使用されているものと同じである場合があります

@bは、プロパティの開始値です。

@cは、プロパティの開始値と宛先値の間の変更です。

@dはトゥイーンの合計時間です。

ありがとう、http：//upshots.org/actionscript/jsas-understanding-easing

これは線形イージング関数の定義です。これを「t」でグラフ化すると、単なる線形グラフになります。

さて、クール。何のために使用できますか？

開始点と終了点を念頭に置いてアニメーション化する場合は、いつでも「トゥイーン」または「イージング機能」を使用できます。

たとえば、Angry Birdsで撮ったGIFは次のとおりです。

メニューが画面のポイントまでスライドしていることに注意してください。これは、適所に緩和するイージング機能によるものです。それらはウェブ上で見ることができます。これが直線的な簡単さであれば、全体を通して同じになります。

音楽？

承知しました！現在のサウンドトラック値の値を取得し、合計tの1秒間でその値と0の間を補間すると、ボリュームは1秒間で徐々にフェードアウトします。

境界オブジェクト

物理システムなしでスプライトにこのような効果を生成できるバウンスを可能にする関数もあります（http://easings.net/#easeOutBounceを参照）。

トゥイーンを検索すると、Webで詳細情報を見つけることができます。

イージング関数は、期間中に値を開始番号から終了番号に変更するのに役立ちます。

その値を使用して、位置、回転、スケール、色の変更、値を使用する他のプロパティなど、ゲーム内のオブジェクトのプロパティをアニメーション化します。

さまざまなイージング関数によって、アニメーションの「感触」、つまり値が時間とともにどのように変化するかが決まります。

投稿したWebサイトでは、グラフは開始から終了まで時間とともに変化する値を示しているため、アニメーション化するオブジェクトがグラフ内のボールの経路をたどることを意味しません。