Spine 4.2: 피직스 혁신

April 27th, 2024

새로운 Spine 4.2 릴리스를 알려드리게 되어 매우 기쁘게 생각합니다! 수많은 새로운 기능이 있으며 그중 많은 기능은 10여 년 전 Spine의 첫 릴리스 이후부터 소망해왔습니다. 이제 새로운 많은 기능들이 이번 릴리스에 포함되어 있습니다!

가장 중요한 부분을 한번 살펴보겠습니다!

피직스

Spine의 피직스는 정말 획기적입니다! 이제 Spine은 실세계의 피직스를 시뮬레이션하여 뼈를 자동으로 움직이게 할 수 있습니다. 애니메이션을 더 멋지게 보이게 하면서도 많은 시간을 절약할 수 있습니다!

그녀를 이리저리 드래그해 보세요!

더 이상 머리카락, 옷, 기타 아이템의 보조 모션을 힘들게 애니메이팅할 필요가 없습니다. 자연스럽게 움직이는 모든 것은 피직스를 사용하여 자동으로 움직이게 할 수 있습니다.

시간을 절약하는 것 외에도 피직스는 역동적인 움직임도 제공합니다. 피직스는 애니메이션 전체와 게임 월드에서 캐릭터의 움직임 모두에서 유동적이고 현실적으로 반응합니다.

PSD 가져오기

이제 Spine은 PSD 파일을 직접 읽어 아트를 가져올 수 있습니다. 이렇게 하면 Adobe Photoshop에서 벗어나 PSD 파일을 저장할 수 있는 모든 이미지 편집기를 사용할 수 있습니다.

더욱이, 이 기능은 PhotoshopToSpine 스크립트보다 약 10배 더 빠릅니다!

픽셀 모드

픽셀 아트에 Spine을 사용할 때 새로운 픽셀 모드는 영역 어태치먼트를 화면 픽셀과 일치하도록 이동시킵니다. 이를 통해 어태치먼트가 픽셀 단위로 떨어져서 흐릿해지는 것을 방지할 수 있습니다.

화면 픽셀과 일치하지 않는 어태치먼트를 강조 표시하는 새로운 픽셀 강조 표시 단축키도 있습니다. 이를 통해 어태치먼트가 흐릿해지는 부분을 쉽게 확인하여 수정할 수 있습니다.

제약 조건 관리

4.2에서는 많은 제약 조건이 있는 프로젝트에 다음의 여러 가지 개선 사항을 제공합니다.

  • 제약 조건을 복제하면 모든 뼈를 복제할지 묻는 메시지가 표시됩니다. 예를 들어 팔다리를 설정할 때 이렇게 하면 많은 시간을 절약할 수 있습니다.
  • 여러 제약 조건을 선택한 경우 이제 제약 조건을 모두 동시에 변경할 수 있습니다.
  • 제약 조건을 복사하여 다른 스켈레톤에서도 설정을 다른 제약 조건에 붙여 넣을 수 있습니다.
  • 제약 조건에서 각각의 뼈를 추가하거나 제거할 수 있습니다.
  • 믹스를 변경하지 않고도 가시점을 통해 제약 조건을 해제할 수 있습니다.

가중치 툴

새로운 결합 기능은 메쉬 전체의 가중치를 일치시켜 효과적으로 함께 결합합니다. 이를 통해 여러 메쉬가 마치 하나의 이미지인 것처럼 동일하게 변형할 수 있습니다.

여러 메쉬를 원활하게 사용하는 데 적합하지만, 결합 기능을 사용하면 옷, 얼굴 표정, 클리핑 어태치먼트 등을 추가할 때 기존 가중치를 적용할 수 있어 시간도 절약할 수 있습니다.

마지막으로, 이제 다른 메쉬에서도 다른 정점에 가중치를 복사하여 붙여 넣을 수 있습니다.

루핑 곡선

이제 루핑 애니메이션의 첫 번째와 마지막 키의 곡선 핸들이 동기화됩니다. 때로는 사소한 것에서 많은 시간을 절약할 수 있습니다!

폴더

그리기 순서 폴더를 사용하면 큰 스켈레톤의 슬롯을 정리할 수 있습니다. 여러 개의 개별 슬롯이 아닌 폴더를 드래그하여 그리기 순서를 조정할 수 있습니다.

제약 조건 폴더를 사용하면 복잡한 스켈레톤을 보다 쉽게 관리할 수 있습니다. 폴더를 마우스 가운데 버튼으로 클릭하여 모든 하위 항목을 선택합니다.

