Vox 스타일 모션 그래픽 만드는 법, 클로드 코드와 종이 애니메이션

Vox 스타일 모션 그래픽(종이를 오려 붙인 듯한 질감의 설명 영상)을 클로드 코드와 힉스필드 MCP, 파이썬 합성으로 만드는 과정을 40단계로 옮겼습니다. 핵심은 동작 하나를 여러 장의 분리된 이미지로 나눠 뽑고, 그 이미지를 순서대로 이어 붙이는 옛날 종이 애니메이션 원리입니다. 영상에서 판독되지 않은 프롬프트는 화자가 말로 설명한 조건을 바탕으로 복사해 쓸 수 있는 예시를 따로 만들어 넣었습니다.

Vox 스타일 모션 그래픽, 무엇을 어떻게 만드나

프롬프트 한 줄과 "진행해" 한 마디. 원카AI 채널의 화자는 그게 자기가 한 일의 전부라고 말합니다. 나머지는 클로드 코드가 힉스필드에서 이미지를 뽑고 파이썬으로 영상까지 합쳐 냅니다. 종이 오려 붙인 듯한 바로 그 Vox 스타일입니다.

만드는 건 두 가지입니다. 레퍼런스 이미지를 쓰는 쉬운 버전(카약 타는 사람)과, 레퍼런스 없이 만드는 케이블카 인트로. 원리는 하나입니다. 노 젓는 동작을 5개의 분리된 이미지로 만들어 순서대로 돌리는 것. 옛날 종이 애니메이션과 같습니다.

화자는 Seedance 같은 고급 영상 모델로 Vox 스타일을 만드는 건 크레딧이 너무 들어 배보다 배꼽이 커진다고 봅니다. 클로드 오푸스 5.5 쪽이 "비교가 안 될 정도로 가성비"라는 게 화자의 평가입니다. 다만 구체적인 크레딧이나 금액 수치는 영상에 나오지 않습니다. 화자 개인의 판단으로 읽으면 됩니다.

같은 방식으로 만들었다며 보여 주는 것들은 스위스 그린델발트 케이블카 인트로, 콜럼버스 항해 인트로, 포르쉐 박스터 영상, 닐 암스트롱 인트로입니다.

왜 영상 모델이 아니라 이미지와 파이썬인가

영상 생성 모델은 한 번 뽑을 때마다 크레딧이 크게 나갑니다. 반면 Vox 스타일은 움직임이 뚝뚝 끊기는 게 오히려 맛인 장르라, 정지 이미지 몇 장을 빠르게 넘기기만 해도 충분히 그 느낌이 납니다. 그래서 이미지는 힉스필드의 이미지 모델로 뽑고, 이미지를 순서대로 배치하고 흔들고 겹치는 일은 파이썬(프로그래밍 언어) 코드가 맡습니다. 코드는 클로드 코드가 알아서 짜니 사람이 파이썬을 몰라도 됩니다.

준비물

• 클로드(Claude) 계정. 화자는 클로드 프로(Pro) 정도의 요금제는 있어야 한다고 말합니다. 요금은 공식 안내를 확인해야 합니다
• 클로드 코드(Claude Code). 영상은 설치법을 통째로 생략하고 "유튜브에 클로드 코드 설치법을 검색해서 보고 오라"고 넘깁니다. 아래 1부에 설치 경로를 정리했습니다
• 힉스필드(Higgsfield) 계정. MCP(클로드가 외부 서비스를 직접 쓰게 해주는 연결 규격) 연결에 필요합니다
• 웹브라우저와 핀터레스트(Pinterest) 접근. 레퍼런스 이미지용입니다
• (선택) ChatGPT. 배경이 투명한 이미지가 필요할 때 씁니다
• (선택) 타입캐스트(Typecast) 내레이션, 수노(Suno) 배경 음악
• 비용: 힉스필드 이미지 생성에 크레딧이 듭니다. 화자는 "비용을 따진 만큼도 들지 않는다"고 하지만 금액이나 크레딧 수치는 말하지 않습니다

