「timeliner gui.js」타임라인 메이커

 

애니메이팅을 구사하기 위해서는 타임라인 에디터가 필요하다.

대표적인 2D, 3D 영상제작 s/w는 아래와 같은 타임라인 에디터가 기본이며,

 

유니티 타임라인 에디터

 

 유니티, 언리얼과 같은 게임제작 s/w 역시 타임라인을 제공한다.

 

 

 

 

│JS타임라인 라이브러리

「 Timeline.js 」

「 Keytime-editor(npm) 」

「 Frame.js 」

「 TweenTime.js 」

「 Timeliner.js 」

 

위의 5가지는 대표적인 타임라인 라이브러리이다.

5가지 모두 장단점을 갖고 있으며,

상황에 따라 다르게 사용할 수 있다.

 

라이브러리	내용
Timeline.js	http://marcinignac.com/blog/timeline-js/ 장점: 속도가 빠르고, 간단한 구조 단점:  2014년 이후 업데이트가 되지 않음 (ES5이후 JS프레임워크와 충돌 가능성 높음)
Timeliner.js	https://github.com/zz85/timeliner 장점: 동영상편집에 필요한 기능이 탑재(에펙과 유사)  저장, 히스토리, undo, 복사 등... 영상편집툴 제작에 유리함 단점: 레퍼런스 부족
Frame.js	https://github.com/mrdoob/frame.js/ 장점: 3D에 특화, 3D관련 기본기능 탑재(Three.js개발자가 제작) 단점: 영상편집, 2D기능 없음
TweenTime.js	https://github.com/idflood/TweenTime/ 장점: 2D 이미지 작업에 특화, GUI가 세련됨(주관적 평가) 단점: 범용성 떨어짐(3D, 영상편집) ES이후 업데이트(x)
Keytime-editor	https://github.com/mattdesl/keytime/ 장점:  빠른 속도, 데이터 변환에 유리(서버위주) 단점: 의존성 문제, 부족한 기능(자체개발에 유리)

 

 

 

│결론

커스터마이징에 자신있다면, 속도가 빠른 「 Timeline.js 」, 「 Keytime-editor 」가 적합하며,

3D타임라인 에디터가 필요하다면, Frame.js(가장 좋음), timeliner.js가 유리하다.(자체기능 多)

2D이미지 툴을 개발한다면, TweenTime.js를 사용하는 편이 좋다.

 

만일, 2D, 영상편집, 3D까지 팔방미인형 타임라인 에디터를 개발한다면,

three.js개발 초기에 사용되었던 timeliner.js가 최고의 선택이다.

timeliner.js는 '애니메이팅 프로토타입'개발에 최적화되어 있으며,

사용법이 쉽고 간편하기 때문이다//

(개인적인 의견이며, 참고하시면 좋겠습니다.)