루트 모션

spine-unity 런타임에서 루트 모션을 수행할 수 있습니다!

일반적으로 제자리에서 걷기 반복을 애니메이팅한 다음 런타임에서 코드가 게임 월드 내내 정확한 속도로 움직이게 합니다. 발을 끌며 걷는 좀비처럼 움직임이 복잡한 경우 코드가 애니메이션을 일치시키는 것은 매우 어렵습니다.

루트 모션을 사용하면 걷기 반복이 움직임과 함께 애니메이팅됩니다. 런타임에서 애니메이션의 움직임을 제거하여 이를 게임 월드 위치에 적용합니다. 그 결과 게임 월드 내내 움직임은 애니메이션과 완벽하게 일치합니다.

훨씬 더 향상된 루트 모션 델타 보정 기능을 사용하면 점프 애니메이션의 거리를 완벽하게 조정할 수 있습니다. 이런 방식으로 애니메이터는 Spine에서 점프 동작을 신중하게 디자인할 수 있으며 프로그래머는 여전히 게임 월드에서 점프가 실제로 얼마나 멀리 움직이는지 제어할 수 있습니다.

새로운 런타임

4.1 릴리스 이후 수많은 새로운 런타임이 추가되었습니다!

spine-godot을 통해 가장 인기 있는 오픈 소스 게임 엔진에 대한 런타임을 구현했습니다.

보다 직접적인 접근 방식을 선호하는 분들을 위해 spine-c 또는 spine-cpp 런타임과 함께 사용할 수 있는 spine-sdl을 만들었습니다.

spine-flutter를 통해 모바일 앱으로의 진출을 시작했습니다. 곧 더 많은 런타임이 출시될 예정입니다!

spine-phaser 런타임은 기존 Phaser Spine 플러그인을 완벽하게 대체합니다. Phaser용 Spine 런타임을 직접 제공함으로써 적시에 업데이트할 수 있고 Phaser 팀의 부담을 줄일 수 있습니다.

최근에는 spine-haxe를 아스널에 추가했습니다. 이는 OpenFL/Lime 외에 Starling과 함께 사용할 수 있습니다. OpenFL 외에도 HaxeFlixel과 같은 다른 프레임워크도 지원할 계획입니다.

새로운 런타임 목록의 마지막 항목은 PixiJS용 공식 Spine 런타임인 spine-pixi입니다. Spine-phaser와 마찬가지로 저희는 사용자가 공식 지원을 통해 적시에 업데이트를 받을 수 있도록 하려고 합니다.


이러한 런타임은 프로덕션에 바로 사용할 수 있으며 시작하는 데 도움이 되는 다양한 코드 예제가 포함되어 있습니다. 현재 각 설명서를 완성하는 작업을 진행 중이며, 앞으로 몇 주 내에 준비될 예정입니다.

언리얼 엔진 5.3 지원

언리얼 엔진 5.3에서 에픽은 에셋 처리 방식을 변경했습니다. 더 이상 같은 폴더에 이름은 같지만 유형이 다른 두 개의 에셋이 있을 수 없습니다.

따라서 이제 스켈레톤 데이터 파일(.skel 및 .json)과 아틀라스 파일의 접두사가 다른지 확인해야 합니다. 예를 들어, skeleton-data.skel과 skeleton.atlas입니다. 또는 스켈레톤 데이터와 아틀라스 파일을 별도의 폴더에 넣을 수도 있습니다.

또한 언리얼은 이전 언리얼 엔진 버전에서 생성된 에셋에 대한 spine-ue의 적절한 액세스 권한을 허용하지 않습니다. 이는 자동화된 업그레이드 경로를 제공할 수 없음을 의미합니다. 프로젝트를 언리얼 엔진 5.3으로 마이그레이션하려면 에셋을 수동으로 재생성하고 다시 연결해야 합니다.

유니티(Unity)

유니티에서는 기본적으로 모든 트랜스폼 이동이 스켈레톤의 피직스 제약 조건과 완벽하게 통합됩니다. 스켈레톤을 이리저리 움직이기만 하면 피직스가 적절하게 반응합니다. 기본 설정이 부족하다면 피직스 상속 설정을 조금만 변경하면 됩니다. 새로운 피직스 제약 조건 예제 신(scene)을 놓치지 마시고 해당 스켈레톤을 잘 흔들어 주세요.