1부. 클로드 코드와 오푸스 5.5 준비 (1~8단계)

순서가 고정된 구간입니다. 화자는 설치를 다른 영상에 맡기지만, 가장 쉬운 길은 클로드 데스크톱 앱을 받는 것입니다. 앱 안에 "코드" 메뉴가 들어 있어 따로 터미널을 열지 않아도 클로드 코드를 쓸 수 있습니다.

1. 유튜브 검색창에 클로드 코드 설치법을 입력합니다.
   • 확인: 여러 유튜버가 정리한 설치 영상이 나옵니다.
   • 대안: 영상을 찾지 않고 바로 3단계로 가도 됩니다. 데스크톱 앱 설치만으로 이 작업에 필요한 코드 기능을 쓸 수 있습니다.
2. 그 영상을 보고 클로드 코드 설치를 끝냅니다.
   • 주의: 원 영상은 설치 과정을 전혀 보여주지 않습니다.
   • 확인: 클로드 코드 설치가 완료됐습니다.
3. 구글 검색창에 클로드 코드 앱을 입력합니다.
   • 확인: 클로드 코드 데스크톱 페이지가 검색됩니다. 공식 다운로드 페이지 주소는 claude.ai/download입니다.
4. 클로드 코드 데스크톱 페이지에 들어갑니다.
   • 확인: 앱 다운로드 화면이 보입니다.
5. 내 컴퓨터 운영체제(윈도우 또는 맥)에 맞는 앱을 다운로드합니다.
   • 확인: 설치 파일이 내려받아집니다.
6. 내려받은 앱을 실행하고 클로드 계정으로 로그인합니다.
   • 확인: 클로드 화면이 열립니다.
7. 좌측 상단 메뉴에서 "코드"를 누릅니다.
   • 위치: 좌측 상단 메뉴 위쪽에 "채팅 / 코워크(Cowork) / 코드"가 나란히 있습니다.
   • 팁: 열자마자 일반 대화창으로 나오는 경우에만 필요한 단계입니다.
   • 확인: 클로드 코드를 쓸 수 있는 화면으로 들어갑니다. 처음이면 작업할 폴더를 고르라고 합니다. 바탕화면에 vox-video 같은 새 폴더를 만들어 지정하면 이미지와 영상 파일이 그 안에 모입니다.
8. 프롬프트 창 아래 모델 선택에서 오푸스 5.5(Opus 5.5)를 고릅니다.
   • 확인: 화자는 "이러면 끝"이라고 말합니다.

2부. 힉스필드 MCP 연결 (9~18단계)

MCP로 연결해 두면 클로드가 알아서 힉스필드에 가서 이미지를 만들어 옵니다. 이미지를 따로 내려받아 폴더로 옮기는 일도, 이미지 프롬프트를 사람이 짜는 일도 사라진다는 게 화자의 설명입니다.

9. 구글 검색창에 힉스필드(Higgsfield)를 입력합니다.
   • 확인: 검색 결과 위쪽에 "Higgsfield Video AI"가 보입니다.
10. "Higgsfield Video AI" 사이트를 클릭합니다.
    • 확인: 여러 AI를 쓸 수 있는 플랫폼 화면에 들어옵니다. 계정이 없다면 여기서 가입하고 로그인합니다.
11. 상단 메뉴에서 MCP를 클릭합니다.
    • 확인: 연결할 수 있는 도구 목록이 쭉 나옵니다.
12. 목록에서 클로드를 클릭합니다.
    • 확인: 클로드용 연결 버튼이 나타납니다.
13. Connect(커넥트) 버튼을 클릭합니다.
    • 확인: 클로드 화면으로 넘어가며 "커스텀 커넥터 추가" 창이 뜹니다.
14. 커넥터 링크가 자동으로 들어갔는지 봅니다.
    • 확인: MCP 링크 칸이 이미 채워져 있습니다.
