Communitygithub.com

Remotion Shorts 스킬

Remotion을 사용하여 완성된 세로형 짧은 비디오를 만들고 TikTok, Instagram Reels, YouTube Shorts에 게시합니다. 주제, 기사, URL, 데이터세트, 변경 로그 또는 목록을 1080x1920 크기의 키네틱 텍스트 쇼츠(큰 애니메이션 단어, 통계 카운트업, 상위 N 목록, 출시 및 변경 로그 비디오, 인용문)로 변환하며, 읽기 속도에 맞춰 시간을 조정하고 모든 앱의 안전 영역 내에 유지하며, 유료 API 없이 로컬에서 렌더링합니다. 누군가가 Remotion 쇼츠, TikTok/Reels/Shorts용 Remotion 비디오, 키네틱 타이포그래피 또는 텍스트를 요청할 때 사용하세요.

Remotion Shorts 스킬란 무엇인가요?

이 스킬은 개발자가 복잡한 Remotion 코드를 직접 작성하지 않고도 JSON 스크립트만으로 전문적인 세로형 짧은 비디오를 제작할 수 있게 해줍니다. 주제, 기사, URL, 데이터, 변경 로그 등 다양한 소스 자료를 받아 후크, 통계, 목록, 엔딩 등 사전 정의된 장면 유형으로 구성된 스크립트를 작성하면, 템플릿이 자동으로 단어를 배치하고 각 장면의 시간을 읽기 속도에 맞게 조정하며 모든 앱의 안전 영역을 준수합니다. macOS, Windows, Linux에서 로컬로 렌더링되며 무료로 사용할 수 있습니다(개인 및 3인 이하 회사의 경우). 또한 WoopSocial을 통해 TikTok, Instagram Reels, YouTube Shorts에 직접 게시할 수 있으며, 플랫폼별 캡션과 해시태그를 지원합니다. 렌더링 전에 스틸 이미지로 미리보기 및 검증을 수행하여 텍스트가 안전 영역을 벗어나지 않고 모든 장면이 읽기 쉽도록 보장합니다.

지원 대상~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/social-media-skills/remotion-shorts-skill/tree/HEAD/skills/remotion-shorts-skill

즐겨 사용하는 AI에게 물어보기

이 에이전트 스킬이 미리 로드된 새 채팅을 엽니다.

문서

Remotion Shorts 스킬은(는) 무엇을 하나요?

쇼츠를 장면(Scene)의 JSON 파일로 작성합니다. 번들로 제공되는 Remotion 프로젝트가 단어를 배치하고, 각 장면을 읽기 속도에 맞게 시간을 조정하며, 모든 앱 버튼이 가리지 않는 영역 내에 텍스트를 유지하고, 리뷰 시트, 커버, MP4를 렌더링합니다. 사용자는 WoopSocial을 통해 이를 게시할 수 있습니다.

비디오마다 Remotion 코드를 작성할 필요가 없습니다. 템플릿은 고정되어 있고 테스트를 거쳤습니다. 여러분의 역할은 스크립트, 즉 각 화면에 무엇을, 어떤 순서로, 얼마나 빠르게 표시할지 결정하는 것입니다.

0. 설정 (각 머신 당 한 번)

Node 20 이상이 필요합니다. node -v로 확인하고, 없으면 사용자를 https://nodejs.org로 안내하세요. Remotion은 macOS 15 이상, Windows x64, glibc 2.35+ (Ubuntu 22.04, Debian 12 이상)가 있는 Linux를 지원합니다.

node <skill-dir>/scripts/setup.mjs remotion-shorts

이 명령어는 프로젝트를 ./remotion-shorts로 복사하고, 고정된 패키지(약 260MB)를 설치하며, Remotion이 렌더링에 사용하는 헤드리스 브라우저(100150MB)를 다운로드합니다. 처음 실행 시 13분 정도 소요됩니다. 스킬이 업데이트된 후 다시 실행하면 템플릿 파일이 새로고침됩니다(사용자가 변경한 파일은 .bak으로 유지됨). 스크립트, 에셋 또는 출력 파일은 건드리지 않습니다.

