Fähigkeiten hyperframes-animation

📦

hyperframes-animation

Name: hyperframes-animation
Author: heygen-com

Inhaltsrevision r2 Hohes Risiko ⚙️ Externe Befehle🌐 Netzwerkzugriff📁 Dateisystemzugriff⚡ Enthält Skripte🔑 Umgebungsvariablen

Deterministische HyperFrames-Animationen erstellen

Komplexe Bewegungsszenen lassen sich nur schwer deterministisch und suchsicher halten. Diese Skill bietet wiederverwendbare HyperFrames-Regeln, Blueprints, Übergänge, Adapter und Choreografie-Audits.

Unterstützt: Claude Codex Code(CC)

⚠️ 38 Schlecht

Maintain this Skill? Claim it ⚠️ 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 "hyperframes-animation" from https://skillstore.io/skills/heygen-com-hyperframes-animation.md and its manifest at https://skillstore.io/api/skills/heygen-com-hyperframes-animation/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-hyperframes-animation.md Signiertes manifest GET /api/skills/heygen-com-hyperframes-animation/manifest Signiertes lockfile GET /api/skills/heygen-com-hyperframes-animation/lockfile

Testen

„hyperframes-animation“ wird verwendet. Animieren Sie sechs Feature-Karten zu einer Produktübersicht.

Erwartetes Ergebnis:

Verwenden Sie den Blueprint grid-card-assemble. Staffeln Sie kurze Slide-and-Fade-Eintritte, halten Sie das aufgelöste Raster und lenken Sie dann den Fokus auf die primäre Karte.

„hyperframes-animation“ wird verwendet. Erstellen Sie einen suchbaren 3D-Geräteeintritt.

Erwartetes Ergebnis:

Verwenden Sie Three.js für das Gerät und eine einzelne pausierte HyperFrames-Timeline. Steuern Sie Kamera, Objekttransformationen und Mixer-Zeit aus deterministischen Suchwerten.

„hyperframes-animation“ wird verwendet. Prüfen Sie eine Animationskarte mit einem langen leeren Intervall.

Erwartetes Ergebnis:

Die Karte zeigt einen choreografischen Leerraum. Verlängern Sie das vorherige Einpendeln, ziehen Sie den nächsten Eintritt vor oder fügen Sie einen gezielten Fokusübergang hinzu.

Sicherheitsaudit

Hohes Risiko

v5 • 19.7.2026 Versionsbericht öffnen

Most static matches are false positives caused by animation documentation, JavaScript template literals, example URLs, and test utilities. The audit confirmed a dependency-provenance risk: environment-controlled module search paths feed a dynamic import, and the fallback bootstrap can install @latest. No prompt injection, secret collection, covert exfiltration, or screen-capture upload behavior was found. Static review was capped at 400/648 representative findings; omitted static matches are unconfirmed, so automatic publishing stays disabled until manual review.

102

Gescannte Dateien

25,346

Analysierte Zeilen

Prüfelemente

Falschmeldungen ignoriert

Bestätigte Sicherheitsbedenken (3)

Hoch

scripts/package-loader.mjs:221

Environment file access

return (process.env[NODE_MODULES_ENV] ?? "").split(delimiter).filter(Boolean);

This environment variable controls directories searched for module resolution. Its value can influence which JavaScript module is dynamically imported.

Hoch

scripts/package-loader.mjs:226

Environment file access

