!!
#풍차
풍차 프로젝트는 Spine 기본형과 Spine 전문가형에서 등축 투영법을 모델링하는 방법을 보여줍니다. 이 프로젝트는 등축 회전을 실행하고, 간단한 연기 효과를 나타내고, 구성 요소와 해당 애니메이션을 복제하여 변형을 추가하는 방법을 보여줍니다.
## 동영상
[youtube:kUi7ODUmQes]
이 프로젝트의 다운로드에는 시간 순으로 번호가 매겨진 7개의 `.spine` 파일이 들어있어서 동영상을 따라 할 수 있습니다.
## 나무, 덤불 및 꽃
### 설정
각 나무는 줄기(`tree1-trunk`와 `tree2-trunk`)를 나타내는 [슬롯](/spine-basic-concepts#Slots)과 줄기의 가지(`leaves`~`leaves8`)에 붙어 있는 각각의 나뭇잎 묶음에 대한 하나의 뼈로 구성되어 있습니다. 당사는 나무줄기를 애니메이션화하지 않기 때문에, 줄기 슬롯은 루트 뼈의 직계 자식이며 두 개의 뼈가 덜 듭니다.
덤불은 각각 하나의 슬롯과 어태치먼트가 있는 각각 하나의 뼈(`bush1`과 `bush2`)로 구성됩니다.
꽃은 좀 더 복잡합니다. 꽃은 각각 뼈 체계와 꽃의 그림자, 줄기의 아래쪽에 앞면과 뒷면 나뭇잎, 줄기 자체 및 위쪽에 꽃잎을 모델링하는 슬롯으로 구성됩니다. 꽃잎 슬롯에는 복제된 꽃을 맞춤 설정할 때 다양한 꽃잎 모양을 선택할 수 있는 3가지 이미지가 있습니다. 또한 당사는 슬롯 색상을 변경하여 부가적인 다양성을 추가합니다.
### 애니메이션
나무는 각 나뭇잎 묶음의 [회전](/spine-key-frames#Rotation)에만 키를 설정하여 애니메이션화됩니다. 설정 위치는 애니메이션의 시작과 끝부분에 키가 설정되며, 그 사이에 변형이 이루어져 끊어짐이 없이 아주 매끄럽게 반복되는 애니메이션이 만들어집니다.
덤불은 [기울이기](/spine-tools#Shear-tool) 속성만 키를 설정함으로써 애니메이션화됩니다. 이렇게 하면 덤불이 땅에 붙은 채로 변형됩니다. 나무 잎과 마찬가지로 기울이기 값은 애니메이션의 시작과 끝부분에 키가 설정되어 끊어짐이 없이 아주 매끄러운 루프가 만들어지며 그 사이에 변형이 이루어집니다.
모든 기본 키를 설정한 상태에서 모든 키를 선택하고 [그래프 보기](/spine-graph)에서 곡선을 적용하여 키 사이의 곡선을 변경했습니다. 애니메이션이 약간 덜 동기화되도록 하기 위해 [오프셋 툴](/spine-dopesheet#Key-Offset)을 키 그룹에 사용했습니다.
## 수탉
이 수탉은 집 지붕 위에 있는 장식품입니다. 수탉은 금속으로 만들어졌으며 바람에 흔들릴 수 있습니다. 이 장면에는 등축 뷰가 있으므로 수탉은 등축 투영법에 따라 수직축을 중심으로 회전해야 합니다.
### 설정
수탉은 길이가 0인 뼈 한 개와 수탉의 정면도를 영역 어태치먼트로 포함하고 있는 슬롯으로 구성됩니다.
### 애니메이션
수탉은 Y축의 기울이기 속성 키를 설정함으로써 애니메이션화됩니다. 끊어짐이 없이 아주 매끄러운 루프를 만들기 위해 기울이기 값이 첫 번째 프레임과 마지막 프레임에 키가 설정되며 그 사이에 변형이 이루어집니다.
## 풍차 날개
회전 날개는 구성 요소의 주요 초점입니다. 회전 날개는 날개 기본 이미지인 `windmill-blades`와 날개의 앞면을 구성하는 두 개의 긴 목재 부분, `windmill-blades-wood-h`와 `windmill-blades-wood-v`로 구성됩니다. 모든 이미지는 앞면으로 준비되어 있지만 장면의 등축 투영법에 따라 회전합니다.
### 설정
정확한 등축 회전을 위해서는 등축 투영법에 맞게 날개를 변형시키는 `windmill-blades-pivot` 뼈와 실제로 회전을 하는 `windmill-blades-front`(및 `windmill-blades-back`) 뼈가 필요합니다.
!!
[등축 투영법](https://design.tutsplus.com/tutorials/how-to-create-advanced-isometric-illustrations-using-the-ssr-method--vector-1058)은 이미지를 `0.86`으로 크기를 조정한 다음 `30°`의 기울이기를 적용함으로써 얻을 수 있습니다. 이는 정사각형에 효과적이지만 날개가 육각형에 붙어 있기 때문에 당사는 대신 `20°`의 기울이기를 사용합니다.
!!
Spine에서 자식은 부모 뼈의 변형을 상속받습니다(뼈의 속성에서 상속을 비활성화한 경우 제외). 부모 뼈에 `0.86`의 크기 조정과 `20°`의 기울이기를 적용하면 그 변형이 자식에게도 적용됩니다. 그러므로 당사는 등축 투영법 변형을 `windmill-blades-pivot` 부모 뼈에 적용할 수 있으며, 뼈의 자식에 영향을 미칩니다.
날개에 입체감을 더 주기 위해 앞과 뒤를 두 개의 뼈, 즉 `windmill-blades-back`과 `windmill-blades-front`로 분리한 후 약간 오프셋했습니다.
### 애니메이션
Spine에서 [완전한 회전](/spine-key-frames#Rotation)을 얻기 위해 당사는 애니메이션의 시작과 끝부분에 뼈의 회전을 `0°`로 키를 설정합니다. 그런 다음 두 개의 키 프레임을 하나는 애니메이션 길이의 1/3에, 다른 하나는 2/3에 같은 간격으로 설정합니다. 완전한 스핀에는 `360°`가 필요하므로 회전은 각 키 프레임에서 `120°`씩 증가됩니다.
!!
두 개의 뼈 `windmill-blades-back`과 `windmill-blades-front`는 모두 이 원리에 따라 회전합니다.
`미리 보기`의 도움말을 이용하여 날개의 입체감 효과를 `설정` 모드에서 조정했습니다.
## 연기
연기는 굴뚝에서 나와 먼 곳으로 사라집니다.
### 설정
당사는 구름 이미지를 3개의 뼈(`smoke`~`smoke3`)에서 재사용하여 약간의 연기 흔적을 만들어 냅니다.
###애니메이션###
연기 움직임은 이동, 회전, 크기 조정 및 [색상 키](/spine-key-frames#Color)의 조합입니다.
회전하는 동안 연기는 지붕에서 오른쪽 상단으로 이동합니다. 연기는 작게 시작되어 위로 움직이고 오른쪽으로 움직일수록 더 커집니다. 또한 연기가 나타나고, 움직이고, 결국 은은하게 사라지면 연기의 투명도가 바뀝니다.
애니메이션은 처음에는 하나의 연기 뼈에 대해 생성된 다음 복사 및 오프셋되었습니다. 오프셋을 가능하게 하려면 첫 번째 프레임과 마지막 프레임이 일치해야 합니다.
