ease

(r34 판)
별 아이콘0
수정 아이콘편집 요청
토론 아이콘토론
책 표지 아이콘역사
메뉴 아이콘
[주의!] 문서의 이전 버전(에 수정)을 보고 있습니다. 최신 버전으로 이동

목차
1. 개요2. 작품3. 종류
3.1. 접미사3.2. ease power3.3. ease sine3.4. ease back3.5. ease circ3.6. ease bounce3.7. ease elastic
4. 여담5. 관련 문서

1. 개요 [편집]

  • 0에서 1로 등속운동을 하는 어떤 변수 t[1]에 대하여 f(t)의 위치를 정해주는 함수다.
  • 주로 치역[2]과 정의역[3][4]이 0~1이지만, 매핑[5]을 하여 원하는 범위에서 입출력하게 만든다.

2. 작품 [편집]

좋아요 기준 내림차순.
개발자
작품 공유일
조회수
좋아요
북마크
링크
비고
2025. 10. 11.
3425
157
102
파일:엔트리 아이콘.svg
2025. 01. 08.
1069
40
33
파일:엔트리 아이콘.svg
이 문서에서는 이 작품을 기준으로 한다.
f_unction
2026. 05. 30.
174
14
8
파일:엔트리 아이콘.svg
리토리
2026. 02. 13.
126
6
3
파일:엔트리 아이콘.svg
770544
2025. 11. 20.
145
6
4
파일:엔트리 아이콘.svg
initialized
2024. 10. 22.
114
4
1
파일:엔트리 아이콘.svg
2025. 11. 12.
66
2
1
파일:엔트리 아이콘.svg
꧁뉴비q191꧂
2026. 04. 15.
67
1
0
파일:엔트리 아이콘.svg
awde34
2026. 02. 17.
49
1
2
파일:엔트리 아이콘.svg

3. 종류 [편집]

3.1. 접미사 [편집]

  • -in
    • 느리게 시작했다가 서서히 빨라지는 함수 유형이다.[6]
  • -out
    • 빠르게 시작했다가 서서히 느려지는 함수 유형이다.[7]
  • -in-out
    • in과 out을 붙힌것으로, 느림->빠름->느림 순서로 움직이는 함수 유형이다.
      왠만해서 t<0.5t<0.5 에서는 in(2t)2\frac{in(2t)}{2}를, 아닐시 1+out(2t1)2\frac{1+out(2t-1)}{2}의 식을 사용한다.[8]
  • -out-in
    • 해당 문서에는 별다른 언급이 없을 예정이지만, out과 in을 붙힌것으로 빠름->느림->빠름 순서로 움직이는 함수 유형이다.
      자주 쓰이지 않는 유형이다.

3.2. ease power [편집]

  • 지수함수의 형태로 정의되는 ease함수다.
  • 위에 붙는 지수의 값에 따라 Quad, Cubic, Quart, Quint, Expo[9]등 다양하지만 굳이 서술 할 이유가 없으므로 Quad를 대표로 서술하였다.
  • ease in quad. 수식은 f(x)=x2f(x)=x^2.[10]
파일:ease in quad.png
  • ease out quad. 수식은 f(x)=1(1x)2f(x)=1-(1-x)^2.
파일:ease out quad.png
  • ease in-out quad.
파일:ease in out quad.png

3.3. ease sine [편집]

  • 삼각함수를 사용한 ease함수 유형이다. 그 외에는 별 특별한 것 없다.
  • ease in sine. 수식은 f(x)=1sin(90(1x))f(x)=1-\sin(90(1-x)). [11]
파일:ease in.png
  • ease out sine. 수식은 f(x)=sin(90x)f(x)=\sin(90x).
파일:ease out.png
  • ease in-out sine.
파일:ease in out.png

3.4. ease back [편집]

  • 잠깐 뒤로 갔다가[12] 오는 ease함수 유형이다.
  • ease in back. 수식은 f(x)=(s+1)x3sx2f(x)=(s+1)x^3-sx^2. 여기서 s는 ease back에서 사용되는 상수값으로, s=1.70158s=1.70158[13]이다.
파일:ease in back.png
  • ease out back. 수식은 f(x)=1+(s+1)(x1)3+s(x1)2f(x)=1+(s+1)(x-1)^3+s(x-1)^2.
