[Cocos Creator] Spine 정복하기(1) - 기본 프로퍼티

Spine

스파인은 게임에서 사용하는 2D 애니메이션 툴입니다. 디자인을 작업하시는 분이 스파인 툴로 애니메이션을 만들고 그것을 게임에 사용하여 기존 애니메이션 보다 훨씬 효율적이고 부드럽게 동작을 하게됩니다.

스파인의 장점은 아래와 같습니다.

- 작은 용량: 기존 애니메이션은 애니메이션의 각 프레임마다 이미지가 필요합니다. Spine 애니메이션은 용량이 매우 작은 뼈대 데이터만을 저장하며 이는 독특한 애니메이션이 많이 있는 게임을 만들 수 있도록 해줍니다. - 그림 파일 요구량: Spine 애니메이션은 필요한 그림 파일이 훨씬 적기 때문에 게임에 들어가는 시간과 비용을 현저히 줄일 수 있습니다. - 부드러움: Spine 애니메이션은 보간법을 사용하기 때문에 항상 프레임 속도에 맞춰 부드럽습니다. 애니메이션은 품질의 저하 없이 슬로우 모션으로 재생할 수 있습니다. - 어태치먼트: 뼈에 붙은 이미지를 다른 아이템과 효과에 어울리도록 바꿀 수 있습니다. 다르게 생긴 캐릭터에도 애니메이션을 다시 사용할 수 있어 소중한 시간을 아낄 수 있습니다. - 믹싱: 애니메이션을 서로 블렌딩할 수 있습니다. 예를 들어 캐릭터는 걷거나 뛰면서, 또는 수영을 하면서 사격을 할 수 있습니다. 한 애니메이션에서 다른 애니메이션으로 바꿀 때 부드럽게 크로스페이드할 수 있습니다. - 자연스러운 애니메이션: 코드를 통해 뼈를 다룰 수 있어 마우스가 있는 곳으로 사격을 하거나 근처에 있는 적을 향해 움직일 수 있으며 언덕을 오를 때 앞으로 기울일 수 있습니다.

그럼 Cocos creator 를 이용하여 스파인 애니메이션을 사용하는 방법을 알아보도록 하겠습니다. 

프로젝트생성

스파인 애니메이션을 동작하려면 3개의 파일이 필요합니다.

.json 파일: 스켈레톤(뼈대)을 움직이는 애니메이션 데이터

.png 파일: atlas 이미지

.atlas 파일: atlas 데이터

이 3개파일만 있으면 스파인 애니메이션을 사용 할 수 있게 됩니다. 3개의 파일중 JSON 파일을 노드트리에 드래그하거나 빈 노드를 만들고 sp. Skeleton 컴포넌트를 추가하여 JSON 파일을 매핑시켜줍니다.

프로퍼티

sp.Skeleton 은 다음과 같은 프로퍼티를 가집니다.

- Skeleton Data: Object 매핑된 JSON 파일 정보가 담겨있습니다. 여기에는 bone 이라던지 slot, 스킨, 이벤트 등 여러 정보들을 확인할 수 있습니다. - Default Skin: String 현재 설정된 스킨의 이름입니다. 값은 string 으로 되어있고 빈 String 으로 설정했을 시 default 로 설정됩니다. - Animation: String 현재 설정된 애니메이션의 이름입니다. 값은 string 으로 되어있고 빈 String 으로 설정했을 시 <None>로 설정됩니다. - Loop: Boolean 현재 실행하고있는 애니메이션을 반복할지의 여부입니다. true 일 때 애니메이션이 반복실행됩니다. - Premultiplied Alpha: Boolean Premultiplied Alpha Blending 알고리즘??(RGB값에 Alpha값이 적용되어 이미지를 깨끗하게 보여주는 기법) 을 사용할지에 대한 여부입니다. 기본값은 true 입니다. - Time Scale: Number 애니메이션 속도입니다. 최소 0부터 시작하고 기본값은 1입니다. 0일 때는 애니메이션이 실행되지 않습니다. - Debug Slots: Boolean 부위별로 지정된 모든 슬롯의 위치와 크기를 나타냅니다. 개발할 때 용이합니다. - Debug Bones: Boolean 부위별로 지정된 모든 뼈대를 나타냅니다. 개발할 때 용이합니다.