Communitygithub.com

Subtítulos a partir de transcripciones

Genera archivos de subtítulos (SRT o WebVTT) precisos y sincronizados correctamente a partir de un video.

¿Qué es Subtítulos a partir de transcripciones?

Esta habilidad produce archivos de subtítulos precisos y correctamente temporizados, esenciales para accesibilidad, visualización sin sonido y refuerzo de términos técnicos en tutoriales. Soporta los formatos SRT (universal, compatible con la mayoría de plataformas y editores) y WebVTT (para reproductores web con etiquetas <track>), indicando claramente las diferencias en la sintaxis de marcas de tiempo. La habilidad prioriza la precisión del texto: recomienda usar un guion de narración ya escrito como fuente principal (por su exactitud en términos y etiquetas de UI) o, si no existe, transcribir con herramientas como Whisper y luego corregir manualmente contra el video, ya que el ASR suele fallar en nombres de productos, código y siglas. Además, establece reglas estrictas de temporización (mínimo ~1 segundo, máximo ~7 segundos por aviso), de longitud de líneas (1-2 líneas, ~32-42 caracteres cada una) y de velocidad de lectura (≤ ~17 caracteres/segundo), con recomendaciones para dividir avisos largos y evitar cortes en medio de frases. También incluye pautas para subtítulos "limpios" (eliminando muletillas) frente a transcripciones literales, y para verificar la sincronización en varios puntos del video. El producto final se entrega sin estilos ni posicionamiento (dejando eso a herramientas posteriores como social-video-formatter) y es apto para su uso en plataformas de video, editores y reproductores web.

Compatible con~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/SkillMedev/tutorial-video-studio/tree/main/skills/captions-from-transcript

Preguntar en tu IA favorita

Abre un nuevo chat con esta habilidad de agente ya precargada.

Documentación

¿Qué hace Subtítulos a partir de transcripciones?

Los subtítulos no son un adorno opcional: son accesibilidad, mantienen a los espectadores que ven sin sonido y, en tutoriales, refuerzan términos exactos de la interfaz. Esta habilidad produce un archivo de subtítulos limpio y correctamente sincronizado. El estilo y la incrustación se realizan en pasos posteriores.

Obtener primero el texto más preciso

La precisión depende de dónde se empiece:

  • Si existe un guion de narración, úsalo como referencia. Ya es correcto en términos técnicos y etiquetas de interfaz. Ajústalo al audio en lugar de transcribir desde cero.
  • De lo contrario, transcribe el audio (Whisper, los subtítulos automáticos de la plataforma o cualquier ASR), luego corrígelo contra el video. El ASR tergiversa habitualmente nombres de productos, código y siglas: corrige cada uno para que coincida exactamente con lo que se ve en pantalla.

Nunca publiques la salida del ASR sin corregir. Los errores siempre recaen en las palabras de mayor valor.

Sincronizar los avisos con el habla

  • Cada aviso aparece cuando se dice su línea y desaparece cuando termina: ajústalo al habla, no a intervalos arbitrarios.
  • Mínimo ~1 segundo en pantalla (incluso para avisos cortos), máximo ~7 segundos. Divide cualquier aviso más largo.
  • Sin espacios vacíos a mitad de frase; los pequeños espacios entre frases están bien y ayudan a la legibilidad.

Reglas de líneas y lectura

  • 1-2 líneas por aviso, nunca 3.
  • ~32-42 caracteres por línea. Más allá de eso, satura el encuadre y sobrepasa las zonas seguras.
  • Velocidad de lectura ≤ ~17 caracteres/segundo (≈160-180 palabras por minuto). Si un aviso la supera, las palabras pasan rápidamente: divide el aviso o alarga su duración.
  • Divide las líneas en límites de cláusula, nunca a mitad de frase. Mantén unido "a la página de Configuración"; no dejes "la" sola en una línea.

Elegir el formato

  • SRT: universal, índice + HH:MM:SS,mmm --> HH:MM:SS,mmm + texto. Úsalo para subir a la mayoría de plataformas y editores.
  • WebVTT (.vtt): cabecera WEBVTT, marcas de tiempo HH:MM:SS.mmm, soporta posicionamiento y estilo de avisos. Úsalo para la etiqueta HTML5 <track> y el reproductor web.

Genera una salida válida y analizable: puntuación de marcas de tiempo correcta (SRT usa coma antes de los milisegundos, VTT un punto), línea en blanco entre avisos, sin espacios al final.