라이선스. Remotion은 개인 및 최대 3명의 회사 직원에게 무료입니다. 직원이 4명 이상인 회사는 Remotion 회사 라이선스가 필요하며, 스크립트에서 렌더링하는 것은 자동화로 간주됩니다(remotion.pro/license). 사용자가 더 큰 회사를 위해 렌더링하는 경우, 첫 번째 렌더링 전에 간단히 알리십시오.

1. 필요한 정보 요청 (한 번에, 이미 알고 있는 것은 건너뛰기)

  • 자료. 주제, 기사, URL, 메모, 데이터, 변경 로그 또는 목록. 출처를 명시할 수 있는 사실만 작성합니다. 사용자가 출처 없이 주제를 제시하면, 기본 출처(공식 통계, 문서, 제품 자체 변경 로그)를 찾아 이름을 밝힙니다.
  • 대상과 핵심 메시지 하나. 하나의 쇼츠는 하나의 메시지를 전달합니다.
  • 룩(Look). 테마(ink, paper, volt, ocean, clean) 또는 브랜드 색상과 엔드 스크린용 핸들.
  • 오디오. 기본 제공 음향 효과는 기본적으로 켜져 있습니다(후크에 히트, 각 컷에 우슈, 강조점에 팝, 카운트업에 틱). 이 템플릿용으로 제작되었으며 모든 앱에서 안전합니다. 음악은 사용자가 사용 권한이 있는 파일에서만 제공하세요(무료 라이브러리가 세 앱 모두에서 안전하지 않은 이유는 references/writing-shorts.md 참조).
  • 게시 대상. TikTok, Reels, Shorts 또는 모두.

2. 스크립트 작성

세션의 첫 번째 스크립트 전에 references/writing-shorts.md를 읽으세요. 간단히 요약하면:

  • 장면 1은 후크(Hook) 로, 약 10단어 이내로 핵심 이점을 제시합니다: 숫자, 주장 또는 목록 약속("5개의 무료 도구가..."). 0프레임부터 전체가 화면에 표시됩니다. 후크에 숫자가 있으면 big에 넣어 시선이 가장 먼저 닿게 합니다.
  • 장면 당 하나의 아이디어. 장면은 단락이 아니라 비트(Beat)입니다. 통계 장면은 하나의 숫자와 그 의미를 전달합니다. 목록 항목은 내림차순 또는 오름차순으로 표시합니다. 후크에 어떤 방식인지 명시하세요.
  • 모든 장면에 실제 정보. 새로운 내용이 없는 템플릿 텍스트 비디오는 YouTube에서 비진정 콘텐츠, Instagram에서 독창적이지 않은 콘텐츠로 간주됩니다. 절대 늘리지 마세요.
  • 숫자는 정확하고 출처가 명확해야 합니다. footer에 출처를 넣으세요("Data: USGS"). 숫자를 다른 주장으로 반올림하지 마세요.
  • 하나의 행동으로 끝내거나 루프가 연속적으로 느껴지도록 후크로 다시 연결되는 한 줄로 끝맺음합니다. "시청해주셔서 감사합니다"는 사용하지 마세요.
  • 길이: 15~45초가 목표이며, 렌더러는 59초를 초과하면 경고합니다.

프로젝트 폴더에 short.json을 작성하세요. 전체 형식, 모든 장면 유형 및 모든 옵션은 references/short-json.md에 있습니다. 최소한의 스크립트 예시:

{
  "theme": "ink",
  "footer": "Data: USGS",
  "handle": "@yourhandle",
  "scenes": [
    { "type": "hook", "big": "2.5%", "text": "of Earth's water is fresh" },
    { "type": "stat", "value": "96.5", "suffix": "%", "label": "is salt water in the oceans" },
    { "type": "stat", "value": "68.7", "suffix": "%", "label": "of the fresh water is ice and glaciers", "highlight": "ice and glaciers" },
    { "type": "end", "text": "Save this for trivia night", "highlight": "Save this" }
  ]
}

