OpenDesign Motion: 무료 오픈소스 Claude Motion 대안
OpenDesign Motion은 무료 오픈소스 Claude Motion 대안입니다. 이 오픈소스 모션 디자인 도구의 설정과 Gemini Omni와의 비교.
OpenDesign Motion은 2026년 10월 15일 OpenDesign v0.25.0에서 출시되었습니다. 그 릴리스의 코드네임은 OpenDesign Motion입니다. 헤드라인은 이것을 Claude Motion의 오픈소스 대안이라고 부릅니다.
이 사이트는 독립 사이트입니다. OpenDesign, Anthropic, Google과 제휴하지 않았습니다.
코드는 open-design 저장소에 있습니다. 이 릴리스의 집계는 PR 53개, 기여자 16명, 21일입니다. 그 집계 아래 줄은 코드로 아이디어를 비디오로입니다.
OpenDesign Motion이란
OpenDesign Motion은 코드로 만든 오픈소스 모션 디자인입니다. OpenDesign의 라이선스는 Apache 2.0입니다. 이 릴리스는 이것을 오픈소스 Claude Motion 대안으로 위치시킵니다. 텍스트-투-비디오 모델이 아닙니다.
코딩 에이전트가 HTML, CSS, GSAP을 작성합니다. HyperFrames는 헤드리스 Chrome과 FFmpeg로 그 페이지를 결정적 MP4로 렌더합니다. HyperFrames는 HeyGen의 오픈소스, 에이전트 네이티브 비디오 프레임워크이며, OpenDesign에 일급 시민으로 통합되어 있습니다. 프레임워크 라이선스는 Apache-2.0입니다. README는 카탈로그 썸네일을 © HeyGen으로 표시합니다.
v0.25.0 노트는 번들 예제 5개에서 시작해 편집 가능한 애니메이션을 만들고 MP4를 내보내라고 합니다. 비디오를 요청하면 결과는 편집 가능한 소스 파일과 MP4입니다. 인터랙티브 애니메이션은 실행 가능한 HTML로 남습니다. 활성 미리보기를 떠나면 소리가 멈춥니다. 다섯 예제는 Motion Future, Product Promo, Showreel, UI Morph, Visual Lesson입니다. 비디오 내보내기는 MP4가 재생되는지 확인하고, 실패한 내보내기도 편집 가능한 소스를 유지합니다.
같은 릴리스는 이 버전이 편집, 미리보기, 기기 간 작업 이어가기를 더 매끄럽게 한다고 말합니다.
README는 저장소에 HyperFrames 템플릿 11개와 Seedance 프롬프트 39개가 함께 제공된다고 말합니다. README는 OpenDesign 렌더 워크플로(컴포지션 캐시, sandbox-exec 우회, MP4-as-chip)를 저장소의 design-templates/hyperframes/로 가리킵니다.
README는 HyperFrames를 다른 생성기와 짝지을 수 있다고도 말합니다. Seedance 2.0은 영화적 텍스트-투-비디오와 이미지-투-비디오로 지목됩니다. Veo 3, Sora 2, Kling 2는 라우팅되는 모델 변형으로 지목됩니다. Suno v5와 Lyria 2는 오디오 레이어로 지목됩니다. 그 짝은 두 번째 경로입니다. Motion 렌더 자체는 여전히 HTML 애니메이션을 MP4로 만든 것입니다.
OpenDesign은 에이전트를 함께 제공하지 않습니다. README는 디자인 엔진이 이미 PATH에 있는 claude, codex, cursor-agent, copilot, hermes 또는 kimi 바이너리라고 말합니다. 한 번의 클릭으로 바꿉니다.
앱 자체는 오픈소스입니다. 모델을 번들하지 않으므로, 모델 비용은 가져오는 에이전트나 API 키에 따라 달라집니다.
2026년 10월 17일 eogee.com은 OpenDesign 출시 팀이 출시 데모 비디오를 OpenDesign 안의 DeepSeek V4.1 Flash로 만들었다고 말했다고 보도했습니다. 그것은 공급업체의 주장입니다. 그 글에는 독립 벤치마크가 없습니다.
OpenDesign 설치 방법
아래 단계는 OpenDesign README의 설치 경로입니다. 명령 블록은 그 파일에서 복사한 것입니다.
데스크톱 앱
README는 데스크톱 앱을 가장 빠른 경로라고 부릅니다. Node도, pnpm도, 클론도 필요 없습니다.
| 시스템 | README가 받는 곳으로 말한 위치 |
|---|---|
| macOS (Apple Silicon 및 Intel x64) | open-design.ai 또는 GitHub Releases |
| Windows (x64) | open-design.ai 또는 GitHub Releases |
| Linux | 공식 릴리스에 미리 빌드된 Linux 아티팩트는 없습니다. OpenDesign을 소스에서 실행하세요. Linux 릴리스 작업은 #4368에서 추적됩니다. |
설치 후 앱은 PATH의 모든 코딩 에이전트 CLI를 자동으로 감지합니다. 기능 스킬 100+개, 별도의 렌더링 템플릿 카탈로그, 디자인 시스템 151개를 불러옵니다. 진입 뷰에서 브리프를 입력합니다.
프로젝트는 로컬에서 또는 자체 배포에서 실행할 수 있습니다. 클라우드 모델 요청과 OpenDesign Cloud 요청은 해당 서비스로 갑니다.
코딩 에이전트에 설치
GUI 없이 OpenDesign을 쓸 수 있습니다. Claude Code, Codex, Cursor, Copilot, OpenClaw, Antigravity, Hermes, Kimi 등 안에서 스킬, 플러그인 또는 MCP 서버로 호출합니다.
/usr/bin/od가 OpenDesign의 od를 가릴 수 있습니다. DMG 또는 Homebrew cask로 macOS 앱을 설치했다면, 셸이 여전히 od를 Apple의 /usr/bin/od 8진 덤프 유틸리티로 해석할 수 있습니다. 데스크톱 앱에서 Settings → MCP server를 열고 클라이언트별 스니펫을 복사하세요. 그 스니펫은 절대 경로를 쓰며, 맨 od 명령에 의존하지 않습니다. WSL2 사용자는 먼저 저장소의 docs/wsl-setup.md를 따르세요.
install.sh는 od mcp install을 감싼 얇은 셸 래퍼입니다. 호스팅된 URL이 랜딩 페이지 HTML 폴백 대신 shell을 반환하도록 존재하며, 셸이 Open-Design이 아닌 od 바이너리를 해석하면 즉시 실패합니다.
# One-line install into the agent you're using:
od mcp install <agent>
# <agent> = claude | codex | reasonix | raven | cursor | copilot | openclaw
# | antigravity | pi | vibe | hermes | cline | kimi | kiro
# | trae | opencode
# Hosted equivalent for curl-based setup:
curl -fsSL https://open-design.ai/install.sh | sh -s <agent>
그다음, 에이전트 안에서:
> Use open-design to generate a landing page with the Linear design system
파일시스템 기반 로컬 CLI 실행에서는 에이전트가 선택한 기능 스킬 또는 디자인 템플릿을 DESIGN.md와 조합하고, 표준 프로젝트 파일을 쓰며, OpenDesign이 그 파일을 미리봅니다. 파일시스템 도구가 없는 BYOK 또는 일반 API 실행은 완전한 <artifact> 블록 하나를 반환합니다.
Docker
git clone https://github.com/nexu-io/open-design.git
cd open-design/deploy
cp .env.example .env
echo "OD_API_TOKEN=$(openssl rand -hex 32)" >> .env
docker compose up -d
# open http://127.0.0.1:7456
브라우저가 자격 증명을 묻으면 사용자 이름은 open-design, 비밀번호는 deploy/.env의 OD_API_TOKEN 값을 사용하세요. 그러면 호스트 네트워킹 없이 Docker 브리지 트래픽이 인증됩니다. API 클라이언트는 계속 Authorization: Bearer <OD_API_TOKEN>을 쓸 수 있습니다.
소스에서 실행
git clone https://github.com/nexu-io/open-design.git
cd open-design
corepack enable && pnpm install
pnpm tools-dev run web
tools-dev가 출력한 URL을 엽니다. 명시적인 포트 플래그를 넘기지 않는 한 개발 포트는 동적으로 할당됩니다.
**Node ~24**와 **pnpm 10.33.x**를 사용하세요. WSL2 노트는 docs/wsl-setup.md에 있습니다. 네이티브 Windows 노트는 docs/windows-troubleshooting.md에 있습니다. 전체 퀵스타트, 환경 변수, 패키지 빌드 흐름은 QUICKSTART.md에 있습니다. 그 파일들은 저장소에 있습니다.
Motion 시작 방법
v0.25.0 노트가 이 경로를 제시합니다. Home 또는 Community에서 Motion Design을 엽니다. 번들 예제 5개 중 하나를 고릅니다. @ 피커의 모션 스킬을 사용합니다. 비디오를 요청합니다. 편집 가능한 소스 파일과 MP4를 받습니다. 인터랙티브 애니메이션은 실행 가능한 HTML로 남습니다. 활성 미리보기를 떠나면 소리가 멈춥니다.
OpenDesign Motion vs Claude Motion vs Gemini Omni
아래 행은 v0.25.0 릴리스, OpenDesign README, Anthropic의 2026년 10월 8일 글, Claude Motion 도움말 센터, 그리고 이 사이트의 Gemini Omni란 페이지를 사용합니다.
Claude Motion은 Team과 Enterprise에서 베타입니다. 도움말 센터는 Team에서 기본적으로 켜져 있다고 말합니다. Enterprise에서는 소유자가 Organization settings > Artifacts에서 켤 때까지 꺼짐 상태입니다. Anthropic 글은 Enterprise 관리자에게 Dashboards와 Motion에 같은 스위치를 쓰라고 합니다.
Claude는 텍스트, 차트, 도형, 이미지를 애니메이션하는 코드를 작성합니다. 어떤 단어, 숫자, 타이밍이든 바꿀 수 있습니다. 편집기에서 작품을 조정하거나 Claude에게 바꾸라고 한 뒤 MP4를 다운로드합니다. 도움말 센터는 애니메이션이 Motion 템플릿으로 만든 아티팩트라고 말합니다. Artifacts 탭에 저장됩니다. Export > MP4로 내보냅니다. 기본적으로 비공개입니다. 공유하려면 공유하세요. 사용량은 플랜 사용 한도에 집계됩니다. 더 길거나 더 복잡한 애니메이션은 더 많이 씁니다.
글의 예는 분기 보고서를 전사 회의용 30초 설명으로 바꾼 것, 이사회 덱의 차트 위 모션, 고객 온보딩용 제품 워크스루입니다. 그 문장들은 글 속의 예입니다. 최대 길이, 해상도, 프레임 레이트는 공개되어 있지 않습니다. Anthropic은 Claude Motion이 비디오 생성 모델을 쓰지 않는다고 말합니다. 생성된 영상도, AI가 생성한 사람도 없습니다. Anthropic은 Adobe, Descript, HeyGen, Higgsfield, invideo, Luma AI 또는 Runway로의 핸드오프를 나열하며, Canva와 Captions는 곧 추가됩니다.
Gemini Omni는 Google이 I/O 2026에서 5월 19일 공개한 생성 모델입니다. 텍스트, 이미지, 오디오 또는 비디오 입력으로 비디오를 만들며, 네이티브 동기화 오디오가 있습니다. 첫 릴리스는 Gemini Omni Flash입니다. 실제 영상을 생성합니다. OpenDesign Motion과 Claude Motion은 코드 기반 애니메이션을 렌더합니다. Omni는 Google AI Plus, Pro, Ultra에 포함됩니다.
| OpenDesign Motion | Claude Motion | Gemini Omni | |
|---|---|---|---|
| 무엇을 만드나 | 코드 애니메이션(HTML, CSS, GSAP)을 HyperFrames가 MP4로 렌더. 인터랙티브 애니메이션은 실행 가능한 HTML로 남음. | 텍스트, 차트, 도형, 이미지의 코드 애니메이션. MP4로 내보내기. | 네이티브 동기화 오디오가 있는 생성 영상. |
| 비디오 생성 모델을 쓰나 | 아니오 | 아니오 (Anthropic이 그렇게 말함) | 예 |
| 출시 | 2026년 10월 15일 (v0.25.0) | 2026년 10월 8일부터 베타 | 2026년 5월 19일 공개 (Gemini Omni Flash가 먼저) |
| 접근 | 공개 저장소. macOS와 Windows 데스크톱 앱. Linux는 소스에서. Docker. | Team과 Enterprise 플랜의 베타 | Google AI Plus, Pro, Ultra 플랜 |
| 비용 | 오픈소스 (Apache 2.0). 모델 비용은 가져오는 에이전트나 API 키에 따름. | Claude 플랜의 사용 한도에 집계. 별도 가격은 공개되지 않음. | 위의 Google AI 플랜에 포함 |
| 어떤 모델 | 자신의 코딩 에이전트 (Claude Code, Codex, Cursor 등) | 미공개 | Gemini Omni |
| 시작점 | 예제 5개, HyperFrames 템플릿 11개, Seedance 프롬프트 39개 | Artifacts 탭의 Motion 템플릿 | Gemini 앱의 프롬프트와 템플릿 |
| 편집 | 소스를 편집하거나 에이전트에게 요청 | 편집기, 또는 어떤 단어, 숫자, 타이밍이든 Claude에게 변경 요청 | 채팅에서 자연어로 편집 |
이 출처들이 그 사실을 밝히지 않으면 셀은 미공개라고 씁니다.
언제 무엇을 쓸까
- HTML, CSS, GSAP로 편집한 뒤 MP4로 내보내는 오픈소스 모션 디자인에는 OpenDesign Motion을 사용하세요. 데스크톱 앱은 macOS와 Windows를 다룹니다. Linux는 소스에서 실행합니다. 이미
PATH에 있는 코딩 에이전트를 가져오거나, 그 중 하나에 OpenDesign을 설치합니다. - Claude 안에서 텍스트, 차트, 도형, 이미지의 베타 애니메이션을 원할 때는 Claude Team 또는 Enterprise 플랜에서 Claude Motion을 사용하세요. Team에서는 기본적으로 켜져 있습니다. Enterprise 소유자가 Organization settings > Artifacts에서 켭니다. Anthropic의 글과 도움말 센터에서 시작하세요.
- 생성된 영상과 네이티브 동기화 오디오를 원할 때는 Gemini Omni를 사용하세요. Gemini Omni란이 그 모델을 다룹니다. Gemini Omni 영상 프롬프트, 또는 OpenDesign 조합 경로용 Seedance와 Veo 프롬프트는 프롬프트 생성기에서 초안을 작성하세요.
함께 읽을 글
FAQ
OpenDesign Motion이란 무엇인가요?
OpenDesign Motion은 2026년 10월 15일 OpenDesign v0.25.0에서 출시되었습니다. 코딩 에이전트가 HTML, CSS, GSAP을 작성합니다. HyperFrames가 헤드리스 Chrome과 FFmpeg로 결정적 MP4를 렌더합니다. 편집 가능한 소스 파일도 받습니다. 이 릴리스에는 번들 예제 5개가 들어 있으며, 이를 Claude Motion의 오픈소스 대안이라고 부릅니다. OpenDesign의 라이선스는 Apache 2.0입니다.
OpenDesign Motion은 텍스트-투-비디오 모델인가요?
아닙니다. OpenDesign Motion은 코드 애니메이션을 MP4로 렌더합니다. 이 비교에서 텍스트, 이미지, 오디오 또는 비디오로 영상을 생성하고 네이티브 동기화 오디오를 갖는 모델은 Gemini Omni입니다. OpenDesign README는 생성 영상 모델을 원할 때의 별도 조합으로 Seedance 2.0, Veo 3, Sora 2, Kling 2도 지목합니다.
어떤 Claude 플랜에 Claude Motion이 포함되나요?
Anthropic의 2026년 10월 8일 글과 Claude 도움말 센터는 Claude Motion이 Team과 Enterprise에서 베타라고 말합니다. Team에서는 기본적으로 켜져 있습니다. Enterprise에서는 소유자가 Organization settings > Artifacts에서 켤 때까지 꺼져 있습니다. 애니메이션은 Motion 템플릿으로 만든 아티팩트이며, Artifacts 탭에 저장되고 MP4로 내보냅니다. 기본적으로 비공개입니다.
OpenDesign 앱에서 Motion Design은 어디에서 여나요?
v0.25.0 노트는 Home 또는 Community에서 Motion Design을 열라고 합니다. 번들 예제 5개 중 하나(Motion Future, Product Promo, Showreel, UI Morph, Visual Lesson)를 고르거나, @ 피커의 모션 스킬을 사용합니다. 비디오를 요청합니다. 편집 가능한 소스 파일과 MP4를 받습니다. 인터랙티브 애니메이션은 실행 가능한 HTML로 남습니다. 활성 미리보기를 떠나면 소리가 멈춥니다.
Claude Motion의 가격, 길이, 해상도가 공개되어 있나요?
아닙니다. Anthropic 글과 Claude 도움말 센터는 Claude Motion의 가격, 최대 길이, 해상도, 프레임 레이트, 또는 그것을 구동하는 모델을 공개하지 않습니다. 사용량은 플랜 사용 한도에 집계됩니다. 더 길거나 더 복잡한 애니메이션은 그 허용량을 더 많이 씁니다.