관리 메뉴

HAMA 블로그

Ease in / out 보간법 (펌) 본문

그래픽스

Ease in / out 보간법 (펌)

[하마] 이승현 (wowlsh93@gmail.com) 2015. 7. 22. 12:49


프레임에 독립적인 가속(ease-in)과 감속(ease-out) 보간


이 방법은 Game Programing Gems vol 1의 2.1 보간법(Johm Olsan)에서 다루는 방법으로, 

프레임 변화율에 무관하게 가속 감속 보간을 실행한다.

(GPG Gems vol 1 - 2.1 보간 법 : 프레임율 독립적인 가-감속 보간)


아래 사진은 GPG 1권의 Ease In Out Interpolation 그래프이다.









프레임 율에 독립적으로 동작 하면서 가속과 감속 처리를 하기 위해서는 시간 기반(time based) 보간처리를 해야 한다.

(시간 기반 Animation 참조 )

즉, 현재 시간(t_1)에 이전 시간(t_0)를 빼줌으로서 delta time(dT)를 구해야 한다.


또한 가속 - 감속 처리를 위해서 가속도(Acceleration)값을 가중치(weight)로 이용해서 구한다.


우리는 보간 처리를 하기 위해서, 좌표의 변화량(변위)값을 구하는 것이 목적이다.

그럼으로 아래와 같은 물리 방정식을 이용해서 변위 값을 유도해 낼 수 있다.


가속도(acceleration) = 이동속도 / 이동시간 = deltaVelocity / deltaTime = (v_f - v_0) / (t_1 - t_0) = dV / dT

속도(velocity).= 이동거리 / 이동시간 = range / deltaT = (x_f - x_0) / (t_1 - t_0) = dR/ dT

변위(Displacement, range) = 속도 * 이동시간 = (x_f - x_0) = (d_f - d_0) = v * (t_1 - t_0) = v * dT


운동 방정식 1

a = (v_f - v_i) / (t_f- t_i)

v_f = v_i + aT

최종 속도 = 초기속도 + 가속도*시간

시간 = t_f - t_i = T


운동 방정식 2

등가속도 운동일 경우,

avg_v = (v_i + v_f) / 2

평균속도 = (초기속도 + 최종속도) / 2


평균속도는 시간에 따른 변위의 비율 과 등가속도 운동일 경우 식을 통하여 대수적으로 변형할 수 있다.

avg_v = deltaX / t

deltaX / t = (v_i + v_f) / 2

deltaX = (v_i + v_f) * t / 2


운동 방정식 3

dX = (v_i + v_f) * t / 2

변위 = (초기속도 + 최종속도) * 시간 / 2


(운동방정식 1) (운동방적식 3)에 치환하면 다음과 같은 식으로 유도할 수 있다.

deltaX = (v_i + v_i + aT) * T / 2

deltaX = v_i*T + (aT^2) / 2

변위 = 초기속도 * 시간 + 가속도 * 시간^2 / 2



Function 

F = v = a*t = (x_1 - x_0) / (t * t / 4) * t


(운동 방정식 3) 을 이용하여 가속도와 변위를 구한다.


displacement : x = x_0 + (v_0 * t) + a * t * t / 2

acceleration : a = (x_1 - x_0) / (t * t / 2)          <- v_0는 초기속도임으로 0으로 볼수 있다.

velocity : v = acceleration * t 


가속도 식에서 2로 나누는 값을 4로 나눠야 한다. 이는 가-감속식에서

변위의 중간 위치에서 단계가 계속 증가하는 것이 아니라 감속하기 때문이다.

(첨부한 엑셀 interpolation.xlsx에서 확인하도록 하자.)



Pseudo Code

// 보간 처리할 간격 구하기.

// EaseInOut 가-감속 보간 수식.

// 등가속도 운동으로 구한다.


n = 100;

x_final = 600;

time = 10.0f ;

acceleration = (x_final - x0) / (time * time / 4);

velocity = acceleration * deltaT;


deltaT = time / n;

remainingTime = time - deltaT;


do {

if (remainingTime > time/2) {

// 가속 처리

velocity += (acceleration * deltaT);

} else {

// 감속 처리

velocity -= (acceleration * deltaT);

}

x1 += (velocity * deltaT);

interpolation_values[interpolation_index++] = (x1 - x0);  // x 의 변화량을 보간 값으로 저장한다.

x0 = x1;


remainingTime -= deltaT;

} while(remainingTime > 0.0f);


Evaluation

range : i = 0, n = 600

time = 10.0f



Result

EaseInOut 가-감속 보간 결과


EaseInOut 가-감속을 위한 변화량 결과 ; (x_1 - x_0)

(변화량은 등가속도 운동을 함으로 일정한 간격으로 상승했다가 하강한다.)





http://www.gizma.com/easing/  <-- 여기 보면 Ease in / out 를 직접 확인해볼수있다.


'그래픽스' 카테고리의 다른 글

메쉬 생성 방법 소개  (0) 2015.07.21
메쉬 제네레이션 - delaunay triangulation  (0) 2015.07.21
Comments