15. "계속"을 누릅니다.
    • 확인: 이미지와 영상을 만들 수 있는 통로가 클로드에 탑재됩니다. 힉스필드 로그인·권한 승인 창이 뜨면 승인합니다.
16. 클로드 화면에서 프로필을 클릭합니다.
    • 확인: 메뉴가 펼쳐집니다.
17. 설정을 누릅니다.
    • 확인: 설정 화면이 열립니다.
18. 좌측 사이드바의 사용자 지정 > 커넥터를 누릅니다.
    • 확인: 목록에 힉스필드가 들어와 있습니다.
    • 팁: 화자는 힉스필드 API를 쓰면 더 저렴하게 뽑을 수도 있지만, MCP가 가장 간편해서 이 방식을 택한다고 말합니다.

3부. 레퍼런스 이미지 구하기 (19~24단계)

19. 구글 검색창에 핀터레스트를 입력합니다.
    • 확인: pinterest.com이 나옵니다.
20. 핀터레스트에 들어갑니다.
    • 확인: 여러 스타일의 이미지들이 보입니다.
21. 핀터레스트 검색창에 컬러드 페이퍼 아트(colored paper art)를 입력합니다.
    • 확인: 종이 질감 스타일 이미지들이 나옵니다.
22. 원하는 느낌의 이미지를 클릭합니다.
    • 확인: 이미지가 크게 열립니다.
23. 그 이미지를 우클릭합니다.
    • 확인: 메뉴에 "이미지를 다른 이름으로 저장"이 보입니다.
24. "이미지를 다른 이름으로 저장"으로 다운로드 폴더에 저장합니다.
    • 확인: 다운로드 폴더에 이미지 파일이 생깁니다.
    • 주의: 레퍼런스는 스타일 참고용입니다. 남의 작품을 그대로 영상에 넣는 용도로 쓰지 않습니다.

4부. 카약 Vox 모션 만들기 (25~32단계)

25. 클로드 코드 프롬프트 창에 프롬프트를 입력합니다.
    • 확인: 프롬프트가 입력창에 들어가 있습니다.

프롬프트 원문은 화면에만 떠 있어 판독하지 못했습니다. 화자가 말로 설명한 조건은 이렇습니다.

• Vox 스타일을 힉스필드 이미지와 파이썬으로 구현해 달라
• 종이 모션 느낌을 위해 카약 타는 사람이 노를 휘젓는 모션을 총 5개의 구분된 이미지로 제작해 달라
• 배경과 카약 이미지 요소 모두 찢어진 종이 텍스처 느낌으로
• 스타일 참조용 레퍼런스 이미지 첨부
• 왜 5장인가: 노 젓는 동작을 5동작으로 나눠 순서대로 돌리면 옛날 종이 애니메이션처럼 사람 눈에 움직임으로 보이기 때문이라는 설명입니다

이 조건을 그대로 옮긴 예시입니다. 편집자가 작성한 것이라 화자 원문과 같지는 않습니다.

Vox 스타일 모션 그래픽 영상을 만들어 줘.
이미지는 연결된 힉스필드 MCP로 만들고, 영상 합성은 파이썬으로 해 줘.

- 주제: 강 위에서 카약을 타는 사람이 노를 젓는 장면, 8초
- 종이 애니메이션 느낌이 나도록 노 젓는 동작을 총 5개의 구분된 이미지로 만들어 줘
- 배경 1장은 따로 만들고, 카약과 사람은 배경 위에 겹칠 수 있게 분리해 줘
- 배경과 카약 요소 모두 찢어진 색종이 텍스처 느낌
- 첨부한 레퍼런스 이미지의 색감과 질감을 따라가 줘
- 이미지를 만들기 전에 몇 장을 어떤 모델로 만들지 계획부터 보여 줘

26. 저장한 레퍼런스 이미지를 프롬프트 창으로 드래그 앤 드롭합니다.
    • 확인: 이미지가 첨부된 상태가 됩니다.
27. 입력을 실행(전송)합니다.
    • 확인: 힉스필드 MCP가 작동하며 클로드가 필요한 이미지를 계획하기 시작합니다.