SkeletonGraphic 컴포넌트에도 새로운 기능이 추가되었습니다. 스켈레톤을 RectTransform 경계에 자동으로 맞추도록 새로운 레이아웃 크기 조정 모드를 설정할 수 있습니다. 또한 SkeletonGraphic이 잘못 표시되거나 올바른 인스펙터 및 머티리얼 설정을 찾는 데 어려움을 겪은 적이 있으신가요? 새로운 자동 감지 버튼 덕분에 이제 그런 시절은 끝났습니다! 새로 확장된 머티리얼 세트에서 올바른 머티리얼을 자동으로 할당하는 머티리얼 감지 버튼도 있습니다.

셰이더 개선 없이는 어떤 릴리스도 완벽하지 않을 것입니다. 이제 모든 Spine URP 및 Spine/Sprite 셰이더에서 틴트 블랙(Tint Black)을 지원하고 이번 업데이트를 마무리하기 위해 URP 블렌드 모드 셰이더를 추가했습니다.

기타 런타임 변경 사항

모든 런타임에서는 새로운 편집기 기능을 모두 지원하며 프로덕션에 바로 사용할 수 있습니다! 게임 엔진 및 언어별 변경 사항은 Spine 런타임 변경 로그를 참조하세요.

피직스가 추가됨에 따라 다음의 몇 가지 API를 변경해야 했습니다.

  • 이제 Skeleton.updateWorldTransform()에서는 피직스가 업데이트되고 적용될 때 제어하기 위해 추가 피직스 매개변수를 사용합니다. 대부분의 경우 Physics.update를 사용할 것입니다.
  • 피직스 시뮬레이션을 구동하려면 피직스 코드에서 시간이 얼마나 지났는지 알아야 합니다. 이 정보는 각 스켈레톤에 저장됩니다. 프레임 시간이 앞당겨진 경우 Skeleton.update(deltaTime)를 호출하여 스켈레톤에 알려야 합니다.
  • TransformMode를 상속으로 이름을 변경했습니다. 트랜스폼 모드를 수동으로 설정하지 않는 한 이 변경 사항은 코드 베이스에 영향을 미치지 않습니다.
  • TrackEntry.attachmentThreshold를 TrackEntry.mixAttachmentThreshold로, TrackEntry.drawOrderThreshold를 TrackEntry.mixDrawOrderThreshold로 이름을 변경했습니다.

이러한 API 변경 사항 외에도 Spine 런타임 4.2를 사용하려면 Spine 편집기 4.2로 스켈레톤을 다시 내보내야 합니다. 자세한 내용은 Spine 버전 관리 가이드를 참조하세요.

다음으로

저희는 Spine 4.2에 매우 만족하고 있습니다! 새로운 기능은 사용하기 쉽지만 매우 강력합니다. 피직스는 많은 시간을 절약하는 동시에 역동적인 움직임으로 애니메이션을 개선하는 게임 체인저입니다.

이와 같은 대규모 릴리스 후에는 개선과 삶의 질 향상을 통해 소규모 릴리스를 진행하려고 합니다. 4.3에서는 워크플로를 간소화하는 데 중점을 둘 것입니다. 목표는 일반적인 작업을 수행하는 데 필요한 노력을 줄여 시간을 절약하는 것입니다.

문제를 보고하시고, 베타 버전을 테스트하시고, 새로운 기능을 만드는 데 도움이 되는 제안과 피드백을 보내주신 커뮤니티의 모든 분들께 감사드립니다. 여러분의 의견은 매우 소중합니다!

즐겁게 애니메이팅하세요!
– Spine 팀

Spine 포럼에서 이 게시물에 대해 토론해 보세요.

Import PSDs directly, no Photoshop scripts needed

February 24th, 2024

We've just released Spine 4.2.10-beta where we've added the ability for the Spine editor to process PSDs directly. This is great for many reasons:

  • You are no longer forced to use Photoshop -- use any image editor that can save a PSD file.
  • All the tags from the PhotoshopToSpine script are supported.
  • It is much faster! On a large PSD (200MB, 215 layers) it finishes in about 25% of the time (6 seconds versus 23) compared to the PhotoshopToSpine script.
  • Process the PSD and import it into Spine in one step.

To try it out, go to Import Data and choose a PSD file:

There are other great things in the 4.2.10-beta changelog:

  • Constraint folders make it easier to use and organize many constraints, especially great for physics.
  • Draw order folders make it easier to organize your slots so you don't have one very long list to deal with.
  • Lots of important fixes and improvements.

Quick overview of the new Spine PSD Import and Slot and Constraints folders:

Jump over to the Spine forum to discuss this post!

새로운 셸 스크립트로 내보내기

February 15th, 2024

