Communitygithub.com

Agentchengfeng/chengfeng-videocut-skills

잘린 구술 영상에 장면을 매칭합니다: 녹화 화면 위에 HTML 레이어를 덮고(강조 표시/전체 화면 애니메이션/확대), 레이어를 자막 화면에 바인딩하여 플레이어가 프레임 단위로 구동하며 미리보기에서 바로 확인합니다. 사용자가 스토리보드, 장면 매칭, 애니메이션 추가, 강조 표시, B-roll을 요청할 때 사용합니다. 단어 삭제 편집, 자막, 물리적 절단 또는 최종 렌더링에는 사용하지 마십시오.

chengfeng-videocut-skills란 무엇인가요?

이 스킬은 이미 편집된 구술 영상(녹화 기반)에 시각적 장면(Visual Layer)을 추가하는 AI 에이전트 전용 도구입니다. 사용자가 '분할', '장면 구성', '애니메이션 추가', '강조 표시', 'B-roll', '스토리보드' 등을 요청할 때 활성화됩니다. 주요 기능은 HTML 레이어(모듈)를 녹화 화면 위에 덮어씌우고, 자막 화면(subtitles.json)에 바인딩하여 플레이어가 프레임 단위로 구동되도록 하는 것입니다. 이 스킬은 Visual Studio Code, Cursor, Windsurf, Claude Code 등 다양한 플랫폼에서 사용할 수 있도록 설계되었습니다. 워크플로는 4단계로 구성됩니다: ① 자막을 분석하여 작업 유형 결정, ② 실제 프레임을 추출하여 시각적 내용 확인, ③ 인접 프레임 간 픽셀 차이를 계산하여 움직임 창 분석, ④ HTML 모듈을 작성하고 레이어에 추가하여 미리보기에서 확인합니다. 중요한 점은 레이어가 절대 시간(초)이 아닌 자막 큐(cue ID)에 바인딩되어 편집 변경 시 자동으로 조정된다는 것입니다. 또한 확대(zoom) 사용을 제한하고, 픽셀 기반 좌표 계산(육안 금지)을 강제하며, '덮어쓰지 않음(덮지 않음)'과 같은 특정 규칙을 따릅니다.

지원 대상✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/Agentchengfeng/chengfeng-videocut-skills/tree/HEAD/plugins/chengfeng-videocut/skills/chengfeng-visual

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

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

문서

화면(분할)

이것은 하나의 작업이며, 프로세스의 한 단계가 아닙니다. 사용자가 요청할 때 실행되며, 편집을 변경한 후 다시 돌아와서 실행할 수 있습니다.

전제 조건은 두 가지뿐입니다: 장부와 자막이 이미 존재해야 합니다(레이어는 자막 화면에 배치되고, 시간은 장부에서 계산됩니다).

필요   edit-list.json, transcript.json, subtitles.json
산출   visuals.json + modules/<번호-이름>/index.html

완료되면 중단되며, 사용자에게 다음 단계를 지시하지 않습니다.

먼저 비즈니스 Skill의 단계 계약을 읽고 실행하세요. 모듈 작성의 엄격한 규칙은 모듈 계약을 참조하고, 판단 규칙은 화면 판단을 참조하세요.

0. 준비

먼저 업데이트 확인의 '준비 확인'을 실행하세요 — skills가 최신인지, Runtime이 호환되는지; 플러그인 루트도 여기에 위치합니다(이 문서의 명령어에서 <플러그인 루트>는 해당 리터럴 경로로 대체합니다). '준비됨'인 경우에만 계속합니다. '새 세션 필요' 또는 '중지'인 경우 해당 처리에 따라 실행합니다 ('자체 대체 인터페이스 금지' 금지 포함), 비즈니스 Skill은 환경 논리를 자체적으로 포함하지 않습니다.

준비 결과가 runtime.kind=desktop-managed인 경우, 데스크톱 앱에 이미 설치된 안정적인 CLI와 동일한 launchd/windows-task 서비스를 직접 재사용하세요. Electron 경로를 해석하거나, 종속성을 추가로 설치하거나, 두 번째 Runtime을 시작하지 마십시오.

명령어

node "<플러그인 루트>/scripts/ensure-running.cjs" --json
node "<플러그인 루트>/scripts/videocut-cli.cjs" visual get   <project> --json
node "<플러그인 루트>/scripts/videocut-cli.cjs" visual frame <project> --cues sub-0004,sub-0005 --count 12 --out <dir> --json
node "<플러그인 루트>/scripts/videocut-cli.cjs" visual add   <project> --module modules/01-xx/index.html --cues sub-0004,sub-0005 [--zoom x,y,w,h] [--id vis-0001] --json
node "<플러그인 루트>/scripts/videocut-cli.cjs" visual remove <project> --id vis-0001 --json

