ワンクリックで
cm-video-factory
// Private Code-to-Video Engine using Remotion React, TTS (ElevenLabs/OpenAI), and Content Mastery. Creates pure VibeCoding-style animations for TikTok/Shorts/Reels automatically.
// Private Code-to-Video Engine using Remotion React, TTS (ElevenLabs/OpenAI), and Content Mastery. Creates pure VibeCoding-style animations for TikTok/Shorts/Reels automatically.
Self-learning SEO content pipeline: dashboard, multi-agent queue, token budgets, research → write → audit → publish. StoryBrand/Cialdini/JTBD-style frameworks; config-driven. Use for content factory, batch articles, or scaled publishing.
Easy-to-use conversational CLI (Codex style) for non-technical users to spawn parallel AI tasks supervised by a visual web dashboard.
Strategic analysis gate for existing products — multi-dimensional evaluation (tech, product, design, business) using Design Thinking + 9 Windows (TRIZ) + Double Diamond. Outputs 2-3 qualified options with recommendations. Use BEFORE cm-planning for complex initiatives and enhancements on existing codebases.
Full review lifecycle — request reviews, handle feedback with technical rigor, and complete branch integration. Use when completing tasks, receiving feedback, or finishing feature branches.
Unified code intelligence — Skeleton Index (zero-dep, <4s) + AST knowledge graph (CodeGraph) + architecture diagrams (Mermaid) + smart context builder. Pre-indexes code structure so AI agents understand any codebase instantly. 95% token compression for onboarding. 30% fewer tokens for deep analysis.
Working memory protocol — maintains context across sessions via CONTINUITY.md. Inspired by Loki Mode. Read at turn start, update at turn end. Captures mistakes and learnings to prevent repeating errors.
| name | cm-video-factory |
| description | Private Code-to-Video Engine using Remotion React, TTS (ElevenLabs/OpenAI), and Content Mastery. Creates pure VibeCoding-style animations for TikTok/Shorts/Reels automatically. |
A self-hosted, batch-capable video factory built on Remotion React (code-to-video). Scripts → TTS → Subtitles → Render → Policy Check → Publish.
Dual format: 9:16 vertical (TikTok/Shorts/Reels) + 16:9 horizontal (YouTube). Dual language: Vietnamese (VieNeu-TTS) + English (ElevenLabs/OpenAI).
Spiritual twin of cm-content-factory, focused on Short-Form + Long-Form video at scale.
#00F0FF glow, Fira Code, engineering UI motifs.┌─────────────────────────────────────────────────────────────┐
│ 📹 CM VIDEO FACTORY v2.0 │
│ Batch Code-to-Video Production Engine │
├─────────────────────────────────────────────────────────────┤
│ │
│ ┌──────────┐ ┌──────────┐ ┌──────────┐ ┌────────┐ │
│ │ SCRIPT │──▶│ TTS │──▶│ SUBTITLE │──▶│ RENDER │ │
│ │ Generator│ │ Engine │ │ @remotion/│ │ Engine │ │
│ │ (JSON) │ │ VieNeu + │ │ captions │ │ Batch │ │
│ │ CM hooks │ │ ElevenL │ │ SRT+JSON │ │ Queue │ │
│ └──────────┘ └──────────┘ └──────────┘ └────────┘ │
│ │ │ │ │ │
│ ┌────┴──────────────┴──────────────┴──────────────┴────┐ │
│ │ 🎛️ FORMAT ROUTER │ │
│ │ ┌─────────────┐ ┌──────────────┐ │ │
│ │ │ VERTICAL │ │ HORIZONTAL │ │ │
│ │ │ 9:16 │ │ 16:9 │ │ │
│ │ │ 1080×1920 │ │ 1920×1080 │ │ │
│ │ │ TikTok │ │ YouTube │ │ │
│ │ │ Reels │ │ Facebook │ │ │
│ │ │ Shorts │ │ │ │ │
│ │ └─────────────┘ └──────────────┘ │ │
│ └──────────────────────────────────────────────────────┘ │
│ │
│ ┌──────────────────────────────────────────────────────┐ │
│ │ 🛡️ POLICY COMPLIANCE ENGINE │ │
│ │ Content scan | AI labeling | Upload throttle | Hash │ │
│ └──────────────────────────────────────────────────────┘ │
│ │
│ ┌──────────────────────────────────────────────────────┐ │
│ │ 📊 BATCH QUEUE MANAGER │ │
│ │ queue.json | progress.json | retry logic | cron │ │
│ └──────────────────────────────────────────────────────┘ │
└─────────────────────────────────────────────────────────────┘
# 1. Setup Remotion project (one-time)
cd video-factory && npm install
# 2. Generate single video (interactive)
node scripts/pipeline.js --script scripts-input/video_01.json --format tiktok
# 3. Batch render (queue-based)
node scripts/batch-runner.js --queue queue.json --batch-size 5
# 4. Resume interrupted batch
node scripts/batch-runner.js --queue queue.json --resume
# 5. Preview in browser (hot reload)
npx remotion studio
Scrape documentation, GitHub repos, URLs. Build knowledge base per topic.
Uses cm-cro-methodology to identify pain points for maximum hook impact.
AI generates strictly-keyed JSON scripts. One JSON = one video.
{
"id": "video_042",
"title": "Debug mệt mỏi?",
"hook": "99% Dev tốn thanh xuân để debug vì bỏ qua quy tắc này.",
"hook_formula": "data_shock",
"language": "vi",
"duration_target": 45,
"format": "tiktok",
"scenes": [
{
"time_start": 0,
"duration": 3.5,
"text": "99% Dev tốn thanh xuân để debug vì...",
"visual": "TerminalCrashView",
"props": { "error": "SIGSEGV", "animation": "glitch" }
},
{
"time_start": 3.5,
"duration": 5,
"text": "Với Cody Master, lỗi tự phơi bày trong 2 giây.",
"visual": "CodeGlowView",
"props": { "code": "cm-debugging --trace", "highlight": true }
}
],
"cta": "Click link ở Bio để cài đặt miễn phí.",
"hashtags": ["#vibecoding", "#devtools", "#codymaster"],
"metadata": {
"ai_generated": true,
"ai_disclosure": "Video created with AI-assisted animation and voice synthesis"
}
}
TTS Engine Router — auto-detect language → best engine:
| Language | Primary Engine | Fallback | Voice Cloning |
|---|---|---|---|
| Vietnamese | VieNeu-TTS 0.5B | OpenAI TTS | ✅ (3-5s ref) |
| English | ElevenLabs multilingual_v2 | OpenAI TTS | ✅ (paid) |
# Vietnamese TTS (VieNeu-TTS SDK)
from vieneu import Vieneu
tts = Vieneu()
audio = tts.infer(text="Xin chào, đây là VibeCoding Academy")
tts.save(audio, "audio_vi.wav")
# English TTS (ElevenLabs via infsh CLI)
infsh app run elevenlabs/tts --input '{
"text": "Welcome to the VibeCoding revolution.",
"voice": "george",
"model": "eleven_multilingual_v2",
"stability": 0.5,
"similarity_boost": 0.8
}'
Outputs:
audio.mp3 — Final audio trackaudio.json — Word-level timestamps (for subtitle sync)audio.srt — Standard SRT file (for YouTube upload)@remotion/captions)Uses official Remotion captions package for frame-perfect sync:
import { parseSrt, createTikTokStyleCaptions } from "@remotion/captions";
// Parse SRT from TTS output
const captions = parseSrt({ input: srtContent });
// Create TikTok-style word-by-word highlights
const { pages } = createTikTokStyleCaptions({
captions,
combineTokensWithinMilliseconds: 800,
});
// Render in React component
const SubtitleOverlay: React.FC = () => {
const frame = useCurrentFrame();
const { fps } = useVideoConfig();
const currentTime = (frame / fps) * 1000; // ms
return (
<AbsoluteFill style={{ justifyContent: "flex-end", padding: 40 }}>
{pages.map((page) => (
<CaptionPage key={page.startMs} page={page} currentTime={currentTime} />
))}
</AbsoluteFill>
);
};
Dual-format compositions:
// Root.tsx — Two compositions for two formats
export const RemotionRoot: React.FC = () => (
<>
<Composition
id="TikTokVideo"
component={TikTokComposition}
width={1080}
height={1920}
fps={30}
durationInFrames={durationFromAudio}
/>
<Composition
id="YouTubeVideo"
component={YouTubeComposition}
width={1920}
height={1080}
fps={30}
durationInFrames={durationFromAudio}
/>
</>
);
Render commands:
# TikTok vertical (9:16)
npx remotion render src/index.ts TikTokVideo out/tiktok_video_042.mp4
# YouTube horizontal (16:9)
npx remotion render src/index.ts YouTubeVideo out/youtube_video_042.mp4
# Benchmark optimal concurrency first
npx remotion benchmark --composition TikTokVideo
Remotion Performance Rules (from remotion-dev/skills):
useCurrentFrame() — never useEffect/setIntervaluseMemo/useCallbackfilter: blur(), drop-shadow()) in componentsnpx remotion benchmark to find optimal --concurrencygetAudioDurationInSeconds() + 2s bumper--log=verbose to identify slow framesPre-publish compliance scan (runs automatically before upload):
POLICY_GATES:
platform_limits:
tiktok:
max_daily_uploads: 3
cooldown_hours: 4
required_labels: ["AI-generated"]
hashtag_range: [3, 7]
youtube:
max_daily_uploads: 2
cooldown_hours: 6
required_disclosure: true # Creator Studio AI toggle
monetization_check: true # Must show human creative value
reels:
max_daily_uploads: 3
cooldown_hours: 4
content_rules:
min_visual_uniqueness: 70 # % difference between consecutive videos
banned_content_scan: true # Check for hate speech, misleading claims
no_unauthorized_cloning: true # No cloning real people without consent
no_mass_duplicate: true # Each video visually distinct
What gets checked:
Multi-platform upload via APIs:
Auto-applies: title, description, hashtags, AI disclosure labels, thumbnail.
For mass production, use the queue system:
// queue.json
{
"batch_id": "batch_2026_03_30",
"created_at": "2026-03-30T09:00:00Z",
"config": {
"formats": ["tiktok", "youtube"],
"language": "vi",
"tts_engine": "vieneu",
"concurrency": 1,
"retry_max": 3
},
"jobs": [
{
"id": "job_001",
"script": "scripts-input/video_01.json",
"status": "queued",
"attempts": 0,
"outputs": []
},
{
"id": "job_002",
"script": "scripts-input/video_02.json",
"status": "queued",
"attempts": 0,
"outputs": []
}
]
}
// progress.json (auto-generated)
{
"batch_id": "batch_2026_03_30",
"total": 10,
"completed": 3,
"failed": 0,
"in_progress": 1,
"queued": 6,
"estimated_remaining_minutes": 42,
"last_updated": "2026-03-30T09:25:00Z"
}
CLI:
# Start batch (processes sequentially)
node scripts/batch-runner.js --queue queue.json
# Resume after interruption
node scripts/batch-runner.js --queue queue.json --resume
# Status check
node scripts/batch-runner.js --queue queue.json --status
# Schedule via cron (every day at 2 AM)
echo "0 2 * * * cd /path/to/video-factory && node scripts/batch-runner.js --queue queue.json --resume" | crontab -
| Component | Visual Effect | Format | Use Case |
|---|---|---|---|
DarkTerminal | MacOS-style window, typing animation, syntax colors | Both | bash commands, workflows |
VsCodeGlow | Sleek IDE editor with neon-blue shadow | Both | Code demonstrations |
BouncingSubtitle | TikTok-style bold text, word-by-word bounce | 9:16 | ALL spoken words (mandatory) |
StatCounter | Rapidly spinning numbers in glassmorphic card | Both | Hook metrics ("10x", "200 articles") |
SplitScreen | Top: Concept / Bottom: Code | 16:9 | Before/after, comparisons |
CodeDiff | Side-by-side diff with green/red highlights | 16:9 | Showing improvements |
FloatingCard | Glassmorphic card with parallax hover | Both | Feature callouts |
ProgressRing | Animated circular progress indicator | Both | Stats, completion metrics |
Strict Styling Rules:
#00F0FF#FF007F#8B5CF6#0A0A0A → Deep Navy #050B14Fira Code (code), Inter (UI text), Be Vietnam Pro (Vietnamese text)interpolate() + spring() — NEVER CSS transitionsBefore writing Video JSON, select one:
| Phase | Time | Goal |
|---|---|---|
| HOOK | 0:00 - 0:03 | Extreme curiosity gap. Fast cut. Zero intro. |
| AGITATE | 0:03 - 0:15 | Visualize common pain (red errors, spaghetti code) |
| SOLUTION | 0:15 - 0:45 | Enter CodyMaster. Drop code. Make it glow. |
| CTA | 0:45 - 0:60 | Grand Slam Offer. "Lấy miễn phí tại bio". |
| Phase | Time | Goal |
|---|---|---|
| HOOK | 0:00 - 0:30 | Pattern interrupt + "Stay to the end for..." |
| CONTEXT | 0:30 - 2:00 | Problem landscape. Why this matters NOW. |
| DEEP DIVE | 2:00 - 10:00 | Step-by-step demonstration with code |
| PROOF | 10:00 - 12:00 | Results, metrics, before/after |
| CTA | Last 30s | Subscribe + comment + link in description |
interpolate() and spring(). 30FPS = frame / 30 seconds.getAudioDurationInSeconds() + 2s end-bumper.useMemo/useCallback on all expensive computations.filter: blur(), drop-shadow() in rendered components.npx remotion benchmark before batch renders.bytedance/omnihuman-1-5 lipsyncinference.sh integration — text-to-video AI scenes (Veo 3, Seedance)Use when the user states: