DragonBones

DragonBones는 여러 이미지 파츠로 구성된 2D 캐릭터에 뼈대와 변형 정보를 부여하여 애니메이션하는 제작 도구와 런타임 기술의 묶음이다. 캐릭터를 매 프레임 새로 그리는 대신 팔·다리·몸통·얼굴 같은 요소를 골격과 연결하고 위치·회전·변형의 변화로 움직임을 구성한다. 게임에서 같...

작성 언어ActionScript (구 에디터), TypeScript (런타임 계열)
분류2D 골격 애니메이션·게임용 캐릭터 제작 도구
원 개발 계열Egret Labs / DragonBones 프로젝트
작업 방식본(bone)·슬롯·메시 기반 캐릭터 리깅
핵심 기능키프레임·IK·FFD·스키닝
그래픽 자산분리된 이미지 파츠·텍스처 아틀라스
기본 구조armature, bone, slot, display
애니메이션타임라인·커브·중첩 심볼
출력애니메이션 데이터와 텍스처 아틀라스
런타임DragonBones Runtime 및 게임 엔진 연동
주요 용도2D 게임 캐릭터·교체형 아바타·UI 애니메이션
공식 자료DragonBones Animation Solution

DragonBones는 여러 이미지 파츠로 구성된 2D 캐릭터에 뼈대와 변형 정보를 부여하여 애니메이션하는 제작 도구와 런타임 기술의 묶음이다. 캐릭터를 매 프레임 새로 그리는 대신 팔·다리·몸통·얼굴 같은 요소를 골격과 연결하고 위치·회전·변형의 변화로 움직임을 구성한다. 게임에서 같은 캐릭터의 수많은 동작과 외형을 재사용하는 데 적합하며, 제작 도구에서 작성한 애니메이션 데이터를 런타임으로 전달하는 흐름을 주요 목표로 한다.[1]

캐릭터의 기본 구조인 armature에는 bone과 slot, slot에 표시되는 이미지 또는 메시가 포함된다. 사용자는 뼈대를 생성하고 이미지 파츠를 각 뼈에 연결한 뒤 타임라인에 키프레임을 배치한다. 위치·회전·크기 및 곡선 보간을 이용해 중간 움직임을 생성할 수 있고, 역운동학(IK)과 제약을 설정해 여러 뼈가 연결된 팔·다리의 끝 위치를 조정할 수 있다. 같은 armature에 여러 스킨을 지정하면 장비·복장 같은 시각적 자산을 교체할 수 있다.

단순 이미지 파츠 회전만으로 충분하지 않은 변형에는 메시(mesh)와 자유형 변형(FFD)·스키닝이 사용된다. 여러 정점의 위치를 뼈 움직임에 연결하면 캐릭터의 몸통·천·머리카락 등이 늘어나거나 구부러지는 표현을 만들 수 있다. 에디터는 원본 이미지와 애니메이션 정보를 독립적으로 유지하고, 게임에서는 텍스처 아틀라스와 JSON 기반 애니메이션 데이터를 결합하여 저장·렌더링 비용을 줄일 수 있다.[2]

DragonBones는 Adobe Photoshop의 레이어 이미지나 다른 애니메이션 프로그램의 일부 자료를 가져와 리깅한 뒤, 관련 런타임·게임 엔진으로 전달하도록 설계되었다. 에디터 데이터와 실제 게임에서 사용하는 재생 코드의 버전이 맞아야 메시·슬롯·이벤트와 애니메이션 혼합이 예상대로 동작한다. 순수한 프레임별 디지털 작화기보다 2D 게임용 재사용 가능한 캐릭터 골격과 데이터 중심 애니메이션을 만드는 프로그램으로 분류할 수 있다.

역사

프로젝트 출범

Egret 생태계

캐릭터·골격 모델

armature

bone

slot과 display

2D 리깅

파츠 연결

스킨·아바타

애니메이션

키프레임

커브 보간

중첩 애니메이션

변형·제약

IK

메시

FFD·스키닝

제작 자산

이미지 파츠

텍스처 아틀라스

데이터 출력과 런타임

JSON 데이터

게임 엔진 연동

호환성·버전 관리

다른 2D 애니메이션 도구와 비교

관련 문서

  1. DragonBones Animation Solution ↩
  2. DragonBones: Mesh, FFD and Skinning ↩