요약
Claude Code가 실제 브라우저 화면을 녹화해 제품 데모 영상까지 만들어 주는 스킬이 공개됐습니다.
GitHub 이용자 aaitor가 공개한 오픈소스 스킬입니다. 그는 제품을 만드는 데만 몰두하느라 매뉴얼이나 영상 같은 홍보 자료는 늘 뒷전이었다고 했습니다. 그래서 그 마지막 단계를 AI에게 맡기려고 만들었다고 밝혔습니다.
왜 중요한가
- 개발자가 가장 미루기 쉬운 데모 영상 제작을 AI 에이전트에게 통째로 맡기려는 시도입니다.
- 새 편집 프로그램이 아니라 Playwright, FFmpeg 같은 기존 도구를 에이전트가 차례로 다루게 하는 작업 지침 묶음입니다.
핵심 내용
- 기획서 작성, 제품 탐색, 브랜드 적용, 화면 녹화, 합성, 렌더링과 품질 검사, 썸네일 순으로 진행합니다.
- Playwright CLI로 실제 브라우저 조작을 녹화하고, HyperFrames로 제목 카드와 챕터, 행동 유도 문구(CTA)를 입힙니다.
- FFmpeg와 ffprobe로 원본과 웹용 사본을 만들고, 주요 장면을 한 장에 모은 이미지로 결과를 점검합니다.
- 내레이션, 배경음악 6가지, 자막, 발표자 영상은 선택 사항이고, 음성과 아바타에는 외부 서비스나 GPU 서버가 필요합니다.
- MIT 라이선스로 공개됐고, 세로형 소셜 영상 형식은 아직 지원하지 않습니다.
HN 반응
- 작성자의 예시 영상에서 내레이션이 중간에 잘리고 배경음악이 너무 커서 말소리를 덮는다는 지적이 여러 댓글에서 나왔습니다.
- 스킬 없이 Claude Opus 5.5만으로 만든 영상과 거의 같다는 비교가 나오며 무용론이 일었고, 같은 작업을 반복할 때는 쓸모 있다는 반론도 있었습니다.
새 제품을 만들 때마다 저는 늘 (잘못되게도) 만드는 일에만 먼저 집중했고, 배포하고 다른 사람들이 쓰게 돕는 일은 뒷전이었습니다.
물건을 다 만들고 새 장난감이 돌아가는 걸 보며 한껏 들뜨고 나면, 홍보와 소통은 늘 의무처럼 느껴졌고 대개 방치했습니다. 매뉴얼, 영상, 지원 콘텐츠 같은 걸 만드는 게 항상 힘들었습니다.
그래서 그 마지막 부분을 도와주는 Claude Code용 스킬을 오픈소스로 공개했습니다. 몇 가지 지침과 이 스킬만 있으면 제품 데모 영상을 만들 수 있습니다. 전문가 수준의 내레이션과 여러 언어 자막까지 넣을 수 있고, 브라우저와 터미널을 함께 다룹니다. 모든 걸 AI에서 제어합니다. 이 글에 올린 클립도 이걸로 만들었습니다.
배포까지 대신해 주지는 않지만, 시작으로는 괜찮을 겁니다 ;)
https://github.com/aaitor/skill-video-studio
예시 영상을 보면 내레이터의 말이 중간에 잘리는데요: https://youtu.be/H6npd3uuqls?t=11
맞습니다, 소프트웨어 엔지니어로서 저한테도 이게 가장 괴로운 부분입니다. 자기 홍보를 금지하는 커뮤니티가 많은 것도 한몫합니다. 저 쓰려고 도구를 만드는 데 N시간을 들였다면[0], 그걸 남들과 나누겠다고 자기 홍보라는 비난을 피해 가며 또 Nx시간(x는 어떤 배수)을 쓰고 싶지는 않습니다. 다행히 HN은 레딧 커뮤니티나 lobsters보다 이 점에서 훨씬 너그럽습니다. 물론 그쪽도 나름대로 훌륭한 곳이지만요.
[0] https://github.com/aleyan/dela
아이디어는 좋은데 데모 영상은 손볼 데가 있습니다. 음악이 너무 크고 정신 사납습니다. 특히 4분의 4박자로 쾅쾅 울리는 킥드럼이 그렇고, 내레이션이 들어갈 자리를 내주려고 사이드체인 컴프레션을 꽤 세게 건 것 같은 소리도 납니다.
저는 지금 Claude Code로 제품 영상을 만드는데, 좋은 점 하나는 직접 쓰는 모습을 녹화하거나 스크린샷을 이어 붙이는 대신 UI를 아예 다시 만들게 할 수 있다는 점입니다. 그러면 UI 전체를 애니메이션으로 움직일 수 있고, 영상에 맞게 원하는 대로 바꿀 수도 있습니다.
스킬을 쓴 경우와 안 쓴 경우를 비교해 봤습니다.
스킬 없이: https://non.io/video/diffui-product-vid-opus-only.mp4
스킬 사용: https://non.io/video/diffui-product-vid-with-skill.mp4
그리고 playwright에는 심각한 CVE가 여럿 있으니, 이걸 쓸 때는 조심하고 이미 설치한 것도 패치하세요.
둘이 토큰을 각각 얼마나 썼는지 알아봐 주실 수 있나요?
경우에 따라 스킬의 요점은 모델에 맥락을 전부 넘겨줘서, 모델이 직접 찾아보지 않아도 되게 하는 것입니다(찾아보다가 관련 없는 내용으로 컨텍스트 윈도를 채우는 일도 있으니까요).
제 눈에는 거의 똑같아 보이는데요. 둘 다 같은 제품을 찍은 영상이긴 하지만, 그래도 큰 차이가 뭔가요?
제가 보여 주려던 게 바로 그겁니다. 스킬을 만든 분을 깎아내리려는 건 아니지만, 요즘 모델은 혼자서도 정말 잘하기 때문에 스킬 없이 어떤 결과가 나오는지 확인해 보는 건 언제나 가치가 있다고 생각합니다.
Opus 5.5와 Astra는 (그쪽으로 RL 학습을 받아서) 이런 일 대부분을 이미 아주 잘합니다. 제가 보기에 스킬이 쓸모 있는 경우는 두 가지입니다. 1) 새로 나온 커스텀 CLI나 MCP 사용법을 가르칠 때. 2) 간단한 검색으로는 찾기 어려운 함정, 팁, 요령을 설명하거나, 찾기 쉬운 정보라면 토큰을 조금 아껴 줄 때. OpenAI와 Anthropic 팀도 스킬은 줄이라고 이미 말했습니다. 컨텍스트 공간을 괜히 낭비할 수 있으니까요.
큰 차이는 거슬리는 음악이죠.
스킬이 만든 영상 위에 localhost까지 얹혀 있으니, 다들 좋아하는 그 수제 느낌이 더해지네요. /s
제 틱톡에 올린 제품 영상은 전부 제가 만든 비슷한 Claude 플러그인으로 만든 겁니다.
https://www.tiktok.com/@everydaylentils
데모에는 AI 아바타가 화면에 나옵니다(배너가 달린 영상은 모두 이 플러그인으로 만들었습니다). 본인 fal.ai 키만 쓰면 되고, 저는 데모 하나에 2달러 정도 씁니다. https://github.com/mrieck/demoday-claude-plugin#top
이 스킬이 보탬이 되는 게 많을지 의문입니다. Opus 5.5 이전에도 이런 모델들은 영상을 만들기에 충분했어요. 예를 들어 https://fretta.ai 의 데모를 보세요.
오디오와 효과음을 넣는 것도 ElevenLabs를 더하면 쉽습니다.
이런 스킬은 자기 회사의 스타일에 맞춰, 영업팀의 지침을 받아 만들 만한 가치가 있습니다.
저는 데모용으로 하나 만들어 뒀는데[1], computer use와 ffmpeg를 제가 원하는 방식으로 씁니다.
우리 팀이 콘퍼런스나 다른 영업 행사에 나갈 때는 이 데모로 만든 "부스" 패키지[2]를 들고 갑니다. 회사와 사용 사례는 그 전 주말에 가져옵니다.
[1] https://gist.github.com/5d4cb99549f7e81a1433a4a13b20622c
[2] https://demos.isotopes.ai/pages/chicago-booth/#walmart
저는 웹 앱이 아니라 네이티브 앱을 대상으로 하기 때문에 Playwright는 제 스택과 무관해서 이 스킬을 쓰지는 않습니다. 다만 (이미 진행 중인 별개의 프로젝트의 일부로) 그 프로젝트용으로 아주 비슷한 걸 만들고 있습니다. Claude가 제품 사용 과정을 단계별로 밟아 가며 녹화하는 스크립트를 쓰게 하는 겁니다.
마케팅 사이트의 제품 영상에 지난 6개월간 만든 새 기능이 하나도 안 들어 있는 건, 릴리스마다 손으로 녹화하기 귀찮고, 스크립트까지 짜는 건 과하다 싶고, 더 중요하게 만들 게 있어서라는 거잖아요... 그런 생각은 AI 이전인 2025년식 사고방식 같습니다.
저도 제 제품의 인스타그램 계정용으로 이걸 하기 시작했습니다(이 스킬을 쓴 건 아닙니다). https://www.instagram.com/trysojourn/
어떤 영상 편집 도구를 쓰세요?
Claude Code, ffmpeg, iOS 시뮬레이터, 그리고 Claude Code가 필요하다고 판단하는 건 뭐든 쓰는 것 같습니다.
아주 흥미롭네요, 감사합니다. 저는 얼마 전부터 Claude Code로 filmcraft-cli를 돌려 제품 영상을 만들고 있고, 음성 해설은 elevenlabs를 씁니다. 저 혼자 하는 건 모바일 화면 녹화뿐인데, cc가 어떻게든 그것도 해 줄 수 있을지도 모르겠네요. 최근에 편집한 영상 하나입니다. https://www.instagram.com/p/DfJrVhwMSLP/
https://github.com/storytold/filmcraft
공유해 주신 건 감사한데, 예시 결과물[0]을 직접 보기는 하신 건가요? 내레이션은 끊기고, 드럼은 나머지 음악과 박자가 안 맞아요(앞서가요).
[0] https://www.youtube.com/watch?v=H6npd3uuqls
게다가 믹싱도 들쭉날쭉하고 배경음악이 내레이션을 덮어 버립니다.
영상을 보는 건 너무 일이잖아요. 그건 AI 에이전트가 대신 하게 해야죠.
스킬은 AI 과대광고가 너무 심해서 어이가 없네요...
비전문가에게는 흥미로울 수 있겠다 싶지만, 아니 그냥 컨텍스트에 글이 더해지는 것뿐이지 무슨 마법이 아니잖아요. Pockock의 스킬이 엄청나게 화제가 돼서 깊이 파 봤는데, 결국 "실수하지 마"를 스테로이드 맞힌 수준이더라고요.
입력 토큰은 싸고, 이런 잡동사니 대신 음성 인식으로 말해서 입력하는 편이 훨씬 낫다고 봅니다.
목표는 재사용성과 (어느 정도의) 재현성입니다. 같은 작업을 다시 할 때마다 똑같은 입력 토큰을 왜 처음부터 다시 입력하겠습니까? 프롬프트를 메모에 저장해 둘 수도, 바탕화면의 텍스트 파일에 둘 수도, 아니면... 스킬에 둘 수도 있죠.
다만 스킬이 실제보다 과대포장되는 경우가 많고, 여기 나온 것 같은 흐름은 사용자나 회사의 요구에 맞추려면 추가로 다듬어야 할 것 같다는 점에는 동의합니다.
저는 Claude(Opus 5.5)가 스킬 없이도 바로 꺼내서 쓸 만큼 이걸 꽤 잘한다고 느꼈습니다.
저는 스킬 없이 claude와 elevenlabs만으로도 더 나은 제품 영상을 만들었는데요. 이게 왜 필요한가요?
저도 직접 만든 오픈소스 도구를 마케팅하는 문제로 똑같이 고생하고 있습니다. 그래서 지금은 AI로 마케팅을 도와받는 방식을 시도하고 있습니다. 다만 콘텐츠를 알아서 만들어 여기저기 올리다가 AI 슬롭으로 신고당하는 완전 자동화 시스템 대신, 관련 포럼과 커뮤니티에서 관련 토론을 찾아 글을 올릴 만한 곳을 알려 주는 용도로 씁니다. 메시지는 제가 직접 씁니다. 사실 이 스레드도 그렇게 찾아 줬습니다. 저도 도구를 만들고 있거든요(제품 영상이 아니라 AI 영화용이지만, 그래도 가까운 분야입니다). Claude(또는 Codex)에게 비슷한 걸 만들어 달라고 하면 됩니다. 제 건 매일 아침 깨어나 글 올릴 곳을 찾고, 결과도 추적합니다. 진행 상황을 볼 수 있는 칸반 보드도 만들어 줍니다.
무료이거나 체험판이 있다면 링크를 남겨 주시거나 저에게 연락해 주세요.
제 마케팅 도구를 말씀하시는 건가요? 그렇다면 그건 Claude(Opus 5.5)가 만든 것이고 저한테만 맞춰져 있어서, 직접 프롬프트로 만들어 달라고 하시면 됩니다. 제가 만든 앱을 말씀하시는 거라면 이겁니다: https://gorenku.com/