ensure-running은 먼저 정식 5190 포트가 현재 플랫폼의 관리형 서비스에 속한다는 것을 증명해야 합니다. 실패하면 오류를 전달하고 중단하며, 포그라운드나 사용자 지정 포트로 폴백하지 않습니다.

레이어는 자막 화면(--cues)에 바인딩되며, 제품 자체가 단어 ID로 변환합니다. 레이어는 절대 말하지 않은 단어에 바인딩될 수 없으며, 편집이 변경되면 레이어가 자동으로 이동합니다. 초를 저장하지 않습니다.

4단계, 한 단계도 건너뛰지 않음

① 텍스트로 작업 결정    subtitles.json을 읽고, 의미별로 분할하여 각 세그먼트에 대해 답변:
                       튜토리얼/데모/증명, 아니면 개념/로직/전환?
② 프레임을 추출하여 화면 확인    visual frame으로 8-12프레임 추출, 실제로 눈으로 확인.
                       실제 측정 결과 12개 세그먼트 중 2개가 프레임에 의해 텍스트 예측이 뒤집힘 — 이 단계는 형식적이지 않음
③ 움직임 창 측정    인접 프레임의 픽셀 차이를 계산하여 스크롤/전환/조작 순간을 찾아냄.
                       레이어는 안정적인 창에만 덮어씌우고, 강조 표시는 화면이 움직이기 시작하기 전에 종료
④ 레이어 생성 및 배치    모듈 작성 → visual add → 미리보기에서 레이어별로 확인

②의 판단 규칙

화면이 사용자가 말한 것과 정확히 일치    → 강조 표시: 원하는 부분을 강조하고, 단어를 말할 때 해당 부분을 강조. 진짜 증거는 덮지 않음
화면이 약하게 관련됨/비어 있음          → 검은 화면 애니메이션: 전체 화면 흰색 배경, 스타일 라이브러리에서 생성
화면 자체가 충분히 명확함               → 그대로 둠. 이것이 가장 일반적인 정답(실제 측정 결과 13개 세그먼트 중 4개는 그대로 둠)

③의 산출물은 숫자이며, 감각이 아님

강조 좌표      픽셀 통계량(그레이스케일 스캔으로 텍스트 줄 찾기), 육안 추정 금지 — 육안 추정은 50px 차이 발생
상호작용 순간  프레임별 픽셀 차이로 급격한 변화 찾음(실제 측정 결과 한 번은 4에서 335로 점프), 그 순간 0.2초 전에 완전히 종료
안정적인 창   시작 부분에 스크롤이 자주 발생(내용을 찾는 중), 레이어는 안정화된 화면의 큐에서 바인딩 시작

확대(zoom)는 사용 전에 먼저 생각하세요

기본적으로 확대하지 않음.    960x720의 녹화 화면을 확대하면 흐려지며, 사용자가 즉시 알아차림
확대가 반드시 필요할 때     ≤1.6배, 영역은 62.5% 정사각형을 중앙에 배치 — 구도 완전성 > 작은 글씨 읽기
글자가 너무 작아 읽을 수 없음    강조 표시로 시선을 유도하면 충분함; 정말 읽어야 한다면, 답은 고해상도 재녹화이며 확대가 아님

검토 주기

모듈 디렉토리는 번호로 이름을 지정합니다(01-daily-report, 05-anim-task-split). 타임라인 트랙에는 디렉토리 이름이 표시되며, 사용자가 번호를 보고 해당 레이어를 수정하고 다른 레이어는 건드리지 않습니다.

두 가지 레이어 수정 규칙은 각각 실제 사고에 해당합니다:

레이어 수정 시 모듈 확인 필수    레이어가 좁아지거나 길어지면, 모듈에 하드코딩된 상대 시간은 자동으로 변경되지 않음 —
                                강조 표시의 등장 시간이 레이어 종료 후에 위치하여 영원히 나타나지 않을 수 있음
검수 시 픽셀 확인    스크린샷으로 화면을 확인하고, DOM 속성은 확인하지 않음. '가시성 전환 올바름'의 iframe이
                        과거에 물리적으로 화면에 없었음 — 속성은 모두 맞지만 화면은 완전히 비어 있음