Limpio frente a literal

Para tutoriales, subtítulos limpios: elimina muletillas ("eh", "esto", falsos comienzos), mantén el significado exacto. Conserva términos técnicos, código y etiquetas de interfaz exactamente. Solo usa transcripción estrictamente literal si el usuario lo necesita explícitamente (contextos legales, investigación, citas textuales).

Verificar la sincronización

Comprueba con el video real al principio, en un punto intermedio y al final —la deriva se acumula—. Confirma que los avisos caigan en sus líneas y desaparezcan antes de que comience el siguiente. Corrige cualquier subtítulo que se quede en la toma equivocada.

Entrega

El archivo .srt / .vtt terminado alimenta a social-video-formatter para la incrustación y el estilo de la plataforma, o bien al elemento <track> del reproductor web directamente. Deja el color, la fuente, la posición y la animación para esos pasos: esta habilidad genera texto preciso y bien sincronizado, y nada más.

No hacer

  • No estilizar, colorear, posicionar ni incrustar subtítulos en el fotograma —eso es tarea de social-video-formatter—.
  • No animar palabra por palabra —eso es kinetic-typography—.
  • No publicar ASR sin corregir; los errores se concentran justo en los términos importantes.
  • No apilar 3 líneas ni superar el presupuesto de velocidad de lectura para evitar dividir un aviso —divídelo—.

Individual skills in this repo

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

Kinetic Typography

Put text in motion the right way - title cards, animated captions, lower-thirds, callouts, and word-by-word reveals - with a reading-time-per-word budget so copy holds long enough to read, plus enter/exit timing, weight and size transitions, and type hierarchy in motion. Use when someone asks to

Motion Design Principles

The craft layer for motion: pick the right easing (ease-in / ease-out / ease-in-out / spring), get timing and spacing right, build the anticipation→action→follow-through arc, and apply Disney

Narration Script

Write the spoken voiceover for a tutorial or demo - the actual words, phrased for the ear and synced one-instruction-per-action to what is on screen, with a pacing budget and a confident, jargon-checked tone. Use when someone says

Product Demo Director

Direct the craft of putting a real software UI on screen - cursor choreography, zoom/pan/callout language, screen-recording vs recreated-UI, and making state changes legible with highlights, focus pulls, and slow-downs. Use when filming or recreating an app for a product demo, feature walkthrough, onboarding clip, or release reel and asking

Remotion Compose

Turns a natural-language video brief into a complete, ready-to-preview Remotion composition - extracts duration, scenes, brand colors, aspect ratio, and real copy; plans the frame budget; and writes data-driven React/TypeScript using useCurrentFrame, interpolate, spring, AbsoluteFill, and Sequence, registered in Root.tsx. Use when someone says

Remotion Render

Renders a Remotion composition to MP4 and runs the edit-and-re-render loop - CLI render commands, 1080p/4K/9:16 presets, concurrency tuning, codec selection, batch variants from a JSON data file, and Lambda for cloud rendering. Use when someone says

Remotion Setup

Scaffolds a new Remotion video project wired for Claude Code Agent Skills - Node check, create-video scaffold, skills install, folder conventions, Google Fonts, and a smoke-test render. Use whenever someone wants to start making videos with Remotion and Claude, even just

Screencast Capture

Capture clean raw screen and camera footage for a tutorial or product demo - choosing the recorder (macOS Screenshot toolbar, QuickTime, OBS, Windows Game Bar), setting resolution / frame-rate / cursor / microphone, prepping a distraction-free stage, and recording in retakeable segments. Use when someone says

SkillMedev/tutorial-video-studio

Plan a product demo, feature announcement, or launch video as a beat sheet and shot list BEFORE animating - hook in the first 3s, problem, reveal, proof, CTA - with target duration and pacing per scene type, output as a JSON scene plan that remotion-compose consumes directly. Use when someone says

Social Video Formatter

Reframe and export a finished video for social platforms - 9:16 ↔ 16:9 cropping, burned-in captions, a platform-native first frame, loop design, and per-platform specs (aspect, length, safe areas) for TikTok, Reels, Shorts, X, and LinkedIn. Use when someone says

Sound and Music Sync

Score a video like an editor: beat-match cuts to the music, land SFX on transitions, pace the voiceover so it breathes, source royalty-free tracks safely, and duck the music so the VO sits clearly on top. Use when adding music, sound effects, or voiceover to a video, when asked to

Skills relacionados