창밖에는 비가 내리고, 컵 위로 김이 올라옵니다. 그런데 책상과 조명은 그대로입니다. 사진 한 장에서 작은 부분만 움직이면, 짧은 영상이라도 장면의 분위기가 달라집니다. 이런 표현을 시네마그래프(cinemagraph)라고 합니다. 사진과 영상 사이에 있는, 일부만 반복해서 움직이는 장면입니다.
이 글에서는 그림 전체를 영상 생성 모델에 맡기는 대신, 원본 위에 비나 김 같은 효과를 코드로 얹는 방법을 설명합니다. 코드를 처음부터 배울 필요는 없습니다. 먼저 Claude에 그림을 주고 무엇을 움직일지 말해 보세요. 움직일 범위와 결과를 확인하는 일은 사람이 맡습니다.
출발점은 일본 AI 아트 작가 Shironagasu의 공개 글입니다. 작성자는 Claude Opus 5.5가 Python과 OpenCV 코드를 작성·실행해 10초 반복 영상을 만들었다고 설명했습니다. 아래 그림과 영상은 그 작가의 작품을 가져온 것이 아닙니다. DMS.Labs가 새로 준비한 실습 예제이며, 이 글의 예제 영상은 로컬 Node.js·Sharp·FFmpeg로 합성했습니다. Claude 채팅에서 동일한 결과를 직접 재현했다고 주장하지 않습니다.
먼저 결과를 봅니다
10초 반복 실습 영상입니다. 창문 안쪽의 빗줄기와 컵 위의 김만 추가했습니다. 재생 버튼을 눌러 두 번 이어서 보세요. 소리는 넣지 않았습니다. 큰 몸짓이나 카메라 이동 없이도 정지 장면에 움직임을 더할 수 있다는 예제입니다.
실습용 원본입니다. 비 오는 도시가 보이는 창문과 오른쪽의 컵을 움직일 영역으로 선택했습니다.원본 전체 보기
어떤 원리인가요? 세 장을 겹친다고 생각하세요
그림을 움직이는 작업은 세 가지로 나눌 수 있습니다. 첫째는 그대로 둘 원본, 둘째는 움직여도 되는 영역을 정하는 마스크, 셋째는 그 영역에 올리는 효과입니다. 마스크는 구멍이 뚫린 종이와 비슷합니다. 구멍 안에서만 비가 보이고, 나머지 장면은 가려집니다.
원본, 마스크, 효과를 분리한 3D 개념도입니다. 판의 간격은 이해를 돕기 위한 표현이며 실제 합성은 평면 이미지에서 이루어집니다.원본 전체 보기
여기서 3D 개념도는 원리를 보여 주는 설명 그림입니다. 원본 사진을 입체 공간으로 바꾸거나, 숨겨진 사물의 뒷면을 만들어 낸다는 뜻은 아닙니다. 실제로는 같은 크기의 평면 이미지들을 겹쳐 한 프레임을 만듭니다. 그 프레임을 여러 장 만들고 차례로 재생하면 영상이 됩니다.
따라서 “영상 생성 AI를 쓰지 않았다”는 말도 구분해서 읽어야 합니다. Claude는 작업을 지시받고 코드를 쓰는 AI로 참여합니다. 사용하지 않는 것은 매 프레임의 그림을 새로 그리는 영상 생성 모델입니다. 이 글의 원본 이미지 자체는 GPT 이미지로 새로 만들었습니다.
준비물: 그림 한 장과 코드 실행이 가능한 Claude
본인이 사용 권리를 가진 PNG 또는 JPG 한 장을 준비합니다. 처음에는 창문, 물 표면, 컵처럼 움직일 곳이 분명한 그림이 좋습니다. 원본 파일은 따로 보관하세요. 크기를 줄인 작업본과 원본은 같은 파일로 덮어쓰지 않는 편이 안전합니다.
Claude 공식 도움말은 웹·데스크톱·모바일에서 코드 실행과 파일 생성을 지원한다고 안내합니다. 개인 계정에서는 Settings → Capabilities → Code execution and file creation을 확인합니다. 한국어 UI에서는 메뉴 이름이 다르게 보일 수 있습니다. 조직 계정이라면 관리자가 기능이나 패키지 설치를 제한했을 수 있으므로 회사 정책을 먼저 따릅니다.
그림을 읽고 설명하는 기능과, 코드를 실제로 실행해 파일을 만드는 기능은 다릅니다. Claude가 방법만 답하고 파일을 주지 않는다면 “코드를 실행해서 다운로드할 파일까지 만들어 주세요”라고 요청하세요. 그래도 실행이 불가능하면 글 아래의 대체 경로로 넘어갑니다. 기능이 지원된다는 사실만으로 모든 계정에서 MP4 제작이 끝까지 성공한다는 뜻은 아닙니다.
원문에 적힌 모델명은 Opus 5.5입니다. 자신의 계정에 같은 모델이 없다고 해서 새 요금제를 바로 결제할 필요는 없습니다. 사용 가능한 모델에서 작은 예제로 코드 실행과 파일 저장부터 확인하세요. 처리 시간과 사용량은 그림 크기, 프레임 수, 도구 환경에 따라 달라집니다.
1단계. 움직일 곳을 하나만 고릅니다
처음부터 비, 눈 깜빡임, 바람, 조명, 카메라 이동을 모두 요청하면 무엇이 잘못됐는지 찾기 어렵습니다. 이 예제라면 먼저 창문 안의 비만 선택합니다. 비가 잘 들어간 뒤 컵의 김을 추가하는 순서가 편합니다.
좋은 그림에는 움직일 영역과 고정할 영역 사이에 뚜렷한 경계가 있습니다. 창틀이 사각형이고 유리 앞에 물체가 거의 없다면 마스크를 만들기 쉽습니다. 반대로 나뭇가지나 머리카락이 창문을 촘촘하게 가리면, 그 물체를 비가 덮지 않도록 더 세밀하게 잘라내야 합니다.
사람의 고개를 돌리거나 손을 들게 하는 동작은 이 방식의 첫 실습으로 적합하지 않습니다. 정지 그림에 없는 모습까지 새로 만들어야 하기 때문입니다. 눈 깜빡임도 눈꺼풀을 직접 그려 넣는 과정이 생겨 어색할 수 있습니다. 첫 예제에서는 사람 없는 창문과 컵을 사용한 이유입니다.
2단계. 그림을 첨부하고 이 요청문을 보냅니다
Claude의 새 대화에서 첨부 버튼으로 그림을 올립니다. PNG/JPEG 등의 이미지 업로드가 지원됩니다. 파일이 크면 실제 업로드 화면의 제한을 확인하고 작업본을 줄이세요. 그림 속 비밀 문서, 고객 정보, 사용 허락이 없는 얼굴이 외부 서비스에 전달되지 않도록 먼저 살펴봅니다.
다음은 이 글을 위해 새로 작성한 실습용 요청문입니다. 원작자의 일본어 프롬프트를 그대로 옮긴 문장이 아닙니다. 처음에는 비 한 가지에 집중합니다.
첨부한 그림으로 10초짜리 시네마그래프를 만들어 주세요.
영상 생성 모델로 전체 그림을 다시 그리지 말고,
코드를 작성하고 실행해 원본 위에 움직임을 합성해 주세요.
1. 창틀을 제외한 창문 유리 영역에만 가느다란 비가 내리게 합니다.
2. 책상, 컵, 조명, 벽은 움직이지 않습니다. 카메라도 고정합니다.
3. 먼저 움직일 영역을 색으로 표시한 마스크 미리보기를 보여 주세요.
4. 마스크를 확인한 뒤 10초·24fps·무음 MP4로 출력해 주세요.
5. 끝에서 처음으로 돌아갈 때 비가 갑자기 튀지 않도록 설계합니다.
6. 원본 파일을 덮어쓰지 말고, 사용한 코드도 함께 주세요.
도구가 없어 실행할 수 없다면 완료했다고 말하지 말고,
빠진 도구와 제 컴퓨터에서 실행할 방법을 알려 주세요.
길이를 10초, 속도를 24fps로 적으면 총 240프레임을 만드는 작업이 됩니다. fps는 1초에 보여 주는 그림의 수입니다. 이 값은 실습용 선택이지 반드시 지켜야 하는 시네마그래프 규격은 아닙니다. 처리 시간이 길거나 파일 저장이 막히면 먼저 3초·작은 해상도의 미리보기를 요청한 뒤 길이를 늘립니다.
3단계. 마스크를 보고 경계를 고칩니다
완성 영상보다 마스크를 먼저 보세요. 창문 전체에 파란색이 칠해져 있어도 창틀과 화분까지 포함됐다면 수정해야 합니다. 마스크는 “어디에 효과를 허용했는지”를 보여 줍니다. 색으로 표시한 부분이 곧 자연스러운 비 효과라는 뜻은 아닙니다.
실제 예제의 영역 표시입니다. 파란색은 추가 효과를 허용한 창문 안쪽과 컵 위의 제한된 영역입니다.원본 전체 보기
경계가 잘못되면 좌표부터 공부하기보다 눈에 보이는 문제를 설명하세요. “왼쪽 아래 화분 잎에는 비가 보이지 않게 해 주세요”, “가운데 나무 창틀은 원본으로 남겨 주세요”처럼 말합니다. 수정된 마스크와 정지 프레임을 다시 받은 뒤 영상 출력으로 넘어갑니다.
비가 자리 잡았다면 다음 요청을 덧붙입니다. 김은 컵 안에서 시작하고, 화면 전체를 뿌옇게 덮지 않도록 제한합니다.
지금 확정한 비와 마스크는 유지합니다.
컵 입구에서 시작하는 옅은 김을 추가해 주세요.
김은 천천히 위로 올라가며 옆으로 조금 흔들리게 합니다.
컵 몸체와 책상은 고정하고, 김이 조명이나 창문 전체를 덮지 않게 합니다.
수정된 영역 표시와 한 장의 미리보기를 먼저 보여 주세요.
4단계. ‘10초짜리’와 ‘끊김 없는 반복’을 구분합니다
10초 영상이라고 해서 자동으로 부드럽게 반복되는 것은 아닙니다. 마지막 프레임에서 빗방울이 아래쪽에 있는데 다음 순간 맨 위로 튀면 재생이 끊긴 것처럼 보입니다. 비나 김의 위치·밝기가 일정한 주기로 돌아오도록 설계해야 합니다.
같은 원본을 유지하며 효과의 위상을 바꾸고 시작 상태로 돌아오는 반복 개념도입니다.원본 전체 보기
프로그래밍에서는 시간을 0부터 1까지 반복하는 값으로 바꾸어 효과를 움직일 수 있습니다. 시작 상태와 정확히 10초 뒤 상태가 같아지도록 계산하는 식입니다. 실제 MP4에는 10초 지점의 중복 프레임을 꼭 넣어야 하는 것은 아닙니다. 마지막 프레임 다음에 첫 프레임이 자연스럽게 이어지는지가 중요합니다.
영상에 TV 화면을 넣는다면 별도 영상 파일의 시작과 끝도 맞춰야 합니다. 원작자는 TV 화면에 영상을 변형해 넣고 창문의 반사에도 같은 영상을 반전·흐림 처리해 합성했다고 설명했습니다. 이 작업은 비만 얹는 예제보다 복잡하므로 첫 실습을 마친 뒤 시도하세요. 삽입하는 영상과 음악의 사용 권리도 따로 확인합니다.
5단계. 파일을 내려받기 전에 네 곳을 확인합니다
재생 버튼을 눌러 두 번 이상 반복해 봅니다. 창틀, 컵의 가장자리, 효과가 끝나는 경계, 마지막에서 처음으로 돌아오는 순간을 차례로 살펴보세요. 효과가 약하면 전체 화면을 흔들기보다 비의 밝기나 김의 농도를 조금씩 조절합니다. 한 번에 한 항목만 바꾸면 어떤 수정이 도움이 됐는지 알기 쉽습니다.
표가 넓으면 좌우로 스크롤하여 확인하세요.
| 보이는 문제 | 다음에 보낼 수정 요청 |
|---|---|
| 창틀이나 화분 위에도 비가 생깁니다 | 해당 물체를 마스크에서 빼고, 고정 영역 비교 이미지를 보여 주세요. |
| 김이 화면 전체를 뿌옇게 만듭니다 | 컵 위의 작은 영역으로 제한하고 투명도를 낮춰 주세요. |
| 반복할 때 갑자기 밝아집니다 | 효과의 시작·끝 위상을 맞추고 경계 전후 프레임을 보여 주세요. |
| 그림 전체가 확대되거나 흔들립니다 | 카메라 이동과 전체 변형을 제거하고 원본 구도를 고정해 주세요. |
| 코드만 있고 영상 파일이 없습니다 | 코드를 실제로 실행하고 MP4를 첨부해 주세요. 실행 불가하면 이유를 알려 주세요. |
“고정 부분의 픽셀을 유지한다”는 말에는 조건이 있습니다. 합성 단계에서 효과 바깥의 배열 값을 그대로 두는 것과, MP4를 다시 읽었을 때 모든 픽셀이 원본과 같은 것은 다릅니다. 크기 변경, 색 변환, H.264 손실 압축 때문에 값이 달라질 수 있습니다. 그림의 형태를 유지하는 데 유리한 방법이지, 일반 MP4가 원본 PNG와 완전히 같다는 보장은 아닙니다.
Claude에서 MP4를 만들지 못했다면
코드 실행이 꺼져 있거나 필요한 도구가 없으면 먼저 “무엇이 부족한지” 답을 받습니다. 조직 계정의 보안 설정을 임의로 풀거나, 모르는 설치 명령을 그대로 실행하지 마세요. 로컬 실행으로 바꾸려면 Claude에 사용 중인 운영체제, 설치된 Python 또는 Node.js, FFmpeg 유무를 알려 주고 그 환경에 맞는 실행 절차를 요청합니다.
Python·OpenCV는 이미지와 마스크를 다루는 한 가지 조합이고, FFmpeg는 프레임을 MP4로 묶는 도구입니다. 이 글의 로컬 예제는 다른 조합인 Node.js·Sharp를 사용했습니다. 선택한 언어가 원리의 핵심은 아닙니다. 원본을 고정하고, 제한된 영역에 효과를 만들고, 반복을 검사하는 순서는 같습니다.
아래 소스는 이 글의 원본 그림에 맞춘 실습 코드입니다. 다른 그림에 그대로 실행하면 창문과 컵 위치가 맞지 않을 수 있습니다. 범용 자동 인식 도구가 아닙니다. 코드를 검토할 수 있는 독자는 소스와 원본을 함께 보관해 예제의 구조를 살펴볼 수 있습니다.
실습 JavaScript 소스 · 원본 PNG · 완성 MP4
로컬 코드 실행에 익숙한 분은 Node.js와 FFmpeg가 설치된 환경에서 새 폴더를 만들고, 소스를 cinemagraph.cjs, 원본을 base.png라는 이름으로 저장합니다. 그 폴더에서 아래 명령을 실행합니다. npm install sharp는 이미지 처리 패키지를 설치하는 명령입니다. FFmpeg가 명령줄에서 실행되지 않으면 먼저 설치 경로를 확인해야 합니다. 회사 PC에서는 설치 권한을 확인하세요.
npm install sharp
node cinemagraph.cjs base.png
실행 폴더에 demo.mp4와 마스크·검사 파일이 저장됩니다. 이미 같은 이름의 결과 파일이 있으면 덮어쓰므로 빈 실습 폴더를 사용합니다. 코드 실행이 낯설다면 이 대체 경로를 억지로 따라 하기보다 Claude의 파일 생성 경로부터 시도하세요.
처음 만드는 분이라면 여기서 멈춰도 괜찮습니다. 그림 한 장, 움직일 곳 한 군데, 마스크 미리보기까지 성공하면 다음 실습의 기준이 생깁니다. 그 다음에 비의 밝기를 조절하고, 컵의 김을 더하고, 두 번 반복해서 확인하세요.
참고 자료와 제작 범위
- Shironagasu의 시네마그래프 제작 글
- Claude 공식: 파일 업로드
- Claude 공식: 코드 실행과 파일 생성
- OpenCV 공식: 이미지 읽기와 쓰기
- FFmpeg 공식: 이미지 시퀀스 입력과 영상 출력
원리 참고: Shironagasu. 실습 원본: GPT 이미지. 실습 영상·마스크: Claude Sonnet 5.5가 작성한 Node.js·Sharp 코드와 FFmpeg. 3D 개념도: Claude Opus 5.5와 Blender. 개념도는 합성 원리 설명용이며 원작자의 구현 화면이나 실제 고객 프로젝트가 아닙니다.