28. 클로드가 세운 계획을 읽습니다.
    • 확인: 배경 1장, 카약 기준 프레임 1장, 나머지 4프레임으로 노 젓고 돌아오는 동작 5단계를 세팅했다고 나옵니다.
29. 클로드가 고른 이미지 모델을 확인합니다.
    • 확인: 화자의 경우 나노 바나나 프로 2K(Nano Banana Pro 2K)로 잡혀 있었습니다.
    • 팁: 크레딧을 아끼려면 나노 바나나 2, 1K 화질로도 충분하다고 말합니다. 바꾸고 싶으면 "나노 바나나 2, 1K로 바꿔서 진행해"라고 답하면 됩니다.
30. 진행을 승인합니다(OK 사인).
    • 확인: 이미지들이 자동으로 제작됩니다.
31. 나온 결과 영상을 봅니다.
    • 확인: 화자는 "지금까지 한 게 프롬프트 한 줄과 오케이 사인뿐"이라고 말합니다. 영상 파일은 7단계에서 지정한 작업 폴더에 저장됩니다.
32. (선택) 힉스필드 사이트의 이미지 메뉴에 들어가 어떤 이미지를 어떤 프롬프트로 뽑았는지 확인합니다.
    • 확인: 이미지를 클릭하면 제작에 쓰인 프롬프트까지 보이며, 클로드 코드가 프롬프트를 짜는 방식을 역으로 배울 수 있습니다.
    • 팁: 첫 이미지를 만든 뒤 그것을 레퍼런스 삼아 모션만 바꿔 뽑는 식으로 일관성이 유지됐다고 합니다.

5부. 레퍼런스 없이 케이블카 인트로 만들기 (33~36단계)

원래 만들었던 케이블카 인트로의 대화 기록은 "이전 메시지가 표시되지 않는 상태"가 되면서 유실됐다고 합니다. 그래서 오푸스 5.5로 새로 다시 만들었고, 예전에 쓰던 리모션(Remotion, 코드로 영상을 만드는 도구)도 이번엔 빼고 오푸스 5.5만으로 끝냈다고 말합니다.

33. 새 프롬프트를 입력합니다.
    • 확인: 쉽게 말해 "힉스필드 MCP로 이미지 만들고 파이썬으로 영상 만들어 달라"는 요청입니다.

역시 원문은 화면 판독이 안 됐습니다. 말로 설명한 조건은 세 가지입니다.

• 케이블카 역에 관련된 Vox 스타일 영상 인트로 하나를 만들어 달라(목적을 명시)
• 요소는 힉스필드 MCP로, 그중 가성비가 제일 좋은 나노 바나나 2 이미지로 제작
• 하단의 "프롬프트 제작법"을 고려해 적절히 기획한 뒤 파이썬으로 영상 제작

34. 프롬프트 하단에 "프롬프트 제작법" 항목을 붙입니다.
    • 화자가 넣었다고 말한 항목: 팔레트(색상 지정), 강조색은 주인공·주체에만, 배경 제거, 가장자리는 찢어진 느낌, 그 밖의 모션·카메라 지시.
    • 팁: 화자는 "다 몰라도 문제되지 않는다. 궁금하면 긁어서 클로드에게 물어보라"고 말합니다.
    • 확인: 클로드가 나노 바나나 2로 힉스필드에서 이미지를 만든 뒤, 영상화와 인트로 구성까지 알아서 판단해 제작합니다.

33~34단계를 합친 예시입니다. 색상값과 길이는 편집자가 임의로 넣은 값이니 원하는 대로 바꿔 쓰면 됩니다.

스위스 그린델발트 케이블카 역을 소개하는 Vox 스타일 영상 인트로를 하나 만들어 줘.
요소 이미지는 힉스필드 MCP의 나노 바나나 2로 만들고,
아래 프롬프트 제작법을 고려해 장면을 기획한 뒤 파이썬으로 영상을 합성해 줘.

