AI-powered 소셜 단축 발전기: 어떤 URL 또는 콘텐츠의 조각을 16:9 + 9:16 MP4s YouTube Shorts, Reels, TikTok, LinkedIn에 준비.

2개의 형태:

• ** 뉴스**: 매일 기술/보안 뉴스 클립 (25–32s) -Promo: GitHub 프로젝트 마케팅 동영상 (25–32s)

둘 다 동일한 렌더링 엔진을 공유 — 스토리 보드 콘텐츠는 다릅니다.

요구 사항

• 노드 18+
• ffmpeg] ([T1]])
• python3 (원 렌더링 중 정적 웹 서버를 위해)

설치

비디오 렌더링

출력 토지 output/YYYY-MM-DD- /:

• -16x9.mp4 - 데스크탑 / 유튜브 / 링크드 인
• -9x16.mp4 - 릴 / 반바지 / TikTok
• storyboard.json - 입증 된 소스 사본

Claude Code로 스토리보드 생성

이 프로젝트 디렉토리에서 Claude Code를 실행하고 slash 기술을 사용합니다.

Claude는 소스, 초안 storyboards/ .json]를 읽었으며, 검토 및 ( 승인) 호출 scripts/render.sh를 보여줍니다.

정확한 교류를 위해 .claude/skills/news/SKILL.md와 .claude/skills/promo/SKILL.md를 보십시오.

스토리보드 스키마

지원되는 장면 유형과 모든 필드는 engine/render.html (builders = {])에 살고 있습니다.

음성 오버 추가

비디오에는 오디오가 없습니다. ElevenLabs narration를 추가하려면:

ai-shorts-generator

AI-powered social shorts generator: turn any URL or piece of content into 16:9 + 9:16 MP4s ready for YouTube Shorts, Reels, TikTok, LinkedIn.

Two modes:

• News: daily tech / security news clips (25–32s)
• Promo: GitHub project marketing videos (25–32s)

Both share the same render engine — only the storyboard content differs.

Requirements

• Node 18+
• ffmpeg (brew install ffmpeg)
• python3 (for the static web server during render)

Install

npm install
npm run install:browsers     # playwright chromium

Render a video

bash scripts/render.sh storyboards/sglang-cve.json

Output lands in output/YYYY-MM-DD-/:

• -16x9.mp4 — desktop / YouTube / LinkedIn
• -9x16.mp4 — Reels / Shorts / TikTok
• storyboard.json — copy of the source for provenance

Generate a storyboard with Claude Code

Inside this project directory, run Claude Code and use the slash skills:

/news https://thehackernews.com/...          # tech news URL → storyboard
/promo https://github.com/owner/repo         # GitHub repo → storyboard

Claude reads the source, drafts storyboards/.json, shows it for review, and (on approval) calls scripts/render.sh.

See .claude/skills/news/SKILL.md and .claude/skills/promo/SKILL.md for the exact flow.

Storyboard schema

{
  "meta": {
    "title": "Human-readable title",
    "slug": "kebab-case-slug",
    "theme": "default|danger|warning|success",
    "source": "https://source-url"
  },
  "scenes": [
    { "type": "hero-text",  "duration": 3, "headline": "...", "caption": { "en": "...", "vi": "..." } },
    { "type": "stats-grid", "duration": 4, "stats": [{ "big": "9.8", "label": "CVSS", "accent": true }] },
    { "type": "terminal",   "duration": 5, "lines": [{ "type": "prompt", "text": "$ ..." }] },
    { "type": "code-diff",  "duration": 6, "bad": "...", "good": "..." },
    { "type": "quote",      "duration": 4, "text": "...", "attr": "..." },
    { "type": "iframe",     "duration": 5, "src": "https://...", "badge": "⭐ 1.2k" },
    { "type": "cta-url",    "duration": 4, "label": "...", "url": "...", "sub": "..." }
  ]
}

Supported scene types and all fields live in engine/render.html (search for builders = {).

Adding voice-over

The video has no audio. To add ElevenLabs narration:

# Generate 6 clips on ElevenLabs (one per scene), save clip1.mp3 … clip6.mp3
# Pad each to scene duration and concatenate:
ffmpeg -i clip1.mp3 -i clip2.mp3 ... \
  -filter_complex "\
    [0:a]apad=whole_dur=3[a1];\
    [1:a]apad=whole_dur=4[a2];\
    [2:a]apad=whole_dur=5[a3];\
    [3:a]apad=whole_dur=6[a4];\
    [4:a]apad=whole_dur=4[a5];\
    [5:a]apad=whole_dur=4[a6];\
    [a1][a2][a3][a4][a5][a6]concat=n=6:v=0:a=1[out]" \
  -map "[out]" voice.mp3

# Mux into the video:
ffmpeg -i output/DATE-SLUG/SLUG-16x9.mp4 -i voice.mp3 \