Fähigkeiten website-to-hyperframes

📦

website-to-hyperframes

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

Inhaltsrevision r1 Hohes Risiko 🔑 Umgebungsvariablen⚙️ Externe Befehle📁 Dateisystemzugriff🌐 Netzwerkzugriff

HyperFrames-Videos aus Websites erstellen

Teams benötigen schnelle Möglichkeiten, eine bestehende Website in ein ausgefeiltes Videokonzept umzuwandeln. Diese Skill führt Claude, Codex oder Claude Code durch Erfassung, Designanalyse, Skripterstellung, Storyboarding, Komposition, Validierung und Auslieferung.

Unterstützt: Claude Codex Code(CC)

⚠️ 38 Schlecht

Vor der Installation anhalten und eine Bestätigung anfordern.

Prüfen Sie den Plan und holen Sie vor Änderungen an Dateien die ausdrückliche Zustimmung des Benutzers ein.

Mit meinem Agent installieren

Kopieren Sie diese Anfrage in Ihren Agent. Sie enthält die maßgebliche Skill-Seite und das Manifest.

Agent-Anfrage

Review the Skillstore skill "website-to-hyperframes" from https://skillstore.io/skills/heygen-com-website-to-hyperframes.md and its manifest at https://skillstore.io/api/skills/heygen-com-website-to-hyperframes/manifest. Verify the artifact. Stop and obtain explicit user consent before installing or changing files.

Ihr Agent sollte weiterhin seinen Plan anzeigen und alle von der Sicherheitsrichtlinie verlangten Bestätigungen anfordern.

Agent-lesbare Ressourcen

Verwenden Sie diese Links, wenn ein KI-Agent, Crawler oder Skript sauberen Kontext benötigt, statt die vollständige Seite zu lesen.

Markdown-Detailseite GET /skills/heygen-com-website-to-hyperframes.md Signiertes manifest GET /api/skills/heygen-com-website-to-hyperframes/manifest Signiertes lockfile GET /api/skills/heygen-com-website-to-hyperframes/lockfile

Testen

„website-to-hyperframes“ wird verwendet. Erfasse eine SaaS-Landingpage und erstelle ein 25-sekündiges Launch-Video.

Erwartetes Ergebnis:

Eine Website-Zusammenfassung mit Farben, Schriftarten, Abschnitten, wichtigen Assets und visueller Anmutung.
Generierte Design-, Skript- und Storyboard-Dokumente für das Video.
Eine validierte HyperFrames Studio-Vorschau-URL zur Überprüfung.

„website-to-hyperframes“ wird verwendet. Erstelle eine kurze Social-Media-Anzeige aus einer Marketing-Homepage.

Erwartetes Ergebnis:

Ein prägnantes Anzeigenskript mit Beat-Timing.
Kompositionen mit erfassten Screenshots, Logos und Typografie.
Snapshot-Prüfungen, die jede wichtige Szene vor der finalen Übergabe zeigen.

Sicherheitsaudit

Hohes Risiko

v6 • 9.7.2026 Versionsbericht öffnen

The skill performs a legitimate website-to-video workflow, but it requires external CLI execution, website capture, local artifact creation, and optional API key handling. Most static shell and reconnaissance hits are markdown false positives, while capture artifacts, repo-root .env guidance, relative asset paths, and npm validation commands remain real risks that require user awareness.

Gescannte Dateien

1,500

Analysierte Zeilen

Prüfelemente

Falschmeldungen ignoriert

Bestätigte Sicherheitsbedenken (5)

Hoch

references/step-1-capture.md:19

Environment file access

**Optional:** Set `GEMINI_API_KEY` (or `GOOGLE_API_KEY`) in a `.env` file at the repo root for riche

The skill instructs users to place Gemini or Google API keys in a repo-root .env file. This is a real secret-handling risk if the repository is shared, committed, or later read by agents.

Hoch

references/step-1-capture.md:13