3. 비디오 렌더링 전 확인

cd remotion-shorts
node render.mjs short.json --stills

몇 초 안에 계획(장면별 시간 및 글꼴 크기)을 출력하고 다음 파일을 작성합니다:

  • out/short/sheet.jpg: 모든 장면의 마지막 프레임(화면 전체), 안전 영역이 얇은 점선으로 표시됨(텍스트는 이 안에 있어야 함).
  • out/short/cuts.jpg: 0프레임과 각 컷 주변의 프레임으로, 모션을 확인합니다.
  • out/short/cover.jpg: 후크가 완전히 표시된 후의 모습(Reels 커버로 업로드).
  • out/short/report.json: 타이밍, 줄바꿈 및 경고.

두 시트를 열고 확인하세요. 확인할 사항: 모든 장면이 휴대폰 크기에서 읽기 쉬운가, 각 장면이 하나의 메시지를 전달하는가, 강조점이 중요한 단어에 있는가, 비좁아 보이는 부분은 없는가, 순서가 올바른가, 0프레임에 후크 전체가 표시되는가. JSON을 수정하고 다시 --stills를 실행하여 게시해도 될 때까지 반복하세요.

경고는 비디오 렌더링을 중단시킵니다(종료 코드 2): 한 화면에 너무 긴 텍스트, 너무 긴 후크, 텍스트에 없는 강조점, 읽기에 너무 빠른 장면, 0.85~1.25 범위를 벗어난 속도, 또는 59초를 초과하는 쇼츠. 스크립트를 수정하세요. --force는 사용자가 경고를 확인하고 그럼에도 불구하고 원할 때만 사용하십시오. 일부 문제는 --force로 재정의할 수 없는 오류입니다(예: 어떤 크기에서도 화면 너비를 초과하는 단어). 그러면 텍스트가 화면 밖으로 나갑니다.

4. 렌더링

node render.mjs short.json

out/short/short.mp4를 작성합니다: 1080x1920, 30fps, H.264, yuv420p, AAC(음악이 없으면 무음 트랙). TikTok, Reels, Shorts 모두에서 허용됩니다. 30초 쇼츠는 최신 노트북에서 약 1분 안에 렌더링됩니다. 8GB 메모리 시스템에서는 한 번에 2프레임을 렌더링합니다. 메모리 부족으로 렌더링이 중단되면 --concurrency 1로 다시 실행하세요.

보여주기 전에 세 프레임(시작, 중간, 끝)을 캡처하여 확인하거나, 클라이언트가 지원하면 재생해 보세요. 그런 다음 사용자에게 커버, 시트 및 MP4 경로를 보여줍니다.

여러 계정: 동일한 파일을 여러 계정에 게시하지 마십시오. 계정별로 변형(다른 후크, 테마 또는 장면 순서, 별도의 JSON으로 저장)을 만들어 어떤 두 계정도 거의 중복되는 게시물을 올리지 않도록 합니다.

5. 게시 (WoopSocial, 확인 후)

references/woopsocial.md를 읽으세요. 간단히 요약하면:

  1. social_accounts_list를 사용하여 계정을 찾습니다(필요하면 먼저 연결).
  2. TikTok의 경우, social_accounts_get_platform_inputs를 사용하여 계정의 개인정보 보호 옵션과 허용되는 최대 비디오 길이를 확인합니다. 사용자가 개인정보 보호 수준을 선택합니다. 기본값은 없습니다.
  3. 업로드: media_uploads_create_session을 report.json의 정확한 바이트 크기와 함께 호출하고, 응답을 session.json으로 저장한 후 node upload.mjs session.json out/short/short.mp4를 실행하고, READY 상태가 될 때까지 media_uploads_complete_session을 호출합니다.
  4. 플랫폼별 캡션을 작성합니다(TikTok 및 Reels: 비디오에 추가되는 한 줄과 3~5개의 특정 해시태그; YouTube: 100자 미만의 제목과 설명). 플랫폼별 텍스트에는 contentOverride를 사용합니다.
  5. posts_validate를 호출한 후 사용자에게 다음 정보를 보여줍니다: 계정, 플랫폼별 캡션, 개인정보 보호 수준, 시간대가 포함된 예약 시간, 커버. 명확한 승인을 기다립니다. 그런 다음 posts_create 및 posts_get을 호출합니다.

