※ 이전에 올라왔던 PPT(https://docs.google.com/presentation/d/1bj__Ei_35hYgkLkpQfm5pSKokUEO2LjWvDczfoU3MHY/edit#slide=id.gee3a1ce05a_0_452)를 기반으로 내용을 그대로 옮겼음을 알려드립니다.
관련 파일 첨부 :
각각의 티끌의 처음 프레임과 끝프레임만 잡아봅시다.
※ 참조 Scene : Asset/Scene/6/6_1.scene
준비물 : 스프라이트 이미지 1장 (스파크)
(예제 파일 참조 : Assets/Sprite/Sprite_FireSpark.png)
받침용 스프라이트 이미지 1장
(예제 파일 참조 : Assets/PropLayerSprite/PropLayerSprite_FireSparkLine.png)
티끌 5개의 위치를 처음(Start,0fps)과 끝(End,30fps)에
받침이미지에 그려준 화살표에 따라 Position값, Rotation키를 잡아줍니다.
처음(0fps)과 끝(30fps)를 키만 박을경우 화살표를 따라가지 않은채로 직선으로 가버립니다.
이때 화살표대로 따라 갈려면 어떻게 해야할까요?
중간프레임에 키를 추가적으로 잡아줌으로써 원하는 흐름대로 따라갑니다.
※ 참조 Scene : Asset/Scene/6/6_2.scene
지정한 위치를 잡아서
애니메이션 1프레임에서 30프레임 중간에
Position, Rotation키를 자연스럽게 잡아줍니다.
이렇게 티끌들이 원하는 곡선방향대로 갔습니다.
처음과 끝을 스케일값으로 잡아봅시다.
※ 참조 Scene : Asset/Scene/6/6_3.scene
티끌 5개 모두를 Scale쪽 Key 추가로 아래와 같이 잡습니다.
받침이미지를 끈상태에서. 스케일값으로 사라지는 효과까지 만들었습니다.
처음과 끝을 커브 보정하여 복사하여 다음프레임에 2번 붙여 넣읍시다.
※ 참조 Scene : Asset/Scene/6/6_4.scene
첫프레임을 Left Tangents > Constant, 끝프레임을 Right Tangents > Constant를 지정해주시고
전체선택하여 Ctrl+C 복사한다음 31프레임, 62프레임에도 Ctrl+V 붙여주시면 됩니다.
이후, Curves를 누르면서 방금 줬던 부분이 각지게 나왔는지 꼼꼼히 확인하셔야합니다.
그래서 플레이 돌려보고 다음과 같이 3번 나오면 정상적으로 키설정을 한겁니다.
3번 반복(루핑)해서 자연스럽게 나가는 티끌들을 만들어봅시다.
※ 참조 Scene : Asset/Scene/6/6_5.scene
다음과 같이 30프레임의 80%쯤되는 27프레임 이내에서 다음과 같이 각 오브젝트 부분을 드래그 해줍니다.
3번 연속 반복(루핑)되어 사라지는 티끌이 만들어졌습니다.
연속(루핑)해서 자연스럽게 나가는 티끌들을 만들어봅시다.
※ 참조 Scene : Asset/Scene/6/6_6.scene
두번째로 복사한 부분(31-62프레임)의 처음과 끝 나머지 잡지 않은 부분을 Add Key로 잡습니다.
이전 이후 프레임은 다 삭제하고 이 그뒤에는 첫프레임으로 드래그해주시면 됩니다.
처음과 끝 Anchored Position을 이렇게 되어 커브가 자연스럽지 않은 현상이 발생할수도 있습니다.
계속 Looping하더라도 자연스럽게 흐를수 있도록 Curve를 수정해줍니다.
전체적으로 꼼꼼히 살펴 보셔야합니다.
연속 루핑된 효과가 완성되었습니다.
그라데이션을 추가함으로써 더 디테일하게 만들어봅시다.
※ 참조 Scene : Asset/Scene/6/6_7.scene
준비물 : 스프라이트 이미지 1장
(예제 파일 참조 : Assets/Sprite/Sprite_Gradation.png)
마지막으로 이 그라데이션의 스프라이트를 준비합니다.
Root위에 Gradation이라는 GameObject를 추가하여 Image를 생성하고
Width, Height를 크게 주고 Image를 넣습니다. Color를 아래와 같이 설정하면됩니다.
Gradation 부분의 Alpha값만 Key 추가 하고 다음과 같이 그래프를 줍니다.
A값 0.30에서 0.35 이내로 주는게 적절합니다.
배경까지 덮은 좀더 디테일한 티끌 효과가 완성되었습니다.