¿Qué son las funciones de relajación?

Encontré este website genial para el desarrollo de juegos y tiene una list de funciones de relajación:

enter image description here

Aunque el sitio contiene una descripción de para qué sirven, se me pasa por la cabeza. ¿Qué son las funciones de relajación y para qué se utilizan?

Actualizar

Encontré un mejor ejemplo de las funciones del código fuente de Phaser.io . Estas funciones son mucho más simples de lo que sugieren las respuestas aquí. Solo toman un parámetro, k . Como parte de la respuesta, me gustaría saber cómo usarlos.

Las funciones de aceleración se utilizan para la interpolación, típicamente (pero no necesariamente) en animation / movimiento cinemático. La interpolación lineal (lerp) es algo de lo que puede haber oído hablar. Digamos que coloca una cara sonriente desde una esquina de la pantalla a otra (muy similar a su image). Esto significa que el emoticono se moverá a una velocidad constante desde el punto A al punto B. Si tuviera que aplicar esto al movimiento de una extremidad, se vería muy robótico y antinatural: los actuadores / servos que usan los robots actúan de esta manera. Obviamente, las extremidades humanas se mueven de una manera muy diferente. Y la mayor parte del movimiento que verá en la naturaleza tendrá curvas de movimiento interesantes, en lugar de la velocidad constante e inmutable que se ve en la interpolación lineal.

Ingresa alivio. Aligerar el movimiento significa que la velocidad no es constante. Lo que esto logra es parecer más realist. Observe a la gente, vea diferentes animales, mire las plantas que se doblan en el viento, o incluso cómo la lluvia cae cambia de dirección en un día de racha. Observe la velocidad de una pelota cuando la arroja al air y vuelve a bajar. Mira el movimiento de una string de guitarra mientras la arrancas. Cada uno de estos types de movimiento tiene una curva diferente que describe la velocidad.

Te sugiero que juegues con el GSAP de GreenSock en línea para tener una idea de lo que producen los distintos types de curvas de relajación en términos de movimiento. Es una de esas cosas en las que toma time y práctica mapear una determinada curva con nombre al tipo de movimiento que imaginas que quieres. Pero una vez que hayas comprendido lo básico, te divertirás mucho.

PD Como dije, la relajación no solo se usa para la animation. Se puede usar para el barrido de sonido, para realizar movimientos esqueléticos en el nivel lógico / model, o cualquier otra cosa que se pueda imaginar que pueda necesitar una variación suave y precisa con el time.

Una function de aceleración le permite interpolar valores de un valor a otro en un intervalo determinado usando algo llamado "function de aceleración". Estas son funciones que están diseñadas para tomar un valor y en cualquier punto dado en el intervalo, generan el valor en un cierto punto en el time.

Esto se puede explicar mejor al echarle un vistazo a un fragment de código:

 // simple linear tweening - no easing, no acceleration Math.linearTween = function (t, b, c, d) { return c*t/d + b; }; 

@t es la hora actual (o position) de la interpolación. Esto puede ser segundos o cuadros, pasos, segundos, ms, lo que sea, siempre que la unidad sea la misma que se utiliza para el time total

@b es el valor inicial de la propiedad.

@c es el cambio entre el valor inicial y el valor de destino de la propiedad.

@d es el time total de la interpolación.

Gracias, http://upshots.org/actionscript/jsas-understanding-easing

Esta es la definición de una function de relajación lineal. Al graficar esto a lo largo del time en términos de 't' obtenemos un mero grafo lineal.

De acuerdo, genial. ¿Para qué los podemos usar?

Cada vez que comienzas y finalizas y quieres animarlos, puedes usar una function de "interpolación" o "atenuación".

Por ejemplo, aquí hay un GIF que acabo de tomar de Angry Birds:

enter image description here

Observe que el menu se desliza hacia el punto de la pantalla, pero se detiene lentamente? Esto se debe a una function de aceleración que se adapta a su lugar. Puedes verlos en toda la web. Si esto fuera una facilidad lineal, sería lo mismo en todas partes.

¿Música?

¡Por supuesto! Si tomamos el valor de nuestro valor actual de la banda sonora y lo interpolamos entre eso y 0 durante una t total de, digamos, 1 segundo, nuestro volumen se desvanecerá lentamente durante un período de un segundo.

Objetos de enlace

También hay funciones que permiten el rebote (ver: http://easings.net/#easeOutBounce ) que puede producir efectos como este en un sprite sin ningún sistema de física:

enter image description here

Puede search más información en la web buscando interpolación.

Las funciones de aceleración sirven para cambiar un valor durante un período de time, desde un número inicial hasta un número final.

Usas ese valor para animar una propiedad de un object en tu juego, como position, rotation, escala, cambio de colors y otras properties que usan un valor.

Las diferentes funciones de relajación determinan la "sensación" de la animation, o cómo el valor cambia con el time.

En el website que publicó, el gráfico muestra el valor que cambia con el time desde un inicio hasta un final, por lo que no significa que el object que está animando seguirá la ruta de la bola en el gráfico.

Intereting Posts