Communitygithub.com

ascorblack/video-skills

Правила записи интерфейса программы для роликов, презентаций и gif — покадровая съёмка браузера в виртуальном времени (headless Chrome, beginFrame), демо-стенд с выдуманными данными, курсор, метки во время записи, запасы в начале и конце дубля, лист кадров, наезды и обрезка записи, экран программы в стилизованном кадре, версия на другом языке с теми же кликами и синхронизация рук в 3D-сцене с записью. Используй, когда снимаешь, режешь, ускоряешь или вставляешь в ролик запись экрана приложения.

What is video-skills?

video-skills is a Claude Code agent skill that правила записи интерфейса программы для роликов, презентаций и gif — покадровая съёмка браузера в виртуальном времени (headless Chrome, beginFrame), демо-стенд с выдуманными данными, курсор, метки во время записи, запасы в начале и конце дубля, лист кадров, наезды и обрезка записи, экран программы в стилизованном кадре, версия на другом языке с теми же кликами и синхронизация рук в 3D-сцене с записью. Используй, когда снимаешь, режешь, ускоряешь или вставляешь в ролик запись экрана приложения.

Works with~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/ascorblack/video-skills/tree/HEAD/ru/skills/video-ui-capture

Ask in your favorite AI

Open a new chat with this agent skill pre-loaded.

Documentation

Запись интерфейса

Каждое правило взято из уроков прошлых роликов; в квадратных скобках — источник (легенда внизу). Где источники расходятся, приведены оба совета с пометкой, к какому случаю каждый.

Короткие правила

  1. Снимайте покадрово, браузер ведите по виртуальному времени: кадр продвинул — кадр снял. Экранная запись в реальном времени рвёт кадры. [Видео] [3D]
  2. Снимайте только демо-стенд с выдуманными данными; перед записью пролистайте каждый экран глазами. [Видео] [3D]
  3. Стенд должен быть согласован сам с собой: два экрана, читающие один факт, говорят одно и то же. [Видео]
  4. Курсор едет к цели, а не мимо неё; рисуйте его на странице из тех же событий, что уходят в приложение. [Видео] [3D]
  5. Ставьте метки прямо во время записи и вешайте подписи и камеру на метки, а не на секунды. [Видео]
  6. Давайте запасы тишины в начале и в конце дубля [Видео]; во второй языковой версии вступление и хвост — той же длины, что в оригинале [3D].
  7. Каждый дубль смотрите листом кадров из 4–6 кадров. [Видео]
  8. Любое ожидание рекордера — с таймаутом; фоновые процессы гасите по pid. [Видео]
  9. Показывайте запись до видимого результата действия; наезд — на целый блок, не в кнопку. [Видео] [3D]
  10. Настоящий интерфейс или нарисованный — зависит от ролика: промо о программе снимает настоящий [Видео], стилизованный научпоп рисовал его заново [Научпоп]. См. framing.md.

Подробности

  • recording.md — как снимать: виртуальное время, стенд, метки, запасы, проверка дубля, рекордер.
  • framing.md — запись в ролике: обрезка и ускорение, наезды, курсор, экран в стилизованном кадре, настоящий или нарисованный интерфейс.
  • languages-and-sync.md — версия на другом языке и синхронизация 3D-рук с записью.

Источники

  • [Видео] — архивные уроки по видео: записи интерфейса, темп, переходы.
  • [3D] — уроки трёхмерного ролика от первого лица в браузере, где записи экранов вставлены в 3D-сцену.
  • [Научпоп] — уроки ролика в стилистике советского научпопа и диафильма начала 70-х с экранами программ в кадре.

Individual skills in this repo

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

ascorblack/video-skills

Правила 3D-анимации для роликов в браузере (three.js → покадровый рендер) и анимации фигур с предметами — руки и тело от первого лица, рукав и манжета, контакт кисти с предметами и поверхностями, смешивание поз и углов, расталкивание персонажей, ходьба без скольжения, свечение, контактные тени, процедурные материалы, детекторы пересечений и рывков. Используй, когда строишь, анимируешь или проверяешь 3D-сцену, персонажей, руки, предметы в руках или свет в ролике.

ascorblack/video-skills

Правила звука для роликов — фоновая музыка и звуковое оформление, совпадение звука с картинкой, сведение голоса и музыки (LUFS, истинный пик, приглушение), удлинение музыки без стыков, синтез дикторской озвучки (дословность, темп), архивный «эфирный» голос с помехами, сдача звука и работа с API-ключами. Используй, когда делаешь, сводишь, проверяешь или правишь музыку, звуковые эффекты, озвучку или микс ролика.

ascorblack/video-skills

Правила рендера и оптимизации роликов из HTML/браузерных кадров — грабли покадрового рендера с перемоткой (твины, CSS-анимации, transform, aspect-ratio, SVG use, тяжёлые слои), детерминизм и повторяемость, где уходит время рендера, кодирование на NVENC с битрейтом, воркеры, отвязанный от сессии рендер, вшивание звука без перерендера картинки, проверка готового файла (ffprobe) и хранение версий. Используй, когда рендеришь, ускоряешь, кодируешь, пересобираешь или сдаёшь готовое видео.

ascorblack/video-skills

Rules for the visuals of videos about programs and popular-science videos — diagrams and connector lines, terms with applied examples, how long to hold a slide, transitions without jerking, camera push-ins, titles and figures in the frame, stylization in the manner of Soviet popular science and filmstrips (palette, fonts, grain, vignette). Use when designing, drawing or editing frames, slides, diagrams, titles, transitions or the style of a video, and when checking frames before assembly.

Related Skills