Chorono 구축하기: 웹을 위한 오픈 소스 AI 지원 애니메이션 에디터
요약
Chorono는 브라우저 기반의 오픈 소스 AI 지원 애니메이션 에디터로, 웹과 모바일 플랫폼에서 사용 가능한 런타임 및 SDK를 제공합니다. 단순 편집을 넘어 애니메이션을 실제 제품 인터페이스와 앱에 통합할 수 있는 창의적 툴체인 구축을 목표로 합니다.
핵심 포인트
- AI 지원 애니메이션 생성 및 WebGL2 기반 렌더링 제공
- npm 및 Android SDK를 통한 멀티 플랫폼 런타임 지원
- 타임라인, 레이어, 시각적 상태 머신 등 핵심 편집 기능 포함
- 게임 엔진 및 비디오 에디터로의 확장 가능한 비전 보유
최근 GitHub에 Chorono Editor를 공개했습니다. Chorono는 브라우저에서 직접 실행되는 무료 오픈 소스 (open-source) 애니메이션/에디터 프로젝트입니다. 이 아이디어는 하나의 간단한 질문에서 시작되었습니다: '우리가 점진적으로 전문적인 크리에이티브 플랫폼으로 진화할 수 있는, 브라우저 기반의 확장 가능하고 AI 지원이 가능한 애니메이션 도구를 만들 수 있을까?' 이 프로젝트는 아직 매우 초기 단계이지만, 이미 기초가 형성되고 있습니다.
Chorono란 무엇인가요? Chorono Editor는 애니메이션, 타임라인 편집 (timeline editing), 시각적 워크플로우 (visual workflows), 그리고 런타임 재생 (runtime playback)에 집중하는 웹 기반 크리에이티브 도구입니다. 단순히 애니메이션을 생성하고 미리 보는 에디터로만 의도된 것이 아닙니다. 장기적인 목표는 애니메이션을 휴대 가능하게(portable) 만들어 실제 웹사이트, 제품 인터페이스, 모바일 애플리케이션, 그리고 궁극적으로는 SDK를 통해 다양한 플랫폼에서 사용할 수 있도록 하는 것입니다.
현재 기능
현재 버전에는 이미 애니메이션 시스템의 많은 중요한 부분에 대한 기초가 포함되어 있습니다:
- AI 지원 애니메이션 생성
- 타임라인 (Timeline), 레이어 (layer), 트랙 (track), 그리고 키프레임 (keyframe) 시스템
- GPU 가속 파티클 렌더링 (GPU-accelerated particle rendering)
- WebGL2 기반 렌더링 아키텍처
- 스플라인 (Spline) 오브젝트 시스템
- 스마트 선택 도구
- 복제 (Clone) 및 배열 (array) 도구
- 파라미터 와이어링 (Parameter wiring)
- 시각적 상태 머신 (Visual state machine) / FSM
- JavaScript 스크립팅
- 웹 런타임 (Web Runtime) 지원
- Android SDK 지원
- iOS SDK 계획 중
아직 누락된 부분과 버그, 재설계가 필요한 영역이 많이 남아 있지만, 프로젝트는 이제 공개되었으며 피드백을 기다리고 있습니다.
런타임 및 SDK 지원
Chorono의 가장 중요한 목표 중 하나는 애니메이션을 에디터 외부에서도 사용할 수 있게 만드는 것입니다. Chorono에서 생성된 애니메이션은 에디터 UI 안에 갇혀 있어서는 안 됩니다. 실제 애플리케이션에서 내보내고 사용할 수 있어야 합니다.
웹 프로젝트의 경우, 런타임을 다음과 같이 설치할 수 있습니다:
npm i @chorono/runtime
Android 프로젝트의 경우, SDK를 다음과 같이 추가할 수 있습니다:
implementation ( "com.grntsoftware:chorono-android-sdk:1.0.0" )
이는 동일한 애니메이션 워크플로우가 점진적으로 여러 플랫폼에 걸쳐 유용해질 수 있음을 의미합니다.
런타임 (Runtime)이 중요한 이유
많은 애니메이션 도구들이 오직 편집 (Editing)에만 집중합니다. 하지만 Chorono에게는 런타임 측면이 에디터만큼이나 중요합니다. 목표는 다음과 같은 생태계를 구축하는 것입니다: 애니메이션을 에디터에서 디자인하고, 구조화된 데이터 (Structured data)로 내보내며, 경량 런타임을 통해 재생하고, 최종적으로 플랫폼별 SDK를 통해 배포하는 것입니다. 이는 Chorono를 단순한 브라우저 에디터 그 이상으로 만듭니다. 이는 창의적인 툴체인 (Toolchain)의 시작점이 됩니다.
장기적 비전
저는 Chorono가 단순한 애니메이션 에디터로만 남기를 원하지 않습니다. 장기적인 목표는 이를 더 큰 AI 지원 창의적 플랫폼 (AI-assisted creative platform)으로 성장시키는 것입니다. 다음의 주요 방향성들은 다음과 같습니다:
- 게임 엔진 (Game Engine)
- 2D 드로잉 / 일러스트레이션 도구 (2D Drawing / Illustration Tool)
- 비디오 에디터 (Video Editor)
- 3D 모델링 프로그램 (3D Modeling Program)
- 모든 도구에 걸친 AI 지원 생성, 편집 및 자동화 (AI-assisted creation, editing, and automation)
이 아이디어는 애니메이션, 게임, 비디오, 드로잉, 그리고 3D 워크플로우가 공통된 기반을 공유할 수 있는 창의적 생태계를 구축하는 것입니다.
왜 오픈 소스인가?
이 프로젝트는 아직 초기 단계입니다. 누락된 기능, 다듬어지지 않은 부분, 버그, 그리고 아마도 재설계가 필요한 많은 것들이 있을 것입니다. 하지만 이것이 바로 제가 이 프로젝트를 오픈 소스로 공개하고 싶었던 정확한 이유입니다. 개발자, 디자이너, 애니메이터, 그리고 창의적 도구에 관심 있는 사람들의 피드백이 프로젝트를 훨씬 더 나은 방향으로 형성하는 데 도움이 될 수 있다고 믿습니다.
저장소 (Repositories)
에디터 저장소: https://github.com/codie1982/chorono-editor
런타임 저장소: https://github.com/codie1982/chorono-runtime
피드백
다음 사항들에 대한 피드백을 주시면 정말 감사하겠습니다: 에디터 아키텍처 (Editor architecture), 런타임 및 SDK 방향성, 애니메이션 워크플로우, WebGL2 렌더링 방식, 그리고 장기적인 플랫폼 비전입니다. Chorono는 아직 시작 단계에 있지만, 공개된 환경에서 계속해서 만들어 나갈 수 있어 매우 설렙니다.
--- ## 더 짧은 DEV.to 설명 / excerpt DEV.to의 설명 영역이나 소셜 공유용으로 사용할 수 있습니다: text Chorono는 타임라인/키프레임 (timeline/keyframes), WebGL2 렌더링 (WebGL2 rendering), GPU 파티클 (GPU particles), 스크립팅 (scripting), 웹 런타임 (Web Runtime), Android SDK 지원, 그리고 완전한 크리에이티브 플랫폼을 향한 장기적인 비전을 갖춘 웹을 위한 오픈 소스 AI 지원 애니메이션 에디터입니다.
AI 자동 생성 콘텐츠
본 콘텐츠는 Dev.to AI tag의 원문을 AI가 자동으로 요약·번역·분석한 것입니다. 원 저작권은 원저작자에게 있으며, 정확한 내용은 반드시 원문을 확인해 주세요.
원문 바로가기