Screen capture upload

Keeping the capture artifacts (`screenshots/`, `assets/`, `extracted/`, `AGENTS.md`, `CLAUDE.md`) in

The workflow captures website screenshots and assets and later uses those artifacts to build video output. This is legitimate for the skill but can expose private or copyrighted page content if used on sensitive URLs.

Hoch

references/step-1-capture.md:29

Screen capture upload

1. **View the scroll screenshots** — viewport-sized captures covering the full page height (the numb

Hoch

references/step-6-build.md:174

Screen capture upload

- **No iframes for captured content.** Iframes do not seek deterministically with the timeline — the

Hoch

references/step-6-build.md:176

Screen capture upload

- **Never stack two transform tweens on the same element.** A common failure: a `y` entrance plus a

Elemente der Fähigkeitsprüfung (15)

Dies sind echte lokale Fähigkeiten, die für diese Fähigkeit erwartet werden können; daher müssen sie überprüft werden, werden jedoch nicht als bestätigtes bösartiges Verhalten gezählt.

Hoch

references/step-1-capture.md:19

Generic API/secret keys

**Optional:** Set `GEMINI_API_KEY` (or `GOOGLE_API_KEY`) in a `.env` file at the repo root for riche

The skill instructs users to place Gemini or Google API keys in a repo-root .env file. This is a real secret-handling risk if the repository is shared, committed, or later read by agents.

Hoch

references/step-6-build.md:24

Path traversal sequence

- Logo: <img src="../capture/assets/favicon.svg"> (top-left, 40x40px)

The instructions intentionally reference files outside the composition directory via ../capture/assets paths. This is expected for HyperFrames assets but still expands file access beyond the current folder.

Hoch

references/step-6-build.md:25

Path traversal sequence

- Hero image: <img src="../capture/assets/hero-bg.png"> (full-bleed background)

Hoch

references/step-6-build.md:26

Path traversal sequence

- Noise texture: ../capture/assets/noise.png (full-frame overlay, 3% opacity)

Hoch

references/step-6-build.md:29

Path traversal sequence

@font-face { font-family: 'BrandFont'; src: url('../capture/assets/fonts/BrandFont-Regular.woff2');

Hoch

references/step-6-build.md:36

Path traversal sequence

After each sub-agent finishes, verify the composition references `../capture/assets/` — if it used i

Hoch

references/step-6-build.md:99

Path traversal sequence

5. Check for the inline anti-pattern: if the HTML contains `<svg xmlns=` or `data:image/` but no `..

Hoch

references/step-6-build.md:100

Path traversal sequence

6. Check fonts: if the HTML uses `fonts.googleapis.com` but there are captured fonts in `capture/ass

Hoch

references/techniques.md:161

Path traversal sequence

src="../capture/assets/lottie/animation-0.json"

Hoch

references/techniques.md:182

Path traversal sequence

path: "../capture/assets/lottie/animation-0.json",

Hoch

references/techniques.md:196

Path traversal sequence

src="../capture/assets/videos/clip.mp4"

Hoch

references/techniques.md:255

Path traversal sequence

Replace this placeholder with an @font-face pointing to ../capture/assets/fonts/. */

Hoch

references/techniques.md:258

Path traversal sequence

src: url("../capture/assets/fonts/Fraunces-Variable.woff2") format("woff2");

Mittel

SKILL.md:91

Ruby/shell backtick execution

**Gate:** `npx hyperframes lint` and `npx hyperframes validate` pass with zero errors, and the final

The skill requires running npx hyperframes lint and validate. These are expected project commands, but they execute local npm tooling and should be reviewed before marketplace installation.

Niedrig

references/step-7-validate.md:13

Python HTTP libraries

`validate` loads the composition in headless Chrome and catches runtime JS errors, missing assets, a

The validate step loads compositions in headless Chrome and checks failed network requests. This is a legitimate local validation path, but it can trigger outbound requests embedded in captured pages or compositions.

Risikofaktoren

🔑 Umgebungsvariablen (1)

references/step-1-capture.md:19

⚙️ Externe Befehle (18)

references/step-2-design.md:18-19 references/step-2-design.md:19-20 references/step-2-design.md:20-21 references/step-2-design.md:88-89 references/step-2-design.md:89-90 references/step-2-design.md:90-91 references/step-2-design.md:91-92 references/step-2-design.md:92 references/step-6-build.md:33-34 references/techniques.md:358-365 SKILL.md:37 SKILL.md:47 SKILL.md:57 SKILL.md:67 SKILL.md:73 SKILL.md:87 SKILL.md:88 SKILL.md:91

📁 Dateisystemzugriff (12)

references/step-6-build.md:24 references/step-6-build.md:25 references/step-6-build.md:26 references/step-6-build.md:29 references/step-6-build.md:36 references/step-6-build.md:99 references/step-6-build.md:100 references/techniques.md:161 references/techniques.md:182 references/techniques.md:196 references/techniques.md:255 references/techniques.md:258

🌐 Netzwerkzugriff (8)

references/step-7-validate.md:13 references/step-7-validate.md:80 references/step-7-validate.md:88 references/techniques.md:158 references/techniques.md:287 SKILL.md:13 SKILL.md:15 SKILL.md:87

Erkannte Muster

Screen capture upload×4

Geprüft von: claude Audit-Verlauf anzeigen →

Diesen Bericht teilen & zitieren

Teile den versionierten Bewertungsbericht, das neutrale Badge, die Einbettungskarte und Zitate. Skillstore berichtet Nachweise, ohne zu entscheiden, ob dieser Skill sicher ist.

Versionsbericht öffnen

Berichtslink kopieren

https://skillstore.io/skills/heygen-com-website-to-hyperframes/audits/6?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Markdown-Badge

[![Skillstore security assessment](https://skillstore.io/badges/skills/heygen-com-website-to-hyperframes/security.svg)](https://skillstore.io/skills/heygen-com-website-to-hyperframes?utm_source=security_passport_badge)

HTML-Badge

<a href="https://skillstore.io/skills/heygen-com-website-to-hyperframes?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/heygen-com-website-to-hyperframes/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

Einbettungskarte

<iframe src="https://skillstore.io/embed/skills/heygen-com-website-to-hyperframes.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>

Wissenschaftliche Zitate (APA · BibTeX · CFF)

APA-Zitat

heygen-com. (2026). website-to-hyperframes security audit report (audit version 6) [Author version unspecified]. Skillstore. https://skillstore.io/skills/heygen-com-website-to-hyperframes/audits/6

BibTeX-Zitat

@techreport{heygen-com-heygen-com-website-to-hyperframes-2026,
  author = {heygen-com},
  title = {website-to-hyperframes security audit report (audit version 6)},
  institution = {Skillstore},
  year = {2026},
  number = {6},
  url = {https://skillstore.io/skills/heygen-com-website-to-hyperframes/audits/6},
  note = {Author version unspecified}
}

CITATION.cff

cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "website-to-hyperframes security audit report (audit version 6)"
version: "unspecified"
type: report
authors:
  - name: "heygen-com"
date-released: "2026-07-09"
url: "https://skillstore.io/skills/heygen-com-website-to-hyperframes/audits/6"
identifiers:
  - type: other
    value: "skillstore:heygen-com-website-to-hyperframes:audit:6"
    description: "Skillstore immutable audit report identifier"

Skillstore-Score

Warum dieser Score Evidenzvertrauen: Hoch

Architektur

Wartbarkeit

Inhalt

Gemeinschaft

Spezifikationskonformität

Was Sie erstellen können

Produktlaunch-Video

Verwandeln Sie eine Produktwebsite in ein kurzes Launch-Video mit erfassten Marken-Assets, Sprechertext und animierten Szenen.

Website-basierte Social-Media-Anzeige

Erstellen Sie aus einer Landingpage eine prägnante vertikale oder quadratische Anzeige für Social-Media-Tests.

Entwurf einer Produkttour

Verwenden Sie Screenshots, sichtbaren Text und Assets von einer Website, um eine geführte Produkttour in HyperFrames zu entwerfen.

Diese Prompts ausprobieren

Ein einfaches Website-Video erstellen

Erfasse diese öffentliche Website und erstelle ein 20-sekündiges HyperFrames-Produktvideo: [URL]. Verwende die Farben, Schriftarten und wichtigsten Hero-Assets der Website.

Eine Social-Media-Anzeige aus einer Landingpage erstellen

Verwandle [URL] in eine 15-sekündige vertikale Social-Media-Anzeige. Betone das zentrale Wertversprechen, verwende schnelle, aber gut lesbare Bewegung und stoppe bei der Vorschau-URL.

Eine erzählte Produkttour erstellen

Erstelle eine 45-sekündige erzählte Produkttour aus [URL]. Schreibe das Skript, generiere Beat-Timing, erstelle die HyperFrames-Kompositionen, validiere sie und zeige mir die Studio-Vorschau.

Ein ausgefeiltes Launch-Reel erstellen

Erfasse [URL] und produziere ein filmisches Launch-Reel für technische Käufer. Verwende die erfassten Assets, integriere kinetische Typografie, validiere jeden Beat mit Snapshots und rendere erst, nachdem ich die Vorschau genehmigt habe.

Bewährte Praktiken

Verwenden Sie nur öffentliche oder autorisierte Websites und prüfen Sie erfasste Artefakte, bevor Sie Ergebnisse teilen.
Genehmigen Sie die lokale Studio-Vorschau, bevor Sie ein MP4-Rendering anfordern.
Bewahren Sie jedes Videoprojekt in einem eigenen Verzeichnis auf, damit Erfassungs-Assets und generierte Dateien isoliert bleiben.

Vermeiden

Erfassen Sie keine privaten Dashboards, authentifizierten Seiten oder Kundendaten ohne ausdrückliche Autorisierung.
Fügen Sie keine rohen SVG-, Bild- oder Schriftdateiinhalte in Prompts ein, wenn Dateipfade ausreichen.
Rendern Sie keine finalen MP4-Dateien, bevor Snapshots und die Studio-Vorschau überprüft wurden.

Häufig gestellte Fragen

Benötigt diese Skill API-Schlüssel?

Für die grundlegende Erfassung sind keine API-Schlüssel erforderlich. Optionale Gemini- oder Google-Schlüssel können Bildbeschreibungen verbessern, müssen aber sicher gehandhabt werden.

Kann sie mit jeder Website funktionieren?

Sie ist für öffentliche oder autorisierte Websites vorgesehen. Websites hinter Login, Paywalls oder rechtlichen Einschränkungen benötigen ausdrückliche Genehmigung und sorgfältige Handhabung.

Erstellt sie automatisch eine MP4?

Nein. Der Workflow liefert zuerst eine lokale HyperFrames Studio-Vorschau und rendert MP4 erst, nachdem der Nutzer ausdrücklich danach fragt.

Welche Dateien erstellt sie?

Sie erstellt Erfassungsartefakte, Designnotizen, Skripte, Storyboards, Kompositionen, Snapshots und optionale Renderdateien innerhalb eines Projektverzeichnisses.

Kann Claude Code diese Skill verwenden?

Ja. Die Skill ist mit Claude, Codex und Claude Code kompatibel, wenn das HyperFrames-Tooling verfügbar ist.

Was sollten Nutzer vor der Veröffentlichung prüfen?

Nutzer sollten erfasste Screenshots, extrahierten Text, referenzierte Assets, Vorschauszenen und generierten Sprechertext auf Genauigkeit und Rechtefreigabe prüfen.