Spine 내보내기 프로세스 간소화

새로운 쉘 스크립트를 사용하여 모든 프로젝트를 한 번에 내보낼 수 있습니다! 스크립트는 .spine 프로젝트 파일을 검색하고 찾은 각 프로젝트를 내보냅니다. 각 프로젝트는 프로젝트 파일 옆에 내보내기 설정 파일을 배치하여 다른 내보내기 설정을 사용할 수 있습니다. 스크립트를 사용하여 내보내면 다음과 같은 많은 이점이 있습니다.

  • 원하는 만큼의 프로젝트 파일을 한 번에 내보낼 수 있습니다.
  • 내보내기에서는 항상 올바른 설정을 사용합니다. 매번 올바른 설정을 사용하기 위해 애니메이터에게 의존할 필요가 없습니다.
  • 소프트웨어의 빌드 프로세스에서 내보내기 스크립트를 실행하여 모든 빌드에 항상 최신 내보내기 파일이 포함되도록 할 수 있습니다. 애니메이터는 프로젝트 파일을 변경할 때마다 내보내기를 수행하는 것을 기억할 필요가 없습니다.
  • 최신 Spine 버전으로 업데이트하는 경우 모든 프로젝트를 다시 내보내야 합니다. 내보내기 스크립트가 설정되어 있으면 이 작업은 매우 쉽습니다!

시작하기

다음은 스크립트 사용 방법을 보여주는 동영상입니다. 또는 본문의 단계별 설명을 계속 읽어보세요.

내보내기 스크립트 다운로드

운영 체제에 맞는 다음의 스크립트를 다운로드합니다.

spine-scripts GitHub 저장소에서 스크립트에 대한 자세한 내용을 확인할 수 있습니다.

스크립트 구성

텍스트 편집기로 스크립트를 열면 상단에 Customization Section (사용자 지정 섹션)이 있습니다. 다음은 spine-export.bat에서 발췌한 내용입니다(spine-export.sh는 매우 유사합니다).

스크립트를 실행하기 전에 다음의 3가지 설정을 먼저 검토해야 합니다.

  1. SPINE_EXE Spine 실행 파일의 경로입니다. 여기에서 Spine을 찾을 수 없는 경우 스크립트는 다른 일반적인 설치 위치를 찾습니다.

  2. VERSION 내보내기를 수행하는 데 사용할 Spine 편집기의 버전입니다. Spine 편집기와 런타임 버전을 동일하게 유지하는 것은 매우 중요합니다.

  3. DEFAULT_EXPORT 스크립트는 Spine 프로젝트와 동일한 폴더에서 내보내기 설정 JSON 파일을 찾습니다. 해당 파일을 찾을 수 없는 경우 여기에 지정된 내보내기 설정이 사용됩니다. 다음의 일반적인 기본 설정에 대한 4가지 단축키가 있습니다: json, json+pack, binary 또는 binary+pack. 또는 내보내기 설정 파일의 경로를 지정할 수도 있습니다(이에 대한 자세한 내용은 아래 참조).

스크립트 실행

Windows

Windows에서는 스크립트를 실행하는 다음의 몇 가지 방법이 있습니다.

  1. spine-export.bat 파일에 폴더를 끌어서 놓습니다.
  2. spine-export.bat 파일을 두 번 클릭하여 CMD 창을 연 다음 경로를 입력하거나 붙여 넣거나, 또는 폴더를 CMD 창으로 끌어서 놓습니다.
  3. CMD 프롬프트에서 spine-export.bat 파일을 실행한 다음 경로를 입력하거나 붙여 넣거나, 또는 폴더를 CMD 창으로 끌어서 놓습니다.
  4. 경로를 첫 번째 매개변수로 사용하여 CMD 프롬프트에서 spine-export.bat 파일을 실행합니다.
spine-export.bat path\to\spine\project\folder

스크립트는 지정된 폴더와 모든 하위 폴더를 검색합니다. .spine 파일을 찾으면 내보내기를 수행합니다.

macOS 또는 Linux

macOS 또는 Linux에서는 spine-export.sh를 실행하기 전에 먼저 macOS 또는 Linux에 실행 권한을 부여해야 합니다. 터미널을 열고 스크립트가 있는 디렉터리로 이동한 다음 아래 명령을 사용하여 실행 권한을 부여합니다.

chmod +x spine-export.sh

스크립트를 실행하려면 ./spine-export.sh와 내보내려는 Spine 프로젝트가 포함된 디렉터리 경로를 지정합니다. 예를 들면:

