Communitygithub.com

asсorblack/video-skills

Regras de animação 3D para vídeos no navegador (three.js → renderização quadro a quadro) e animação de figuras com objetos — mãos e corpo em primeira pessoa, manga e punho, contato da mão com objetos e superfícies, mistura de poses e ângulos, empurrão de personagens, caminhada sem deslizamento, brilho, sombras de contato, materiais procedurais, detectores de interseção e solavancos. Use ao construir, animar ou verificar uma cena 3D, personagens, mãos, objetos nas mãos ou iluminação no vídeo.

O que é video-skills?

Este conjunto de regras de animação 3D foi extraído de aulas de vídeos anteriores e fornece diretrizes práticas para criar animações realistas no navegador usando three.js com renderização quadro a quadro. Ele cobre desde a postura correta das mãos e do corpo em primeira pessoa, passando pela mistura suave de poses e ângulos (com `lerpAng` para evitar artefatos), até detalhes como contato preciso de objetos com as mãos, posicionamento dos pés ligeiramente abaixo da superfície para evitar flutuação, e o uso de sombras de contato para maior sensação de realismo. O pacote também inclui detectores de interseção e solavancos para verificação durante o render, além de orientações sobre materiais e iluminação. Indicado para desenvolvedores e animadores que trabalham com cenas 3D no navegador e buscam resultados profissionais com mínimo esforço computacional.

Funciona com~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/ascorblack/video-skills/tree/HEAD/ru/skills/video-3d-animation

Perguntar na sua IA favorita

Abre um novo chat com esta habilidade de agente já pré-carregada.

Documentação

Animação 3D

Cada regra foi extraída de aulas de vídeos anteriores; entre colchetes está a fonte (legenda no final).

Regras curtas

  1. Mantenha mãos, tronco, pernas e sapatos sempre na cena, não os ative apenas quando a câmera olha para baixo. [3D]
  2. Qualquer mudança de pose deve ser feita com peso e mistura em 0,25–0,6 s, não com um interruptor if (t > a). [3D]
  3. Misture ângulos apenas pelo caminho curto (lerpAng). [3D]
  4. O próximo bloco de animação deve começar na posição onde o anterior terminou, não em um ponto do caminho. [3D]
  5. Segure o objeto na mão através do contato: desloque o personagem para que a mão toque o ponto [3D]; prenda o objeto à mão, não ao corpo [Popularização Científica].
  6. Coloque os pés 0–6 mm abaixo da superfície, não acima [Popularização Científica]; levante a mão na superfície exatamente até a ponta do dedo [3D].
  7. Determine o passo das pernas com base na distância percorrida, não no tempo. [Popularização Científica]
  8. No render multiprocesso, suavize as poses de forma pré-cozida, com antecedência, e entregue as correções prontas para a página. [3D]
  9. Sombras de contato proporcionam a maior sensação de "aterrissagem" pelo menor custo. [3D]
  10. Execute os detectores de interseção e solavancos até o render completo, mas os quadros em tamanho real nos momentos de ação ainda devem ser inspecionados visualmente. [3D]

Detalhes

  • body-and-hands.md — mãos e corpo em primeira pessoa, manga e punho, contato com superfícies e móveis.
  • motion.md — mistura de poses e ângulos, blocos de animação, empurrões, "vida" entre réplicas, figuras e objetos.
  • materials-and-light.md — brilho, sombras, madeira, arredondamentos, telas, fontes, feixe de holofote.
  • frame-checks.md — detectores de interseção e solavancos, o que eles não detectam.

O render e sua aceleração estão na skill video-render; a sincronização das mãos na cena com a gravação da interface está na skill video-ui-capture.

Fontes

  • [3D] — aulas de vídeo tridimensional em primeira pessoa no navegador (three.js → renderização quadro a quadro).
  • [Popularização Científica] — aulas de vídeo no estilo de popularização científica soviética e filme de diapositivos do início dos anos 70 (animação de figuras planas e objetos).

Individual skills in this repo

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

ascorblack/video-skills

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

ascorblack/video-skills

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

ascorblack/video-skills

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

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.

Habilidades Relacionadas