AI 코딩 프롬프트 기록 2026-11-06 13~19시

· 약 9분 읽기 · 조회 0 #개발기록#프롬프트#Claude Code#Codex#모션그래픽

14:37 1분 자기소개 영상 · Codex

개인 소개 스토리를 짓고 동작하는 캐릭터를 연결하고 배경을 그려서 1분짜리로 영상 만들어 줄래.

배경 3장과 6개 장면으로 1080p·30fps·60초 MP4(약 31MB)를 만들었다. 최종 파일 디코딩과 브라우저 끝까지 재생도 확인했다.

14:47 Claude Code로 캐릭터 움직이기 · Codex

클로드코드를 이용해서 캐릭터를 만들고 움직이고 동작하게 만들수 없나?

가능하다는 답을 받았다. Claude Code가 코드와 도구 실행을 맡고 그래픽 도구가 렌더하는 구조이며, SVG·Canvas로 부위를 나눠 제어하는 방식을 표로 정리해 줬다.

14:47 여성 캐릭터 일러스트 · Codex

일러스트 여자 캐릭터 그려 줄래

팔과 손이 잘 보이는 여성 전신 일러스트를 그렸다. 애니메이션용 부위 분리는 아직 하지 않았다.

14:47 달리기 GIF · Codex

방금 만든 전신 일러스트를 이용해서 해당 캐릭터가 뛰어 가는 gif 생성 가능 하니

imagegen으로 자세 8개를 만들고 FFmpeg로 이어 붙였다. 이동 GIF(3.84초)와 투명 배경 제자리 GIF 두 개가 나왔고, 프레임마다 외형에 작은 차이가 있다.

14:47 캐릭터 뮤직비디오 · Codex

해당 움직이는 캐릭터들을 다양하게 만들어 뮤직비디오 주인공으로 넣어서 영상을 만들 수 있나?

외형 고정 → 동작 제작 → 음악 구간별 장면 설계 → 합성의 4단계 구성안을 받았다.

14:47 자기소개 영상 재요청 · Codex

개인 소개 스토리를 짓고 동작하는 캐릭터를 연결하고 배경을 그려서 1분짜리로 영상 만들어 줄래.

배경 3장과 인사·생각·메모·기쁨·노트북 작업 자세를 만든 뒤 장면을 연결하는 중이라는 진행 보고가 왔다. 완성본은 14:37 항목의 결과다.

17:10 15초 모션 쇼릴 · Claude Code

'당신이 얼마나 놀라운 모션 디자이너인지 보여주는 역동적인 15초 모션 그래픽 비디오를 만들어 보세요. 마치 이력서용 쇼릴처럼요. 전력을 다해 주세요'

검은 점 하나가 장면마다 모양을 바꾸는 1920×1080·30fps·15초 영상이 나왔다. HeyGen이 없어 배경음악은 빠지고 효과음만 들어갔다.

17:11 UI 모핑 120BPM 루프 · Claude Code

나한테 물어봐: 모양이 변할 8~12개의 UI 상태 (예: 버튼, 로더, 플레이어, 슬라이더, 토글, 탭, 차트, 명령 팔레트, 토스트), 순수 흑백 또는 하나의 강조 색상, 그리고 약 120 BPM의 로열티 프리 송 (예: Mixkit, 상업적 사용 무료).

Dribbble 수준의 UI 모션. 하나의 모양, 절대 자르지 말기: 모든 상태는 동일한 요소가 크기, 반경, 색상을 변형하며 콘텐츠가 짧은 블러와 함께 교체되는 거야. 커서가 모든 변화를 실제 클릭과 드래그로 주도해. 밝은 따뜻한 회색 캔버스, 흑백 컴포넌트, 하나의 깔끔한 UI 폰트 (Geist). 스프링이 어디에나, 최대한 작은 오버슈트. 카메라가 줌인해서 각 상태가 프레임을 꽉 채워. 마지막 프레임은 첫 번째 프레임이야, 그래서 루프돼.
금지: 바운시 이징, 파티클 버스트, 글로우, UI 크롬의 그라데이션, 맞지 않는 아이콘 스트로크, 데드 타임, 템플릿처럼 보이는 어떤 것도.