[프롬프트 제작법]
- 팔레트: 크림색 종이 배경, 짙은 남색, 회색, 강조색 빨강 한 가지
- 강조색은 주인공(케이블카)에만 쓴다
- 모든 요소는 배경을 제거해 따로 만든다
- 가장자리는 손으로 찢은 종이처럼 거칠게
- 모션: 요소마다 등장 타이밍을 조금씩 어긋나게, 종이가 살짝 흔들리는 느낌
- 카메라: 천천히 밀고 들어가는 줌인

35. 연출을 추가로 요청합니다.
    • 화자가 요청했다고 말한 것: 배경과 케이블카를 평면으로 쌓는 디오라마 형태, 배경은 멀리 있으니 흐리게, 케이블카는 위아래로 출렁이게, 원근감을 위해 돌들이 움직이게.
    • 확인: 화자는 이 결과가 "첫 트라이 만에 나온 것"이라고 말합니다.
36. (선택) 내레이션이 있다면 그 내레이션에 맞게 영상이 나오도록 요청합니다.
    • 확인: 지정하지 않은 빙하 장면 등도 알아서 만들어졌다고 말합니다.

35단계의 연출 요청은 이렇게 한 번에 보내면 됩니다(편집자 예시).

배경과 케이블카를 평면 종이로 여러 겹 쌓은 디오라마처럼 만들어 줘.
멀리 있는 배경은 흐리게, 케이블카는 위아래로 살짝 출렁이게,
앞쪽 돌들은 조금씩 움직여서 원근감이 나게 해 줘.

6부. 사운드 붙이기 (37~40단계)

37. 내레이션은 타입캐스트(Typecast)에서 만듭니다.
    • 확인: 원하는 내레이션 음성 파일이 생깁니다.
38. 지금까지 쓰던 클로드 대화창에 아래처럼 배경 음악 요청을 적습니다.
    • 확인: 스타일 칸과 가사 칸에 넣을 프롬프트를 받습니다.

이 영상에 어울리는 인트로 배경 음악을 수노(Suno)로 만들 거야

39. 받은 프롬프트를 수노(Suno)에 넣어 음악을 만듭니다.
    • 확인: 영상에 어울리는 음악이 나옵니다.
40. 만든 내레이션과 음악을 영상에 반영합니다.
    • 주의: 어떤 도구로 합쳤는지는 영상에 나오지 않습니다. 마지막 예시에서는 "편집 툴조차 쓰지 않았고 음악도 알아서 생성됐다"고 말합니다.
    • 대안: 편집 프로그램 없이 합치려면 음성·음악 파일을 작업 폴더에 넣고 아래처럼 요청합니다. 클로드 코드가 파이썬이나 FFmpeg(영상·음성 변환 도구)로 합쳐 줍니다.
    • 확인: 완성본이 나옵니다.

작업 폴더의 narration.mp3와 bgm.mp3를 방금 만든 영상에 넣어 줘.
내레이션이 잘 들리게 배경 음악은 작게 깔고, 끝에서 2초 동안 페이드아웃해 줘.

같은 방식으로 만든 추가 예시 3건

닐 암스트롱

달 착륙선에서 내려 성조기를 세우는 장면입니다. 같은 프롬프트 형태에 힉스필드 MCP를 쓰고, "프롬프트 제작법" 중 모션과 배리에이션만 참고시킨 뒤 닐 암스트롱 이미지 1장을 첨부했습니다.

콜럼버스 항해

옛날 지도 위를 배가 지나갑니다. 버드뷰에서 카메라가 30도 정도 사이드로 내려오는 연출에 구름을 추가해 달라고 요청했습니다. 여기서 한 번 막힙니다. 나노 바나나 2로 만든 구름이 배경을 가려 버린 겁니다. ChatGPT 이미지로 다시 만들었더니 배경이 투명한 구름이 나왔습니다. 화자는 배경 투명 이미지는 ChatGPT 이미지가 유리하고 나노 바나나는 그걸 못 한다고 말합니다.