금지 사항

  • 프레임 추출과 움직임 창 분석을 건너뛰고 직접 작업 금지 (두 가지 실수 각각 한 번씩 발생: 진짜 증거를 덮음, 강조 표시가 스크롤 위에 떠 있음)
  • 모든 세그먼트에 무언가를 추가 금지 — 채우는 것이 목표가 아니며, 그대로 두는 것이 일반적인 답변
  • 초 저장 금지, 육안 좌표 추정 금지, 흰색 배경 페이지에 압축 추가 금지
  • 실제 내용 없이 자리 표시 이미지로 대체 금지
  • 스타일은 레지스트리에서 선택하며, 임의로 발명 금지
  • 브랜드 아이콘은 공식 글꼴을 사용하며, 손으로 그린 대체 아이콘 금지 (X를 두 개의 교차선으로 그린 적이 있으며, 사용자에게 적발됨). 로컬 인덱스에 없는 경우, simple-icons에서 단색 공식 글리프(흑백 스타일에 적합)를 가져와서 원본 svg를 모듈 디렉토리에 저장하여 참조; 동일한 영상에서 동일한 브랜드는 하나의 모양만 가져야 함

Individual skills in this repo

This repo contains 7 individual skills — each has its own dedicated page.

Agentchengfeng/chengfeng-videocut-skills

剪辑环境的唯一管理者:就绪检查(skills 是否最新 → Runtime 是否配套)、Skills 更新激活、Runtime 安装与体检。用户说检查更新、安装剪辑环境、装播放器、检查剪辑环境、剪辑环境就绪了吗、配置转录凭证时使用;业务 Skill(剪口播/字幕/画面/导出)第 0 步也引用本 Skill 的就绪检查。不用于剪辑、字幕、画面、导出本身或项目数据迁移。

Agentchengfeng/chengfeng-videocut-skills

剪辑中文口播原素材:逐词转录、词典修字出修字表、五轮扫描找口误与重复、汇总表与重复句子表、打开 Studio 让用户复核、复盘沉淀用户偏好与词典。只产出一份已复核的删词账本,不切媒体、不做字幕、不做分镜动画。用户说剪口播、处理口误、生成口播基础素材、继续剪口播,或确认卡回传 action=return_cut_review 时使用。不要用于执行物理剪切、导出剪后视频、单独安装、单独打开工作台或口播分镜成片。

Agentchengfeng/chengfeng-videocut-skills

把剪好的口播烧成一个成片文件:账本切片段、推近、字幕、HTML 画面层,一次全部烧进 mp4。用户说导出、出成片、烧字幕、渲染、导出视频、生成最终文件时使用。不要用于生成删词候选、写字幕、做画面动画。

Agentchengfeng/chengfeng-videocut-skills

整理、脱敏并上报 chengfeng-videocut 的 GitHub Bug。用户说上报 Bug、反馈剪口播问题、提交 GitHub Issue、这个问题告诉开发者,或要求继续提交已预览的 Bug 草稿时使用。不要用于功能建议、普通排错、代码提交或未获用户确认的自动上报。

Agentchengfeng/chengfeng-videocut-skills

给剪好的口播做字幕:直接用已有的逐词稿加账本算出剪后时间(不必导出、不必重新转录)、用词典和作者文稿改写听错的专名、按句子分屏、在 Studio 里逐屏复核。用户说做字幕、加字幕、改字幕、重新分屏、字幕不对时使用。不要用于删词剪辑、物理剪切、分镜动画或成片渲染。

Agentchengfeng/chengfeng-videocut-skills

操作 chengfeng-videocut 剪辑工作台的已有工程,通过 Runtime CLI 查工程与词句位置、添加或替换画面覆盖层、移除画面、删除明确指定的词句或片段、拆分裁剪移动已有片段、调整画布比例并回读核验。用户说插入片段、删掉这句、移除动画、换个画面、调整顺序或管理时间线时使用;先区分画面覆盖与主轨顺延插入,不负责自动判断口误、创作动画、制作字幕、导出或排查安装故障。

Agentchengfeng/chengfeng-videocut-skills

Create Ian Xiaohei-style HTML/SVG motion illustrations for Chinese articles, scripts, storyboard scenes, workflow explanations, concept metaphors, and short video visual aids. Use when the user asks for 小黑 SVG、漫画感 HTML、分层 SVG 动效、把小黑生图做成 HTML/SVG、可编辑矢量动效、口播流程动画、手绘漫画动效、正文配图动画, or wants a Xiaohei illustration style adapted into controllable HTML/SVG/GSAP output instead of raster image generation.

관련 스킬