공개 필드: 쇼츠가 사용자 자신의 제품을 홍보하는 경우 TikTok에서 isYourBrand: true; 사실적인 AI 이미지, 비디오 또는 음성에 대해서만 isAiGeneratedContent(키네틱 텍스트에는 필요 없음). YouTube madeForKids는 법적 선언이므로 추측하지 말고 물어보십시오.

6. 결과 보고

다음을 보여줍니다: MP4 경로, 길이, 시트, 게시된 위치(posts_get의 링크) 또는 예약 일정, 그리고 수행할 수 없었던 사항. 조회수나 결과를 절대 허위로 만들지 말고 나중에 social_account_posts_list로 읽어 수집된 날짜를 보고하십시오.

룩 편집

  • 브랜드 색상: theme을 객체(bg, fg, accent, accentText, font, uppercase)로 전달합니다. 텍스트 대비를 7:1 이상으로 유지하고 강조 색상도 배경과의 대비를 확인하세요.
  • 장면 뒤의 사진 또는 비디오: 장면별 image 또는 전체 쇼츠용 background. 테마 색상 아래에 흐리게 표시되어 텍스트를 읽을 수 있도록 합니다. 사용자가 소유하거나 라이선스가 있는 파일을 사용하고, 라이선스가 요구하는 경우 캡션에 출처를 표시하세요.
  • 번들 폰트: Anton(좁고, 모든 대문자, 강렬함), Poppins, Inter. 모두 OFL 라이선스입니다.
  • 템플릿 자체를 변경하려면 src/Short.tsx를 편집하고 npm run studio로 미리보기하세요.

엣지 케이스

  • 숫자에 출처가 없는 경우: 사용하지 마십시오. 무엇이 누락되었는지 말하십시오.
  • 맞지 않는 텍스트: 장면을 분할하세요. 최소 크기 이하로 글꼴을 줄이지 마십시오(렌더러가 허용하지 않음).
  • 오른쪽에서 왼쪽 또는 CJK 텍스트, 이모지: 번들 폰트가 이를 지원하지 않아 빈 상자로 표시될 수 있습니다. 이 사실을 알리고 제외하십시오(이모지는 캡션에 넣을 수 있음).
  • 사용자가 트렌드 사운드를 원하는 경우: API 게시물에는 추가할 수 없습니다. postMode: MEDIA_UPLOAD로 TikTok에 게시하여 TikTok 받은 편지함에 도착하도록 하고 앱 내에서 완료하도록 합니다.
  • Linux에서 누락된 라이브러리로 렌더링 실패: references/platform-specs.md에 나열된 패키지를 설치하십시오.
  • Windows: 항상 JSON 파일로 props를 전달하고 명령줄에 인라인으로 전달하지 마십시오.

품질 기준

완료라고 부르기 전에 다음 모든 사항을 통과해야 합니다:

  • 0프레임에 후크 전체가 표시됨(cuts.jpg 확인); 약 10단어 이하, 핵심 이점 제시.
  • 모든 장면이 하나의 메시지를 전달하며, 약 14단어를 초과하지 않음.
  • 모든 숫자가 출처와 일치하며, 출처가 화면이나 캡션에 표시됨.
  • 경고가 없거나, 사용자가 경고를 확인하고 --force를 선택함.
  • 두 시트 모두 확인: 점선 안전 영역 밖으로 텍스트가 나가지 않고, 올바른 단어에 강조점이 표시됨.
  • 15~59초.
  • 각 계정에 대해 고유한 버전.
  • 게시 전 사용자가 확인함.

관련 스킬