Habilidades website-to-hyperframes

🎬

website-to-hyperframes

Name: website-to-hyperframes
Author: heygen-com

Riesgo bajo ⚙️ Comandos externos🌐 Acceso a red📁 Acceso al sistema de archivos

Crear videos profesionales desde cualquier sitio web

Convertir diseños de sitios web en videos atractivos requiere pasos técnicos complejos, desde la captura hasta la renderización. Esta habilidad automatiza todo el pipeline de 7 pasos, produciendo videos profesionales con narración, animaciones y estilos consistentes con la marca a partir de una simple URL.

Soporta: Claude Codex Code(CC)

🥉 73 Bronce

Descargar el ZIP de la skill

Subir en Claude

Ve a Configuración → Capacidades → Skills → Subir skill

Activa y empieza a usar

Pruébalo

Usando "website-to-hyperframes". Capture https://stripe.com and make me a 20-second product demo

Resultado esperado:

Un proyecto HyperFrames completo con: carpeta capture/ (capturas de pantalla, activos, tokens), DESIGN.md, SCRIPT.md, STORYBOARD.md, compositions/ con HTML animado, narration.wav, transcript.json, y URL de vista previa de localhost Studio.

Usando "website-to-hyperframes". Turn this website into a social ad: https://example.com

Resultado esperado:

Un video de 15 segundos para Instagram Stories (1080x1920) con animaciones consistentes con la marca, narración opcional de gancho y transiciones suaves entre beats.

Auditoría de seguridad

Riesgo bajo

v1 • 4/27/2026

Security evaluation confirms this skill is safe for publication. Static analysis flagged 409 potential issues, but all high-severity findings are false positives. The skill uses legitimate HyperFrames CLI tooling (npx hyperframes capture/lint/validate) for video production workflows. External commands are standard CLI tooling, network access is limited to website capture, and env_access is optional API key configuration. No malicious code execution, credential exfiltration, or data harvesting patterns detected.

Archivos escaneados

1,500

Líneas analizadas

hallazgos

Auditorías totales

Problemas de riesgo bajo (2)

SKILL.md:37-91

External Command Patterns in Documentation

287 references to shell commands (npx hyperframes) flagged by static scanner. These are legitimate CLI tooling invocations documented for the video production workflow, not malicious code execution.

references/step-1-capture.md:19

Optional API Key Environment Access

References to GEMINI_API_KEY in step-1-capture.md:19. This is an optional, user-provided enhancement for AI-powered image descriptions. Not hardcoded secrets.

Factores de riesgo

⚙️ Comandos externos (3)

references/step-1-capture.md:5-13 references/step-7-validate.md:7-114 SKILL.md:37-91

🌐 Acceso a red (1)

references/step-1-capture.md:11

📁 Acceso al sistema de archivos (1)

references/step-6-build.md:24-26

Patrones detectados

False Positive: Weak Cryptographic Algorithm FlagsFalse Positive: Screen Capture Upload FlagsFalse Positive: Ruby/Shell Backtick Execution

Auditado por: claude

Puntuación de calidad

Arquitectura

100

Mantenibilidad

Contenido

Comunidad

Seguridad

Cumplimiento de la especificación

Lo que puedes crear

Videos de lanzamiento de productos

Capturar un sitio web de producto y crear un video de lanzamiento pulido con animaciones, revelación de logotipos y destacados de características del producto.

Anuncios para redes sociales

Transformar cualquier sitio web en anuncios para Instagram o TikTok con tipografía cinética, colores de marca y narración opcional.

Videos de portafolio de sitios web

Crear recorridos en video de sitios de portafolio para usar en presentaciones, pitches o prueba social.

Prueba estos prompts

Captura simple de sitio web

Capture https://example.com and make me a 25-second product launch video

Anuncio social con formato específico

Turn this website into a 15-second social ad for Instagram: https://mysite.com

Demo de producto con narración

Create a 30-second product demo video from https://product.com using the default voiceover voice

Producción completa con temporización personalizada

Capture https://landingpage.io and produce a 45-second brand reel with: 3 intro beats, 2 feature highlights, 1 CTA. Use portrait format 1080x1920.

Mejores prácticas

Comience con sitios web que tengan una jerarquía visual clara y secciones distintas para mejores resultados de captura
Revise los activos capturados y los tokens de diseño antes de escribir el guion para asegurar consistencia con la marca
Use el paso de validación (Paso 7) para detectar problemas de diseño antes de renderizar a MP4

Evitar

No omita el paso de captura y proporcione URLs sin procesar a sub-agentes - siempre capture primero
No incruste activos (datos SVG/imagen) en las composiciones - siempre referencie archivos capturados por ruta
No use Google Fonts cuando haya fuentes capturadas disponibles - use @font-face con archivos woff2 locales

Preguntas frecuentes

¿Qué sitios web funcionan mejor con esta habilidad?

Los sitios de marketing estáticos, páginas de destino y páginas de productos funcionan mejor. Sitios con interacciones pesadas de JavaScript o muros de login pueden tener calidad de captura limitada.

¿Necesito claves API?

No se requieren claves API para captura básica y producción de video. Opcionalmente, puede configurar GEMINI_API_KEY para descripciones de imágenes con IA (~$0.001/imagen).

¿Qué formatos de video son compatibles?

Horizontal (1920x1080), Vertical (1080x1920 para Instagram Stories/TikTok) y Cuadrado (1080x1080 para feed de Instagram).

¿Puedo agregar mi propia narración?

Sí. La habilidad genera TTS, pero puede reemplazar narration.wav con su propia grabación de narración. Actualice transcript.json con sus marcas de tiempo a nivel de palabra.

¿Cuánto tiempo toma la renderización?

La captura toma 10-30 segundos. Construir composiciones toma 2-5 minutos dependiendo de la complejidad. La renderización final a MP4 vía Docker toma 1-3 minutos.

¿Cuál es la diferencia entre la URL de vista previa y el archivo MP4?

La URL de Studio en localhost (http://localhost:port) es la vista previa en vivo - comparta esto primero para revisión. El archivo MP4 es el entregable final - renderice solo bajo solicitud explícita.