./spine-export.sh /path/to/spine/projects/directory/

스크립트를 실행할 때 경로를 지정하지 않으면 스크립트는 경로를 입력하라는 메시지를 표시됩니다.

스크립트는 지정된 디렉터리와 모든 하위 디렉터리를 검색합니다. .spine 파일을 찾으면 내보내기를 수행합니다.

설정 내보내기

자세한 내보내기 설정을 지정하려면 내보내기 설정 JSON 파일을 준비해야 합니다.

내보내기 설정 저장

Spine 편집기의 내보내기 대화 상자에는 현재 내보내기 설정을 JSON 파일로 저장하는 Save (저장) 버튼이 왼쪽 하단에 있습니다.

저장된 내보내기 설정 파일의 확장자는 ".export.json"입니다.

내보내기 설정에서 Pack (패킹)을 선택한 경우에는 텍스처 패커 설정도 .export.json 파일에 저장됩니다.

기본 내보내기 설정

텍스트 편집기로 스크립트 파일을 열고 DEFAULT_EXPORT 값을 .export.json 파일의 경로로 변경합니다. 예를 들면:

DEFAULT_EXPORT=/path/to/default.export.json

이 설정은 프로젝트 파일 옆에 .export.json 파일이 없는 경우에 사용됩니다.

내보낸 파일은 기본 .export.json 파일의 출력 경로가 아닌 Customization Section (사용자 지정 섹션)의 DEFAULT_OUTPUT_DIR을 사용하여 출력됩니다.

프로젝트별 설정 내보내기

다른 설정으로 Spine 프로젝트를 내보내려면 설정이 포함된 .export.json 파일을 준비하여 Spine 프로젝트와 동일한 폴더에 해당 파일을 저장합니다. 예를 들어 파일 시스템 계층 구조는 다음과 같을 수 있습니다.

<스크립트 실행 시 경로를 지정하는 폴더>
      ├── 01
      │ ├── skeleton1.spine
      │ ├── skeleton1.export.json
      │ ├── images
      ├── 02
      │ ├── skeleton2.spine
      │ ├── skeleton2.export.json
      │ ├── images
      └── 03
         ├── skeleton3.spine
         ├── skeleton3.export.json
         └── images

.export.json 파일 이름은 프로젝트 파일 이름과 일치하지 않아도 됩니다.

동일한 프로젝트에 대해 여러 번 내보내기

다른 내보내기 설정으로 프로젝트를 여러 번 내보내려면 해당 수만큼의 .export.json 파일을 준비하여 포함시킵니다. 예를 들어 스켈레톤 데이터를 바이너리 형식과 PNG 시퀀스로 모두 내보내려면 파일 시스템 계층 구조는 다음과 같을 수 있습니다.

<스크립트 실행 시 경로를 지정하는 폴더>
      ├── 01
      │ ├── skeleton1.spine
      │ ├── skeleton1_Binary.export.json
      │ ├── skeleton1_PNG.export.json
      │ ├── images
      ├── 02
      │ ├── skeleton2.spine
      │ ├── skeleton2_Binary.export.json
      │ ├── skeleton2_PNG.export.json
      │ ├── images
      └── 03
         ├── skeleton3.spine
         ├── skeleton3_Binary.export.json
         ├── skeleton3_PNG.export.json
         └── images

기본 설정과 사용자 지정 설정 믹싱

동일한 폴더에 .export.json 파일이 없는 프로젝트 파일은 다음의 기본 설정으로 내보내집니다.

<스크립트 실행 시 경로를 지정하는 폴더>
      ├── 01
      │ ├── skeleton1.spine
      │ ├── skeleton1_Binary.export.json
      │ ├── skeleton1_PNG.export.json
      │ ├── images
      ├── 02
      │ ├── skeleton2.spine <이 스켈레톤은 기본 형식으로 내보내집니다>
      │ ├── images
      └── 03
         ├── skeleton3.spine
         ├── skeleton3_Binary.export.json
         ├── skeleton3_PNG.export.json
         └── images

스크립트 수정

Spine의 명령줄 인터페이스를 사용하여 직접 스크립트를 작성하거나 필요에 맞게 당사의 스크립트를 수정하여도 됩니다. 스크립트의 모든 기능을 설명하기 위해 스크립트에 주석을 추가했으며, README 파일에서 스크립트 작동 방식에 대한 더 자세한 내용을 확인할 수 있습니다.

이 튜토리얼이 도움이 되었나요? Spine 포럼에서 여러분의 피드백을 듣고 싶습니다!