Communitygithub.com

Efectos: 51 efectos de video (by Ray, @raycfu)

Añade cualquiera de 51 efectos de video a un video de persona hablando: órbita, foco, widgets de vidrio, línea de tiempo, lista de verificación, muro de titulares, cuadro de comentarios, abanico de teléfonos, gráfico de vidrio líquido, match-cut, interruptores de iPhone, letrero LED, zoom por encima del hombro, ventanas emergentes de iMessage, colocar en cuadrícula y más. Los efectos siguen la cara del hablante y pueden colocarse detrás de su cabeza. Úsalo cuando el usuario escriba /effects, nombre uno de los efectos o pida añadir un efecto, zoom, calificación, pegatina o animación a su video.

¿Qué es Efectos: 51 efectos de video (by Ray, @raycfu)?

Este skill proporciona 51 efectos visuales profesionales para videos de persona hablando (talking-head). Está diseñado para ser utilizado por usuarios no técnicos, por lo que el asistente debe ejecutar todos los comandos sin que el usuario tenga que intervenir. Los efectos incluyen desde animaciones de texto y gráficos hasta transiciones complejas como órbitas, zooms dinámicos y ventanas emergentes de mensajes. El skill soporta plataformas macOS y Windows, y requiere Python 3.12 y FFmpeg. Para usarlo, primero se ejecuta un script de configuración (scripts/setup.sh) que instala las dependencias necesarias. Luego se selecciona un video (preferiblemente vertical de teléfono) y un efecto, ya sea especificándolo con /effects o describiéndolo. El skill permite planificar múltiples efectos en secuencia usando un archivo JSON, y antes de renderizar el video final, se pueden verificar cuadros de prueba para asegurar que los efectos no cubran la cara del hablante. El resultado es un video MP4 con el audio original conservado.

Compatible con✓Claude Code~Codex CLI✓Cursor
npx skills add https://github.com/raycfu/claude_design_skills/tree/HEAD/effects

Preguntar en tu IA favorita

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

Documentación

Efectos: 51 efectos de video (por Ray, @raycfu)

Normalmente el usuario no es técnico. Mantén las respuestas cortas y amigables, haz el trabajo por ellos y nunca les pidas que ejecuten comandos ellos mismos.

Todas las rutas siguientes son relativas a la carpeta de este skill (la carpeta donde está este SKILL.md). Usa su ruta absoluta en los comandos.

1. Primera ejecución: configuración (una vez)

