Vibetool

Talking Head Video — Development skill for Claude Code

Development community

Turn a 口播/talking-head video + script into a polished vertical explainer — synced subtitles, animated Remotion knowledge graphics, and a circular PiP avatar.

How to install Talking Head Video

This entry records only its repository, not the path inside it, so there is no exact command to give. Open Vibetool/talking-head-video and copy the folder into ~/.claude/skills/, or the file into ~/.claude/agents/.

What Talking Head Video does

Turn a 口播/talking-head video + script into a polished vertical explainer — synced subtitles, animated Remotion knowledge graphics, and a circular PiP avatar. A Claude Agent Skill.

Alternatives in Development

  • Revealjs Skill — Generate polished, professional presentations using the Reveal.js HTML presentation framework 235 ★
  • Anything2explainer — Topic in, narrated explainer video out 151 ★
  • Mesh Avatar Studio — Turn one illustration into an animated 2D mesh avatar with a coding agent and a local editor 112 ★

README

talking-head-video

Turn a raw **口播 / talking-head selfie video** + its script into a finished explainer — **vertical 9:16 or landscape 横屏 16:9** — synced burned-in subtitles, animated knowledge-graphic segments, and a circular **picture-in-picture avatar** that shrinks the speaker into the top-left while a chart / data-card / diagram fills the screen during explanations.

This is a [Claude](https://claude.com/claude-code) **Agent Skill**. Drop it in and ask, in plain language, to "把这段口播剪成成片,加字幕和动态讲解图" — the agent runs the whole pipeline.

full face ──┐         ┌── graphic full-frame + circular avatar top-left ──┐         ┌── full face
            │  cross  │   ("knowledge window")                            │  cross  │
   subtitles burned over EVERYTHING, the whole time

What it produces

  • Vertical 1080×1920(视频号 / 抖音 / Shorts)or Landscape 1920×1080(B站 / YouTube / 知识科普)
  • Burned-in subtitles, timed by faster-whisper and corrected against your verbatim script (no more mis-heard brand names / 同音字)
  • Animated knowledge graphics built with Remotion in a dark "premium / scientific" design system — six reusable archetypes: image+callout, data cards, before/after comparison, flow diagram, big-number reveal, key-point list
  • Circular PiP avatar of the speaker, top-left, only during explanation beats

⚠️ 使用约定:画幅和图卡风格,先问用户

**开工前,Skill 会先向你确认两件事,给出推荐但由你拍板,不会默默替你决定:**

  1. 画幅:横屏 16:9 还是竖屏 9:16(通常跟随源视频);
  2. 图卡风格:讲解画面用哪种风格,三选一(见下节)。

两种画幅都是一等公民,各自的参数集:

参数 竖屏 9:16 (1080×1920) 横屏 16:9 (1920×1080)
头像直径 / 位置 300px / 40:120 380px / 44:44
字幕 PlayRes 1080×1920, MarginV 210 generate_subs.py --land(1920×1080, MarginV 90)
头像脚本 make_avatar.sh SRC OUT CROP RING 300 make_avatar.sh SRC OUT CROP RING 380
图形安全区 左上头像 + y≳1540 字幕带 左上头像(x<470, y<470)+ 底部字幕带

🎨 三种图卡风格(内置)

风格 一句话 适合 字体(随仓库附带,全免费)
darkcard 深色科技卡(默认) 深底