120 BPM, 7 바, 모든 비트마다 무언가 일어나.
버튼 → 로더 → 체크 → 다이나믹 아일랜드 → 재생/일시정지 모프가 있는 음악 플레이어 → 진행 바 스크럽 → 최대치를 넘겨 드래그할 때 늘어나는 볼륨 슬라이더 → 비트에 맞춰 토글이 뒤집혀 → 노브가 액체 같은 탭 인디케이터가 돼 → 탭이 열리며 차트가 스스로 그려져, 호버 시 툴팁 → ⌘K로 접히며 → 입력으로 필터링 → 엔터 → 토스트 → 버튼으로 돌아가.

  1. 하나의 HTML 파일, 정사각형 1440x1440. 모든 스타일은 seek(t) 안의 시간으로부터 계산: CSS 트랜지션 없음, 타이머 없음, 프레임 간 상태 유지 없음.
  2. 스프링은 닫힌 형태의 스텝 응답. 타겟이 여러 번 바뀌는 값은 각 변화당 하나의 스프링 합으로, 순수 시간 함수로 유지.
  3. 탭 인디케이터의 두 가장자리가 다른 스프링을 타, 선행 가장자리가 후행 가장자리보다 앞서 늘어나. 토글 노브도 같은 트릭.
  4. 드래그는 직접 조작: 커서가 잡혀 있는 동안 값은 위치로부터 계산. 놓으면 어디에 있었든 스프링으로 돌아가.
  5. 노래를 numpy로 분석해 비트 그리드 만들고 다운비트에서 시작. 모든 UI 사운드를 측정한 피크에 맞춰 배치.
  6. Playwright로 렌더: 프레임당 4 서브프레임, ffmpeg tmix로 블렌딩해 60fps 모션 블러.
  7. 전체 렌더 전에 비트당 하나의 프레임 렌더. 그리드 벗어난 거, 좁거나 읽기 힘든 거 고쳐.

카메라가 스케일하거나 텍스트가 블러리하게 렌더되는 것에 will-change 두지 마. 모핑 컨테이너 안에서 교체되는 텍스트는 자체 진입/퇴장 타이밍이 필요하거나 겹쳐. 마지막 프레임을 첫 번째와 동일하게 만들어, 커서 위치와 속도 포함, 아니면 루프가 끊겨.

입력값을 나한테 물어본 후, 코드 쓰기 전에 비트 그리드에 상태 리스트를 보여줘.

Mixkit 후보 130곡을 numpy로 재서 "House Vibes"(120.058 BPM)를 골랐다. 7바 28비트 그리드와 상태 순서를 먼저 보여 줬다.

봉져줘

1440×1440·60fps·840프레임, 정확히 14.000초짜리 루프 영상이 나왔다. 루프 이음새는 픽셀 단위로 확인했지만, 실시간 재생과 소리 확인은 하지 않았다.

17:12 Apple 키노트 스타일 런치 필름 · Claude Code

저에게 요청하세요: 워드마크를 위한 한 단어 브랜드 이름 (동사가 가장 좋습니다), 9~12개의 고해상도 사진, 120 BPM 정도의 로열티 프리 송 (드롭과 조용한 브레이크다운이 있는, Mixkit에서 상업적 사용 무료), 그리고 움직이는 식물 그림자가 있는 평범한 벽의 무료 스톡 클립 (Pexels).

Apple 키노트 런치 필름, 2D 전용, 하나의 연속 테이크. 모든 장면은 이전 장면에서 만들어집니다: 페이드, 블러, 컷 없음. 대신 객체가 모양을 바꿉니다: 텍스트가 마스크 선에서 솟아오르고, 아이콘이 스프링으로 제로에서 튀어나오며, 바가 가로로 그어지고, 페이지가 밀려오며, 검은 모양이 전체 프레임을 채우고 다음 장면으로 수축합니다. 따뜻한 오프화이트 캔버스, 검은 UI, 사진 위에 iOS 26 액체 글라스. 워드마크는 Archivo (wdth 125, weight 800), UI는 Geist. 커서가 모든 변화를 실제 클릭, 드래그, 롱프레스로 주도합니다. 카메라가 스크린 스튜디오 스타일로 줌인하여 각 순간이 사각형을 채우고, 커서가 그에 맞춰 스케일됩니다.
금지: 크로스페이드, 블러-인, 밝기 "개발", 3D 플립, 파티클, 글로우, 1초 이상 홀드, 템플릿처럼 보이는 모든 것.