포르쉐 박스터

Vox 스타일 토이 느낌으로, 버드뷰에서 타이어 드리프트 자국을 내며 이동합니다. 이미지는 힉스필드, 영상은 파이썬. 포르쉐 박스터 이미지 1장을 첨부했습니다(자막에 "프로 781"로 찍혀 718 박스터로 보이나 확정하지 못했습니다).

막히는 지점과 해결

• 클로드 앱이 일반 대화창으로만 열린다: 좌측 상단 메뉴에서 "코드"를 누릅니다.
• 오푸스 5.5가 안 보인다: 화자는 클로드 프로 정도의 요금제는 있어야 한다고 말합니다.
• 이미지를 매번 내려받아 폴더로 옮겨야 한다: 힉스필드 MCP를 연결하면 클로드가 알아서 만들어 옵니다.
• 크레딧이 많이 나간다: 모델이 나노 바나나 프로 2K로 잡혔을 때입니다. 나노 바나나 2, 1K로도 충분합니다.
• 구름 등이 뒤 배경을 가린다: 배경 투명 이미지는 ChatGPT 이미지로 만듭니다.
• 대화 기록이 사라졌다: 복구법은 영상에 없고 화자는 새 대화로 다시 만들었습니다. 잘 나온 프롬프트는 작업 폴더에 prompt.md 같은 파일로 따로 저장해 두면 기록이 사라져도 다시 쓸 수 있습니다.
• 움직임이 너무 매끄러워 Vox 느낌이 안 난다: 프레임 수를 줄이고 "한 장당 0.2초씩 뚝뚝 끊기게"처럼 넘김 속도를 지정해 다시 요청합니다.

Vox 스타일 완성 전 점검

• 클로드 코드에서 모델이 오푸스 5.5로 선택돼 있는가
• 설정 > 커넥터 목록에 힉스필드가 보이는가
• 모션을 여러 장의 분리된 이미지(예: 5장)로 나누도록 프롬프트에 명시했는가
• 크레딧을 아끼려면 나노 바나나 2, 1K로 지정했는가
• 배경이 투명해야 하는 요소(구름 등)는 ChatGPT 이미지로 만들었는가
• 사용한 프롬프트 전문은 영상 고정 댓글에서 확인했는가

40단계 중 실제로 손이 가는 곳

40단계로 풀어 놨지만 실제 작업량은 앞의 18단계, 그러니까 설치와 MCP 연결이 대부분입니다. 그 뒤로는 프롬프트를 던지고 계획을 읽고 승인하는 게 전부입니다. 핵심은 도구가 아니라 "모션을 5장의 분리된 이미지로 나눠 달라"는 그 한 문장입니다. 이 조건이 없으면 Vox 스타일 특유의 종이 애니메이션 느낌이 나오지 않습니다.

파이썬 합성 코드는 영상에서 한 번도 보여 주지 않습니다. 클로드가 알아서 한다는 말뿐입니다. 결과물의 해상도나 총 크레딧 사용량도 마찬가지입니다. 이 부분은 직접 돌려 보며 확인해야 합니다. 처음에는 짧은 길이와 1K 화질로 한 번 돌려 보고 크레딧 소모를 확인한 다음 늘리는 편이 안전합니다.

이 글은 원카AI Wonka 채널의 1156초 분량 영상을 자동 자막 기반(빠른 모드)으로 정리했고 화면은 대조하지 못했습니다. 영상 속 프롬프트 원문은 화면에만 떠 있어 판독하지 못했고, 글 안의 예시 프롬프트와 앱 설치 경로, 소리 합치기 요청문은 편집자가 덧붙인 것입니다. 화자는 프롬프트 전문을 영상 고정 댓글에 정리해 두겠다고 말합니다. 자막 표기는 "복 스타일"(Vox 스타일), "시덴스"(Seedance), "디오마라"(디오라마), "창륙선"(착륙선), "투기"(토이)로 잡혔습니다.

출처: youtu.be/…