Dotween이란?
Dotween은 빠르고 효율적이며 안전성을 갖춘 애니메이션 엔진으로, C#에 최적화되어 있습니다.
높은 수준의 유연성과 커스터마이징을 유지하면서 단순하고 사용하기 쉬운 것으로 잘 알려져 있습니다.
또한, Unity의 내장 애니메이션 및 tweening 시스템보다 더 빠르고 메모리를 적게 사용합니다.
Tween이란?
트위닝('Betweening'의 줄임말)은 두 상태 사이에 중간 프레임을 생성하여 모션이나 변형의 느낌을 주는 프로세스입니다.
이러한 전환은 게임 오브젝트를 한 지점에서 다른 지점으로 이동하거나 오브젝트의 크기, 색상, 회전을 변경하거나 시간에 따른 오브젝트 속성의 기타 변형 등 모든 것이 가능합니다.
DoTween에서는 스크립트를 이용해 애니메이션을 적용하려는 오브젝트에서 메서드를 호출하고 종료 상태와 지속 시간을 지정하기만 하면 간단하게 트윈을 생성할 수 있습니다.
예를 들어, 게임 오브젝트를 3초 동안 새로운 위치로 이동하려는 경우 다음과 같이 작성할 수 있습니다.
transform.DOMove(newPosition, 3);이렇게 하면 DoTween이 오브젝트를 현재 위치에서 3초 동안 새로운 위치(newPosition)로 이동하는 트윈을 생성하도록 지시합니다.
Sequence란?
시퀀스는 여러 개의 트윈(Tween)을 연결하여 복잡한 애니메이션을 만들 수 있는 DoTween의 강력한 기능입니다.
DoTween의 시퀀스는 트윈 목록을 보유하고 지정된 순서로 실행하는 객체입니다.
트윈 사이의 지연을 지정하고, 중첩된 시퀀스를 만들고, 시퀀스를 반복, 일시 중지, 다시 시작할 수도 있습니다.
시퀀스를 만들려면 먼저 아래 함수를 호출하여 새 시퀀스 객체를 생성해야 합니다.
DOTween.Sequence();그런 다음 Append(), Prepend(), Insert(), Join() 등의 메서드를 사용하여 시퀀스에 트윅을 추가할 수 있습니다.
예를 들어 다음과 같이 작성할 수 있습니다:
Sequence mySequence = DOTween.Sequence();
mySequence.Append(object1.DOMove(newPosition1, 1));
mySequence.Append(object2.DOMove(newPosition2, 2));시퀀스의 주요 이점 중 하나는 많은 개별 트윈을 관리할 필요 없이 복잡한 애니메이션을 쉽게 만들 수 있다는 것입니다.
모든 것을 시퀀스에 넣으면 하나의 오브젝트로 전체 애니메이션을 제어할 수 있습니다.
따라서 코드를 더 깔끔하고 관리하기 쉬우며 효율적으로 만들 수 있습니다.
Dotween 대표 기능들에 대해
dotween기능들에는 앞서 언급한 트위닝, 시퀀스기술 외에도 Ease Functions, Looping and Yoyo연출, 이벤트 및 콜백 등의 기능들이 많이 탑재되어 있습니다.
전부 소개드리기엔 글이 너무 길어지므로 핵심 몇 가지만 뽑아서 소개드리고자 합니다.
Dotween Pro를 사용해야하는 이유
DoTween Pro의 비주얼 에디터를 사용하면 Unity 에디터 내에서 바로 애니메이션을 설정할 수 있습니다.
코드 작성에 익숙하지 않거나 애니메이션을 빠르게 프로토타이핑해야 하는 경우 특히 유용합니다.
Pro버전이 아닌 무료버전의 경우 인스펙터를 통해 트윈을 컨트롤할 수 없으며 순수 코딩을 통해 트윈들을 관리해야 합니다.
Pro버전의 경우 인스펙터에서 클릭 몇 번만으로 긴 코드줄 없이 쉽게 애니메이션을 실행시킬 수 있으며 드래그 앤 드롭 기능으로 이벤트 또한 관리할 수 있습니다.
아래 내용부터는 전부 Pro 버전 기준으로 설명되어있습니다.
Dotween Animation
큐브와 Dotween Pro를 이용해서 다양한 Animation효과를 연출해 보겠습니다.
먼저 DOTween Animation컴포넌트를 추가해 줍니다!
DOTween Pro의 경우 앞서 언급한 내용처럼 코딩 없이 인스펙터 내에서 tween들을 컨트롤할 수 있으며 런타임이 아닌 에디터 환경에서 바로 테스트할 수 있는 기능이 탑재되어 있습니다!!
DOTween Animation의 Play버튼을 누르면 됩니다!! 이때 주의할 점은 AutoPlay기능이 활성화되어 있어야 합니다.
DOTween Animation컴포넌트에는 다양한 기능이 있습니다.
예를 들어, Move, Scale, Rotation, Color 등을 컨트롤할 수 있는 기능들이 있습니다.
다양한 예시
Dotween Path 기능은 잘 쓰면 정말 유용한 기능입니다. 씬 뷰에서 Path를 실시간으로 확인할 수 있는 기능도 있으며 그 외 많은 기능이 있으니 꼭 살펴보시면 좋을 것 같습니다!
여담으로 저는 모든 프로젝트 시작할 때 Dotween Pro는 꼭 설치하고 시작합니다!
제 프로젝트를 보신 분들은 아시겠지만 오브젝트의 동적인 움직임을 추가할 때 무조건 Dotween Pro를 사용합니다!
DoPlay() DoReStart()
DOTween Animation를 사용하기 위해서는 DOPlay(), DORestart() 함수와 같이 숙지해야 하는 개념들이 존재합니다!
DOPlay() 같은 경우에는 1회 최초 실행 이후 재반복이 안되며
DORestart()는 반복적으로 사용이 가능합니다!
AutoPlay 같은 경우 게임이 실행되면 자동으로 DOTween Animation컴포넌트를 실행시켜 주는 트리거이며
AutoKill은 트윈 애니메이션이 끝나면 자동으로 트윈을 삭제해 주는 역할입니다!(메모리 관리 차원에서)
DOTween Animation 혼합
만약 오브젝트를 움직임과 동시에 스케일을 키우고 싶다면 DOTween Animation컴포넌트를 2개 시용하시면 됩니다!
Ease Functions, 애니메이션 동작 관련
Ease Functions은 애니메이션 시스템의 핵심 기능 중 하나입니다.
시간 경과에 따라 전환이 발생하는 속도를 정의합니다.
SetEase() 메서드를 사용하여 트윈에 easing functions를 적용할 수 있으며, 선형, 사인 곡선, 지수, 바운스, 탄성 함수 등 다양한 내장 이완 함수를 사용할 수 있습니다.
Pro의 경우 스크립트 없이 이조차 인스펙터에서 컨트롤할 수 있습니다.
Easing Functions Cheat Sheet
Easing functions specify the speed of animation to make the movement more natural. Real objects don’t just move at a constant speed, and do not start and stop in an instant. This page helps you choose the right easing function.
easings.net
Eese Functon에는 In/Out 키워드가 존재하는데 다음과 같습니다!
- In : 애니메이션 뒷부분에서 변화가 크게 일어남
- Out : 애니메이션 앞부분에서 변화가 크게 일어남
무한반복
Loops 에 -1을 넣으면 무한반복이 됩니다!
무한반복의 경우 3가지의 유형이 존재합니다!
- Restart : 애니메이션이 종료되면 다시 처음 포지션으로 돌아감
- Yoyo : 처음~끝 부분을 요요처럼 왔다 갔다 함, 0에서 1을 향했다면 다시 1에서 0을 향하는
- Incremental : 끝난 부분을 원점으로 다시 잡고 시작함, 스케일 같은 경우 1만큼 증가시켰다면 스케일이 1->2->3 이렇게 됨
ID를 통한 관리
ID를 통해 트윈을 관리할 수 있습니다!
DoKillAllById을 이용하여 해당 ID를 가진 Tween을 삭제할 수 있으며
DOPlayAllById을 이용하여 해당 ID를 가진 Tween 애니메이션을 실행시킬 수 있습니다!
Dotween Pro에는 이 외에도 Events, Dotween Animation Manager 등 수많은 기능들이 존재하므로 꼭 경험해 보셨으면 좋겠습니다.
구매 링크
이 글은 어필리에이트 링크를 포함하고 있습니다.
위 링크를 클릭하셔서 애셋을 구매하시면 저에게 수수료가 제공됩니다.
링크를 클릭하는 것으로는 수익이 발생하지 않습니다!
감사합니다!