파일:ease out back.png
  • ease in-out back. in-out에서는 s값에 1.525를 곱하여 사용한다.[14]
    파일:ease in out back.png

3.5. ease circ [편집]

  • 이름답게 그래프가 사분원[15]을 그리는 ease함수 유형이다.
    속도가 극단적으로 빨라진다.
  • ease in circ. 수식은 f(x)=11x2f(x)=1-\sqrt{1-x^2}.
파일:ease in circ.png
  • ease out circ. 수식은 f(x)=1(1x2)f(x)=\sqrt{1-(1-x^2)}.
파일:ease out circ.png
  • ease in-out circ.
파일:ease in out circ.png

3.6. ease bounce [편집]

  • 통통 튀면서 움직이는 ease함수 유형이다.
  • ease out bounce.[16] 수식은..
    f(x)={12116x2,x<411 12116(x611)2+34,x<811 12116(x911)2+1516,x<1011 12116(x2122)2+6364,x1 f(x)= \begin{cases} \frac{121}{16}x^2, & x<\frac{4}{11}\ \\ \frac{121}{16}\left(x-\frac{6}{11}\right)^2+\frac{3}{4}, & x<\frac{8}{11}\ \\ \frac{121}{16}\left(x-\frac{9}{11}\right)^2+\frac{15}{16}, & x<\frac{10}{11}\ \\ \frac{121}{16}\left(x-\frac{21}{22}\right)^2+\frac{63}{64}, & x\leq1 \\ \end{cases} [17]

파일:ease out bounce.png
  • ease in bounce. 수식은 f(x)=1easeoutbounce(1x)f(x)=1-\operatorname{easeoutbounce}(1-x).
파일:ease in bounce.png
  • ease in-out bounce.
파일:ease in out bounce.png

3.7. ease elastic [편집]

  • ease back과 비슷하지만, 한번에 돌아가는 게 아닌 주변을 왔다갔다 하다가 도착하는 ease함수 유형이다.
  • 이 함수의 경우 정확히 정해진 수식이 없기 때문에 서술하지 않았다.[18]
  • ease in elastic.
파일:ease in elastic.png
  • ease out elastic.
파일:ease out elastic.png
  • ease in-out elastic.
파일:ease in out elastic.png

4. 여담 [편집]

  • 사실 저 함수들 말고도 f(0)=0, f(1)=1을 만족하고 함수가 연속[19][20]이라면 Ease함수로 쓸 수 있다. 예를 들어 tan(45x)tan(45x).

5. 관련 문서 [편집]

[1] 보통은 초시계를 사용해 시간을 쓰지만, 일부귀찮은 경우 변수를 사용해 구현 할 수 있다.[2] 함수가 값을 받는 범위[3] 함수가 값을 뱉는 범위[4] back, elastic같은 일부 함수는 정의역이 살짝 넘어가기도 한다.[5] 범위 a~b에 있는 어떤 값x를 범위 c~d에 있는 값에 대입하는 것.[6] 도함수가 0~1 범위에서 증가함수다.[7] 도함수가 0~1 범위에서 감소함수다.[8] 이후 in-out 함수의 식은 생략 할 예정.[9] 순서대로 2,3,4,5,6.[10] 2가 아닌 다른값을 넣으면 다르게 움직인다. 클수록 극단적.[11] 원래는 90 대신 π2\frac{\pi}{2}를 사용해야 하지만 엔트리는 60분법을 쓰기 때문에 90이다.[12] 정의역이 0~1을 벗어난다.[13] s값을 바꾸면 움직임도 바뀐다. power과 동일하게 클수록 극단적.[14] 예제 작품에서는 곱하지 않았다.[15] 중심각이 90도인 부채꼴. 4개로 자른 피자조각[16] 편의상 out먼저 기술하였다.[17] 튕기는 부분이 전부 다른 함수여서 정의가 이렇다.[18] 주로 exp와 삼각함수를 섞어서 만든다.[19] 그래프가 이어져 있다는 뜻. 이러면 안된다는 거다.파일:불연속함수.png[20] 사실 연속이던 말던 쓸 수야 있지만 모션이 이상할거다.
파일:CC-white.svg 이 문서의 내용 중 전체 또는 일부는 문서의 r10 판에서 가져왔습니다. 이전 역사 보러 가기
별도로 명시하지 않은 경우, 내용은 CC0에 따라 사용할 수 있습니다.