120 BPM, 54 비트, 매 비트마다 무언가가 일어납니다.
오프닝: 워드마크가 아코디언처럼 자신의 마침표로 짜집니다, 점이 검은 알약으로 자라며, 그 안에 라벨이 솟아오릅니다. 클릭: 여섯 개의 아이리스 블레이드가 라벨 위로 닫혔다가 사진으로 스냅 오픈합니다. 원이 사각형이 되고, 축소되며, 그리드가 뒤에서 종이 지도처럼 펼쳐집니다 (센터, 플러스, 코너), 벤토로 재배치되고, 클릭으로 하나의 타일로 줌인하여 정확히 드롭에 착지합니다.
글라스: 글라스 워드가 글자 단위로 튀어나오며, 액체 방울로 녹아 글라스 툴바로 늘어집니다. 조정 아이콘이 슬라이더로 바꿉니다. 드래그로 사진이 낮에서 골든 아워로 재조명됩니다 (두 개의 정렬된 샷), 노브가 잡힌 동안 글라스 렌즈로 변합니다. 그것이 글라스 오브로 들리며, 다음 사진이 원형으로 그 안에 열리고, 오브가 확장되어 락 스크린이 됩니다: 글라스 시계 숫자, 날짜, 그리고 홈 바가 글라스 음악 플레이어로 늘어나는.
스테이지: 락 스크린이 화면 가장자리에서 베젤이 자라나며 폰으로 당겨집니다. 다이나믹 아일랜드가 액체처럼 늘어나며, 끊어져 날아가 맥 창으로 자라며 블라인드처럼 말려 올라갑니다. 월페이퍼 롱프레스, 사파리 탭으로 드래그, 페이지가 밀려 들어오고, 떨어뜨리면 랜딩 페이지의 히어로가 됩니다. 스크롤: 히어로가 제품 카드의 액자 프린트로 변형되며, 매트와 몰딩이 사진 가장자리에서 자랍니다. 프레임 색상 선택 (가로로 칠해짐)과 크기, 그런 다음 네비 버튼이 "Order print"로 날아 내려갑니다.
오더: 하나의 검은 모양이 계속 변형: Ordered ✓ → Printing % → On its way (루트 위의 밴) → Delivered ✓.
월: 전달된 원이 프레임 가장자리 끝까지 …(생략)

Claude Code는 시작 전에 브랜드 이름, 사진 9~12장, 곡, 스톡 클립을 요청했다. 입력을 아직 주지 않아 제작은 시작되지 않았다.

17:36 프롬프트를 내 주제로 바꾸는 법 · Claude Code

지금 프롬프트으로 멋진 영상을 만들었는데 만약 내가 만들고 싶은 주제로 만들려면 프롬프트 어떻게 입력 해야 돼?

6칸 구조 중 <direction>과 <structure>는 꼭 고치고, <inputs>는 주제에 맞게 고치고, 나머지는 거의 그대로 두라는 답과 복사용 템플릿을 받았다.

17:37 물의 순환 루프 · Claude Code

교과서 일러스트를 Dribbble 수준 모션으로. 하나의 규칙: 같은 물방울 하나가
구름·빗방울·강·수증기로 변형된다. 컷 없음. 밝은 하늘색 캔버스, 남색 요소,
강조색은 햇빛 노랑 하나, 폰트 Pretendard. 각 단계에 한국어 라벨 한 단어.
금지: 만화 캐릭터, 파티클 비, 그라데이션 하늘, 데드 타임.

120 BPM, 6바. 바다 위 물방울 → 햇빛에 데워져 늘어나며 수증기 → 위로 떠서
모여 구름 → 무거워져 아래로 처짐 → 빗방울로 떨어짐 → 땅에 퍼져 강 →
바다로 흘러 처음 물방울로 돌아감.

"Winter Breeze"(120.065 BPM)를 고르고 24비트 그리드와 라벨 표를 먼저 보여 줬다.

진행시켜

1440×1440·60fps·12.000초, -14 LUFS의 루프 영상이 나왔다. SVG 경로 하나를 점 128개로 샘플링해 모든 상태를 표현했다.

18:46 새 기술 아티클 5편 발행 · Claude Code

/blog-tech-article 기존에 썼던 내용이 아닌 새로운 블로그 주제 5개를 선별해서 글을 쓰고 올려줘.

기존 85편과 겹치지 않는 Rate Limiting, Virtual Thread, Kafka 등 5편을 발행했다. check_live.py에서 5편 모두 PASS가 나왔다.

모아 보니

  • 용도에 따라 도구를 나눴다. 이미지 생성이 필요한 일러스트 캐릭터 작업은 Codex에서, 수식과 코드로 모든 프레임을 계산하는 모션 작업은 Claude Code에서 했다.
  • 긴 사양에는 확인 단계를 넣었다. "나한테 물어봐"로 시작하고 "코드 쓰기 전에 비트 그리드를 보여줘"로 끝냈다. 그래서 곡 선택과 비트 배치를 먼저 확인한 뒤 "봉져줘", "진행시켜" 같은 짧은 한마디로 렌더를 맡길 수 있었다.
  • 잘 나온 프롬프트를 템플릿으로 만들었다. 결과물이 마음에 들자 바로 "내 주제로 하려면 어떻게 쓰나"를 묻고, 그 답대로 교과서용 물의 순환 주제를 짧게 써서 재사용했다.
  • 가능 여부를 묻는 질문과 바로 만드는 요청이 섞여 있었다. "가능 하니", "만들 수 있나?"처럼 물어도, 결과물이 함께 나오거나 구체적인 구성안을 받았다.

댓글 0개

아직 댓글이 없습니다. 첫 댓글을 남겨보세요.

댓글 쓰기

← 목록으로 돌아가기