for (const entry of (process.env.PATH ?? "").split(delimiter)) {

PATH-derived node_modules directories participate in module resolution before dynamic import. A manipulated environment can redirect execution to an attacker-controlled local package.

Hoch

scripts/package-loader.mjs:148-159

Unpinned fallback dependency bootstrap

When the bundled package version cannot be discovered, the loader falls back to @latest before a temporary npm install. This weakens the stated pinned-spec protection and permits an unexpected package version to execute after installation.

The code explicitly returns an @latest package spec in this fallback path, while the file comments describe pinned specifications as a security control.

Elemente der Fähigkeitsprüfung (5)

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.

Mittel

scripts/package-loader.mjs:54

Dynamic import() expression

modules[packageName] = await import(pathToFileURL(entry).href);

The loader dynamically imports a module entry resolved from configured directories. A malicious package placed in a trusted-by-process module location would execute in the local Node process.

Niedrig

scripts/package-loader.mjs:221

Environment variable access (bracket notation)

return (process.env[NODE_MODULES_ENV] ?? "").split(delimiter).filter(Boolean);

This environment variable controls directories searched for module resolution. Its value can influence which JavaScript module is dynamically imported.

Niedrig

scripts/package-loader.mjs:226

Environment variable access (dot notation)

for (const entry of (process.env.PATH ?? "").split(delimiter)) {

PATH-derived node_modules directories participate in module resolution before dynamic import. A manipulated environment can redirect execution to an attacker-controlled local package.

Niedrig

scripts/package-loader.mjs:221

Environment variable object

return (process.env[NODE_MODULES_ENV] ?? "").split(delimiter).filter(Boolean);

This environment variable controls directories searched for module resolution. Its value can influence which JavaScript module is dynamically imported.

Niedrig

scripts/package-loader.mjs:226

Environment variable object

for (const entry of (process.env.PATH ?? "").split(delimiter)) {

PATH-derived node_modules directories participate in module resolution before dynamic import. A manipulated environment can redirect execution to an attacker-controlled local package.

Risikofaktoren

⚙️ Externe Befehle (50)

adapters/animate-text.md:57-58 adapters/animate-text.md:58-59 adapters/animate-text.md:59-60 adapters/html-in-canvas-patterns.md:104-127 adapters/html-in-canvas-patterns.md:168-171 adapters/html-in-canvas-patterns.md:192-217 adapters/html-in-canvas-patterns.md:301-307 adapters/html-in-canvas-patterns.md:308-315 examples/brand-reveal-assemble-zoom.html:252 examples/concept-demo-decode-pan.html:18 examples/concept-demo-decode-pan.html:321 examples/cta-orbit-collapse.html:302 examples/cta-orbit-collapse.html:363 examples/cta-orbit-collapse.html:430 examples/cta-orbit-collapse.html:941 examples/cta-orbit-collapse.html:942 examples/cta-orbit-collapse.html:974 examples/cta-orbit-collapse.html:999 examples/cta-orbit-collapse.html:1017 examples/cta-orbit-collapse.html:1061 examples/cta-orbit-collapse.html:1062 examples/cta-orbit-collapse.html:1238 examples/demo-page-scroll-spotlight.html:645 examples/demo-page-scroll-spotlight.html:646 examples/hook-counter-burst.html:465 examples/hook-counter-burst.html:502 examples/messaging-multi-phrase.html:32 examples/messaging-multi-phrase.html:38 examples/messaging-multi-phrase.html:39 examples/messaging-multi-phrase.html:96 examples/problem-mockup-overwhelm.html:28 examples/problem-mockup-overwhelm.html:30 examples/problem-mockup-overwhelm.html:37 examples/problem-mockup-overwhelm.html:38 examples/proof-logo-chain.html:581 examples/takeover-ticker-displace.html:264 examples/takeover-ticker-displace.html:274 examples/workflow-approve-press.html:583 examples/workflow-approve-press.html:586 rules/3d-text-depth-layers.md:86-93 rules/3d-text-depth-layers.md:93-94 rules/3d-text-depth-layers.md:94-136 rules/3d-text-depth-layers.md:136-145 rules/3d-text-depth-layers.md:177-183 rules/3d-text-depth-layers.md:190-191 rules/ai-tracking-box.md:156-184 rules/ai-tracking-box.md:184-185 rules/ai-tracking-box.md:185-192 rules/ai-tracking-box.md:192-193 rules/ai-tracking-box.md:193-194

🌐 Netzwerkzugriff (50)

adapters/animejs.md:23 adapters/animejs.md:74 adapters/gsap.md:15 adapters/html-in-canvas-patterns.md:133 adapters/html-in-canvas-patterns.md:134 adapters/html-in-canvas-patterns.md:135 adapters/html-in-canvas-patterns.md:136 adapters/html-in-canvas-patterns.md:137 adapters/lottie.md:24 adapters/lottie.md:50 adapters/three.md:26 adapters/three.md:75 adapters/three.md:76 examples/brand-reveal-assemble-zoom.html:28 examples/comparison-split-cards.html:28 examples/concept-demo-decode-pan.html:23 examples/cta-morph-press.html:30 examples/cta-orbit-collapse.html:62 examples/demo-page-scroll-spotlight.html:28 examples/hook-counter-burst.html:34 examples/messaging-multi-phrase.html:43 examples/metric-video-text-pivot.html:34 examples/problem-mockup-overwhelm.html:48 examples/proof-logo-chain.html:29 examples/takeover-ticker-displace.html:25 examples/workflow-approve-press.html:34 rules/3d-page-scroll.md:108 rules/3d-text-depth-layers.md:78 rules/ai-tracking-box.md:137 rules/ambient-glow-bloom.md:118 rules/asr-keyword-glow.md:90 rules/avatar-cloud-network.md:148 rules/camera-cursor-tracking.md:108 rules/card-morph-anchor.md:107 rules/center-outward-expansion.md:87 rules/context-sensitive-cursor.md:85 rules/coordinate-target-zoom.md:180 rules/counting-dynamic-scale.md:108 rules/cursor-click-ripple.md:99 rules/depth-of-field-blur.md:97 rules/depth-scatter-assemble.md:98 rules/discrete-text-sequence.md:84 rules/dynamic-content-sequencing.md:113 rules/gsap-effects.md:217 rules/gsap-effects.md:19 rules/gsap-effects.md:20 rules/hacker-flip-3d.md:86 rules/kinetic-beat-slam.md:88 rules/motion-blur-streak.md:130 rules/motion-blur-streak.md:159

📁 Dateisystemzugriff (50)

adapters/gsap-transforms-and-perf.md:120 adapters/gsap.md:65 adapters/gsap.md:83 examples/demo-page-scroll-spotlight.html:580 examples/demo-page-scroll-spotlight.html:582 examples/demo-page-scroll-spotlight.html:584 examples/hook-counter-burst.html:357 examples/hook-counter-burst.html:366 examples/problem-mockup-overwhelm.html:959 examples/problem-mockup-overwhelm.html:975 examples/proof-logo-chain.html:465 rules/avatar-cloud-network.md:259 rules/avatar-cloud-network.md:263 rules/avatar-cloud-network.md:266 rules/cursor-click-ripple.md:169 rules/cursor-click-ripple.md:176 rules/cursor-click-ripple.md:181 rules/cursor-click-ripple.md:187 rules/cursor-click-ripple.md:193 rules/cursor-click-ripple.md:198 rules/cursor-click-ripple.md:204 rules/cursor-click-ripple.md:210 rules/cursor-click-ripple.md:215 rules/cursor-click-ripple.md:222 rules/cursor-click-ripple.md:226 rules/cursor-click-ripple.md:231 rules/dynamic-content-sequencing.md:249 rules/dynamic-content-sequencing.md:255 rules/dynamic-content-sequencing.md:261 rules/dynamic-content-sequencing.md:267 rules/dynamic-content-sequencing.md:273 rules/dynamic-content-sequencing.md:279 rules/dynamic-content-sequencing.md:285 rules/gsap-effects.md:218 rules/hacker-flip-3d.md:167 rules/hacker-flip-3d.md:171 rules/hacker-flip-3d.md:175 rules/hacker-flip-3d.md:179 rules/hacker-flip-3d.md:183 rules/kinetic-beat-slam.md:155 rules/kinetic-beat-slam.md:169 rules/kinetic-beat-slam.md:181 rules/motion-blur-streak.md:300 rules/motion-blur-streak.md:325 rules/orbit-3d-entry.md:181 rules/orbit-3d-entry.md:187 rules/orbit-3d-entry.md:193 rules/orbit-3d-entry.md:199 rules/orbit-3d-entry.md:205 rules/orbit-3d-entry.md:211

⚡ Enthält Skripte (4)

rules/hacker-flip-3d.md:95 scripts/package-loader.mjs:54 scripts/package-loader.test.mjs:17 scripts/package-loader.test.mjs:30

🔑 Umgebungsvariablen (28)

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-hyperframes-animation/audits/5?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Markdown-Badge

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

HTML-Badge

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

Einbettungskarte

<iframe src="https://skillstore.io/embed/skills/heygen-com-hyperframes-animation.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). hyperframes-animation security audit report (audit version 5) [Author version unspecified]. Skillstore. https://skillstore.io/skills/heygen-com-hyperframes-animation/audits/5

BibTeX-Zitat

@techreport{heygen-com-heygen-com-hyperframes-animation-2026,
  author = {heygen-com},
  title = {hyperframes-animation security audit report (audit version 5)},
  institution = {Skillstore},
  year = {2026},
  number = {5},
  url = {https://skillstore.io/skills/heygen-com-hyperframes-animation/audits/5},
  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: "hyperframes-animation security audit report (audit version 5)"
version: "unspecified"
type: report
authors:
  - name: "heygen-com"
date-released: "2026-07-19"
url: "https://skillstore.io/skills/heygen-com-hyperframes-animation/audits/5"
identifiers:
  - type: other
    value: "skillstore:heygen-com-hyperframes-animation:audit:5"
    description: "Skillstore immutable audit report identifier"

Skillstore-Score

Warum dieser Score Evidenzvertrauen: Mittel

Architektur

Wartbarkeit

Inhalt

Gemeinschaft

Spezifikationskonformität

Was Sie erstellen können

Produktbewegung komponieren

Kombinieren Sie atomare Regeln und Szenen-Blueprints zu einer deterministischen Produktdemonstration.

Webanimation implementieren

Wählen Sie eine unterstützte Laufzeitumgebung und erstellen Sie suchbare Timelines, die den HyperFrames-Rendering-Einschränkungen entsprechen.

Choreografie prüfen

Erstellen Sie eine Animationskarte, um Tween-Timing, Leerräume, Kollisionen und Elementlebenszyklen zu überprüfen.

Diese Prompts ausprobieren

Eine Animationsregel auswählen

Ich muss [element] animieren, wenn [trigger] eintritt. Empfiehl zwei geeignete HyperFrames-Regeln und erkläre die Bewegungsabfolge.

Einen Szenen-Blueprint erstellen

Erstelle eine [duration]-sekündige HyperFrames-Szene für [message]. Wähle einen Blueprint, teile ihn in Phasen auf und liste die verwendeten Regeln auf.

Eine Laufzeitumgebung anpassen

Implementiere diesen Bewegungsplan mit [GSAP, Lottie, Three.js, Anime.js, CSS, WAAPI, or TypeGPU]. Halte das Ergebnis deterministisch und suchsicher.

Eine vollständige Komposition prüfen

Prüfe die Animationskarte für [composition]. Identifiziere Timing-Lücken, Kollisionen, schwache Staffelungen, Lebenszyklusprobleme und konkrete Choreografieverbesserungen.

Bewährte Praktiken

Komponieren Sie zwei bis vier atomare Regeln, bevor Sie einen größeren Blueprint auswählen.
Verwenden Sie eine pausierte Timeline und vorab berechnete Layoutwerte für deterministisches Suchen.
Fixieren Sie Abhängigkeiten lokal und prüfen Sie die Ergebnisse der Animationskarte nach der Implementierung.

Vermeiden

Erstellen Sie keine Timelines innerhalb asynchroner Callbacks oder von Ereignissen der Echtzeituhr.
Verwenden Sie während des Renderings keine nicht initialisierte Zufälligkeit, unendliche Wiederholungen oder Benutzerereigniszustände.
Mischen Sie nicht mehrere Laufzeitumgebungen, es sei denn, jede hat eine klar abgegrenzte Szenenverantwortung.

Häufig gestellte Fragen

Wofür ist diese Skill konzipiert?

Sie unterstützt deterministisches Motion Design und die Implementierung für HyperFrames-Kompositionen.

Ist GSAP erforderlich?

Nein. GSAP ist der Standard, aber die Skill behandelt auch Lottie, Three.js, Anime.js, CSS, WAAPI und TypeGPU.

Kann sie vollständige Szenenpläne erstellen?

Ja. Sie bietet mehrphasige Blueprints und hilft dabei, diese mit atomaren Regeln und Übergängen zu kombinieren.

Was erzeugt das Skript für Animationskarten?

Sie erstellt eine Animationskarte mit gesampelten Tweens, Elementzuständen, Timing-Dichte, Leerräumen, Staffelungen, Kollisionen und Zusammenfassungen.

Funktioniert die Skill ohne Netzwerkzugriff?

Die meisten Anleitungen sind lokal, aber viele Beispiele verwenden CDN-Bibliotheken. Das Prüfskript kann außerdem ein fehlendes Paket einrichten.

Ersetzt sie die HyperFrames-Kernanleitung?

Nein. Sie hängt vom HyperFrames-Kernkompositionsvertrag ab und ergänzt ihn um animationsspezifische Muster.