Ejecuta bash scripts/setup.sh. Imprime READY cuando termine (la primera vez toma de 1 a 3 minutos).

  • NEED_FFMPEG: instálalo por ellos. En Mac: brew install ffmpeg (si falta brew, diles que instalen Homebrew desde brew.sh primero). En Windows: winget install ffmpeg.
  • NEED_PYTHON: instala Python 3.12 (Mac: brew install [email protected], Windows: winget install Python.Python.3.12), luego vuelve a ejecutar la configuración.
  • En Windows, el Python está en .venv\Scripts\python.exe en lugar de .venv/bin/python.
  • Windows sin bash: ejecuta py -3.12 -m venv .venv, luego .venv\Scripts\python.exe -m pip install -r requirements.txt. Recorte opcional más limpio: descarga https://github.com/PeterL1n/RobustVideoMatting/releases/download/v1.0.0/rvm_mobilenetv3_fp32.onnx en models/.
  • NEED_PYTHON_312: su Python predeterminado no pudo instalar los paquetes. Instala Python 3.12 como se indicó y vuelve a ejecutar la configuración.
  • Las líneas de registro inofensivas de TensorFlow Lite, MediaPipe u OpenCV (INFO:, WARNING:, W0000, [ WARN) son normales. Solo Done: o saved significan éxito.

2. Obtén el video y el efecto

  • Video: el usuario arrastra el archivo al chat o proporciona una ruta. Un video vertical de teléfono funciona mejor.
  • Efecto: de /effects <nombre> o de lo que describan. Haz coincidir sus palabras con la tabla de abajo. ¿No estás seguro? Muéstrales la lista.
  • Su nombre y usuario: los efectos que muestran un perfil (glass-widgets, comment-box, pastel-word, profile-wall, headline-wall y otros) usan por defecto Ray / @raycfu. Pregunta al usuario los suyos una vez y pasa name y handle en cada efecto.

3. Encuentra la sincronización

  • Si dicen "en la palabra X" o "cuando diga ...", ejecuta .venv/bin/python scripts/words.py <video> y usa esos tiempos.
  • Si no dan sincronización, aplica el efecto a todo el clip, o pregunta qué parte (una pregunta corta).
  • Las ventanas cortas se ven mejor: de 1.5 a 4 segundos por efecto.

4. Borrador, revisión, renderizado

  1. Escribe el plan junto a su video como <video-name>_effects.json:
    {"effects": [
      {"fx": "orbit", "start": 3.2, "end": 6.0},
      {"fx": "backdrop-word", "start": 14.0, "end": 16.3, "text": "CLAUDE"}
    ]}
    
  2. Revisa los fotogramas primero (rápido): .venv/bin/python scripts/fx.py --plan <plan.json> <video> <carpeta>/check.png --still 4.5,15.2, usando la mitad de cada efecto. Mira los PNG tú mismo. Corrige el texto, la sincronización o las opciones si algo se ve mal (cubre la cara, se corta por el borde, ilegible).
  3. Renderiza: .venv/bin/python scripts/fx.py --plan <plan.json> <video> <video-name>_effects.mp4. La salida conserva su audio original. Renderiza a 1080p por defecto; añade --width 2160 para 4K (más lento).
  4. Diles dónde está el archivo. Recuérdales en una línea que lo vean antes de publicarlo: se hace un borrador, ellos aprueban.

Un solo efecto no necesita plan: .venv/bin/python scripts/fx.py orbit <video> <out.mp4> --start 3 --end 6 --text "..." --opt key=value.

Los 51 efectos

#Nombre fxQué haceOpciones (todas opcionales)
1noiseLos reels se acumulan detrás de tu cabeza, uno cada cuarto de segundoimages (carpeta de capturas o clips), size
2lineupBaldosas numeradas se despliegan en arco sobre tu cabezatext (nombres de baldosas unidos con `
3locked-onSoporte de esquinas se fija en tu cara, la cámara te siguezoom (predeterminado 1.35), text (etiqueta)
4orbitTus reels circulan alrededor de tu cabeza: al frente abajo, detrás arribaimages, count, speed, size
5lean-inUn zoom rápido en una palabrazoom (predeterminado 1.45, máximo 2), speed
6backdrop-wordUna palabra gigante aparece detrás de titext, color (hex), font (bold o serif)
7spotlightApaga las luces, te mantiene iluminadotext (palabra brillante detrás de ti), color, push
8the-billImprime tus instrucciones como un recibo en la pared sobre tu cabezatext (líneas unidas con `
9moodyUna calificación de color melancólicagrade (moody, bw, warm, cool, pop)
10swipeUn control deslizante de antes y después cruza por tigrade (el aspecto "después")
11todoUna tarjeta de lista de verificación al lado de tu cabeza marca mientras hablastext (elementos con `
12comment-boxUna barra de comentarios de Instagram escribe una palabra y la publicatext (predeterminado EFFECTS)
13tapUn botón de Seguir aparece y se voltea a Siguiendoat (segundo de video del giro), x, y (0 a 1), color
14pause-pointCongela el fotograma y te señala con una flecha dibujada a manotext (etiqueta), color, label_x
15uninstallUna barra de desinstalación defectuosa rompe el fotogramatext
16reel-frameTu video se encoge en una tarjeta de reel de Instagramtext (usuario)
17shortcut-rainTeclas de teclado llueven detrás de titext (teclas con `
18reject-stampUn sello rojo grande se estampa en la pantallatext, color, angle, y
19countdown-flipUn reloj de cuenta atrás 3, 2, 1 sobre tu cabezafrom
20rabbit-holeEl fotograma se tuneliza dentro de sí mismo, girandoratio, speed, spin
21cover-starTe conviertes en una portada de revista, título detrás de tu cabezatext (título), lines (con `
22scribbleGarabatos de marcador se dibujan a tu alrededortext (etiqueta), color
23glass-widgetsWidgets de vidrio esmerilado y mini artefactos flotan alrededor de tu cabeza, más una píldora Editado por Claudetext (número grande), name, handle, look (simple para la versión de 3 widgets)
24red-collageTú en blanco y negro, una palabra roja gigante detrás, tres líneas entran con fuerzatext (palabra roja), lines (con `
25split-headlineUna tarjeta de titular se desliza hacia abajo y te empuja a la mitad inferiortext (líneas con `
26pastel-wordHabitación lavanda, palabra gigante detrás de ti, se sigue una tarjeta de perfiltext, name, handle
27check-pillsHabitación de papel cuadriculado, tableros de reel detrás de ti, un cursor hace clic en píldoras azulestext (píldoras con `
28timelineUna calificación de película roja oscura con una línea de tiempo de edición, un código de tiempo REC y un cabezal de reproducción brillantetext (título), sub, tc
29headline-boxUn zoom con un titular de dos líneas, la segunda línea en un cuadro blancotext (líneas con `
30profile-wallTu cuadrícula de reels llena la pared detrás de ti mientras un contador subeimages, count, label
31tier-listUna lista de niveles aparece y Claude vuela al nivel Stitle, item, others
32broll-splitMetraje secundario arriba con una pegatina de precio, tú abajoimages, text (etiqueta)
33phone-fanTus reels se despliegan como un manojo de teléfonos bajo un titularimages, text (líneas con `
34dot-revealTu toma se construye a partir de puntos brillantes, luego se fija a la imagen completacolor, cell
35headline-wallTus propios titulares se acumulan detrás de tu cabeza, luego aparece un total al frentetext (`headline::meta
36checklistUna lista de tareas de Claude bajo tu barbilla: cada paso gira, luego se marca verdetext (`step::meta
37liquid-glass-graphUna tarjeta de vidrio líquido bajo tu barbilla: un gráfico verde sube mientras el número cuentatext (etiqueta), from, to (ej. 197K, 59%), color
38carousel-spinTus reels giran a tu alrededor en un carrusel 3D, luego se detienen lentamenteimages, count, size, turns
39match-cutPáginas de noticias cortan en una palabra, encerradas en un cuadro rojo detrás de tu cabezatext (la palabra, predeterminado Claude), color
40apple-togglesUna tarjeta de configuración de iPhone bajo tu barbilla activa sus interruptores, una línea a la veztext (filas con `
41led-signLas luces bajan y un letrero LED brillante se escribe detrás de titext (líneas con `
42slow-pushUn lento zoom cinematográfico a tu cara mientras la habitación se desenfocazoom (predeterminado 1.6), blur
43over-the-shoulder-zoomLa cámara se acerca a una esquina superior y aparece un gráfico de vidrio líquido transparente al lado de tu cabeza (la línea sube, el número cuenta), retrocede, luego la otra esquina con un segundo gráfico de barras relacionado. Tu cabeza permanece al frentetext (dos etiquetas con `
44messagesNotificaciones de iMessage aparecen una tras otra, vidrio cremoso con un brillo suave, apilándose sobre la parte inferior del fotogramatext (mensajes con `
45place-in-gridTe encoges en la baldosa central de tu cuadrícula de perfil 3x3 sobre vidrio esmerilado, luego 8 reels aparecen a tu alrededor, uno por fotograma, con recuentos de vistas de Instagram en cada baldosaimages (carpeta de tus reels o portadas), views (9 recuentos con `
46tape-labelUna tira nivelada de cinta amarilla con tu línea aterriza en tu pecho, manteniéndose alejada de tu caratext
47select-resizeUn cuadro de selección azul con manijas agarra tu número sobre tu cabeza y un cursor lo arrastra más grandetext (predeterminado 2X)
48wave-trimUn panel oscuro sobre tu cabeza muestra tu voz; el silencio rojo punteado en ambos extremos se colapsa hasta que solo quedan tus palabrasninguno
49huge-strikeUna palabra serif enorme se desliza detrás de tu cabeza, luego una línea roja la tachatext, at (segundos desde el inicio del efecto cuando cae el tachado, predeterminado 0.6)
50crayon-writeUn crayón rojo escribe tu palabra detrás de tu cabeza, luego la subraya y vuelatext
51fan-buildTus portadas de reel se reparten en un abanico detrás de tu cabeza, una carta a la vezimages (carpeta de tus portadas), count (predeterminado 13)

Looks nombrados (mismo efecto, un look más elegante; no aumentan el conteo):

  • glitter-spotlight = spotlight con look=sparkle: la habitación se oscurece, rayos dorados brotan detrás de tu cabeza, una gran palabra dorada con un barrido brillante, destellos centelleantes y un resplandor a tu alrededor. text (la palabra), color, push.
  • cover-star con look=editorial: un look suave y cálido de película, un encabezado serif clásico detrás de tu cabeza, una línea de número y líneas de portada elegantes. text (encabezado), issue, lines (3 líneas con |), right (líneas con |), color, accent, lines_y, right_y.
  • liquid-glass-graph con look=bento: el gráfico ascendente se mueve a una pantalla de vidrio ahumado detrás de tu cabeza, con baldosas bento de vidrio frente a ti (una dona, un KPI, barras). text, from, to, donut (29%::label), kpi (672K::label), bars (197|140|124::label).
  • apple-toggles ahora se sitúa sobre ti, detrás de tu cabeza, con un zoom suave (pos=below para la vieja tarjeta bajo la barbilla; overlap, zoom).

Los alias también funcionan: bill, to-do, follow, stamp, countdown, cover, rain, pause.

Reglas

  • Nunca cubras la cara. Todo va detrás de la persona o evita la cara por sí mismo; si un fotograma de revisión muestra texto sobre la cara, muévelo (x, y) o acorta el texto.
  • Los efectos se ejecutan en el orden listado. Pon los efectos de cámara (locked-on, lean-in, spotlight) primero cuando se superpongan con otros.
  • El zoom nunca supera 2x, para que el video se mantenga nítido.
  • Este skill añade solo visuales. Los efectos de sonido y subtítulos quedan a cargo del usuario (CapCut funciona bien).
  • Estas son versiones iniciales. Sé honesto al respecto si el usuario las compara con un reel que vieron.

Opciones extra (edición de Ray)

Se añadieron sobre los efectos iniciales para corregir lo que se veía mal en metraje real. Pásalas como cualquier otra opción ("key": "value" en un plan, o --opt key=value).

EfectoOpciónQué hace
cualquier efecto de tarjeta/órbitaplay=1Reproduce cada video en la carpeta images dentro de su tarjeta en lugar de una imagen fija
liquid-glass-graphpos=behindPone el gráfico en una pantalla de vidrio oscuro detrás de tu cabeza en lugar de sobre tu pecho
liquid-glass-graphsmoke=0.5..0.85Vidrio ahumado oscuro en lugar de vidrio líquido transparente (sin copia borrosa de tu cuerpo)
liquid-glass-graph, over-the-shoulder-zoomto=$32,000Prefijos de moneda y separadores de miles cuentan correctamente
checklistsmoke, scale=0.86, bottom=0.95, guard=0Tarjeta oscura legible, más pequeña, colocada baja para que nunca toque tu cara
checklistspan=2.9Segundos durante los cuales caen las marcas, para que la última marca coincida con tu gesto
spotlightflicker=0, lift=0.8Apaga el parpadeo neón, o baja la palabra para que tu cabeza cubra parte de ella
cover-starmast_y=0.15Altura fija del encabezado (combínalo con un recorte más ajustado para que tu cabeza se superponga)
comment-boxlock=1, avatar_color=#FDB827Fija la hoja de comentarios en su lugar, establece el color del avatar (la letra viene de handle)

Manos delante de una tarjeta: renderiza el efecto, luego ejecuta .venv/bin/python scripts/hands_front.py <original> <con_efecto> <salida>.

Calidad del recorte: si existe models/rvm_mobilenetv3_fp32.onnx, cada efecto usa Robust Video Matting para el recorte de la persona (cabello más limpio, sin parpadeo). Establece FX_MATTE=mp para usar el segmentador original de MediaPipe.

Individual skills in this repo

This repo contains 1 individual skill — each has its own dedicated page.

Skills relacionados