Skills website-to-hyperframes

📦

website-to-hyperframes

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

Content revision r1 High Risk 🔑 Env variables⚙️ External commands📁 Filesystem access🌐 Network access

Create HyperFrames Videos from Websites

Teams need fast ways to convert an existing website into a polished video concept. This skill guides Claude, Codex, or Claude Code through capture, design analysis, scripting, storyboarding, composition, validation, and delivery.

Supports: Claude Codex Code(CC)

⚠️ 38 Poor

Stop for confirmation before installing.

Review the plan and obtain explicit user consent before changing files.

Install with my Agent

Copy this request to your Agent. It includes the canonical Skill page and manifest.

Agent request

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.

Your Agent should still show its plan and request any confirmation required by the security policy.

Agent-readable resources

Use these links when an AI agent, crawler, or script needs clean context instead of reading the full page.

Markdown detail GET /skills/heygen-com-website-to-hyperframes.md Signed manifest GET /api/skills/heygen-com-website-to-hyperframes/manifest Signed lockfile GET /api/skills/heygen-com-website-to-hyperframes/lockfile

Test it

Using "website-to-hyperframes". Capture a SaaS landing page and make a 25-second launch video.

Expected outcome:

A site summary with colors, fonts, sections, key assets, and visual vibe.
Generated design, script, and storyboard documents for the video.
A validated HyperFrames Studio preview URL for review.

Using "website-to-hyperframes". Create a short social ad from a marketing homepage.

Expected outcome:

A concise ad script with beat timing.
Compositions using captured screenshots, logos, and typography.
Snapshot checks showing each major scene before final handoff.

Security Audit

High Risk

v6 • 7/9/2026 Open versioned report

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.

Files scanned

1,500

Lines analyzed

Review items

False positives ignored

Confirmed security concerns (5)

High

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.

High

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.

High

references/step-1-capture.md:29

Screen capture upload

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

High

references/step-6-build.md:174

Screen capture upload

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

High

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

Capability review items (15)

These are real local capabilities that may be expected for this skill, so they require review but are not counted as confirmed malicious behavior.

High

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.

High

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.

High

references/step-6-build.md:25

Path traversal sequence

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

High

references/step-6-build.md:26

Path traversal sequence

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

High

references/step-6-build.md:29

Path traversal sequence

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

High

references/step-6-build.md:36

Path traversal sequence

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

High

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 `..

High

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

High

references/techniques.md:161

Path traversal sequence

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

High

references/techniques.md:182

Path traversal sequence

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

High

references/techniques.md:196

Path traversal sequence

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

High

references/techniques.md:255

Path traversal sequence

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

High

references/techniques.md:258

Path traversal sequence

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

Medium

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.

Low

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.

Risk Factors

🔑 Env variables (1)

references/step-1-capture.md:19

⚙️ External commands (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

📁 Filesystem access (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

🌐 Network access (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

Detected Patterns

Screen capture upload×4

Audited by: claude View Audit History →

Share & cite this report

Share the versioned assessment report, neutral badge, embed card, and citations. Skillstore reports evidence without deciding whether this Skill is safe.

Open versioned report

Copy report link

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>

Embed card

<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>

Academic citations (APA · BibTeX · CFF)

APA citation

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 citation

@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

Why this score Evidence Confidence: High

Architecture

Maintainability

Content

Community

Spec Compliance

What You Can Build

Product launch video

Turn a product website into a short launch video with captured brand assets, narration, and animated scenes.

Website-based social ad

Create a concise vertical or square ad from a landing page for social media testing.

Product tour draft

Use screenshots, visible text, and assets from a website to draft a guided product tour in HyperFrames.

Try These Prompts

Create a simple website video

Capture this public website and create a 20-second HyperFrames product video: [URL]. Use the site colors, fonts, and main hero assets.

Make a social ad from a landing page

Turn [URL] into a 15-second vertical social ad. Emphasize the main value proposition, use fast but readable motion, and stop at the preview URL.

Build a narrated product tour

Create a 45-second narrated product tour from [URL]. Write the script, generate beat timing, build the HyperFrames compositions, validate them, and show me the Studio preview.

Create a polished launch reel

Capture [URL] and produce a cinematic launch reel for technical buyers. Use the captured assets, include kinetic typography, validate every beat with snapshots, and render only after I approve the preview.

Best Practices

Use only public or authorized websites, and review captured artifacts before sharing output.
Approve the local Studio preview before requesting an MP4 render.
Keep each video project in its own directory so capture assets and generated files stay isolated.

Avoid

Do not capture private dashboards, authenticated pages, or customer data without explicit authorization.
Do not paste raw SVG, image, or font file contents into prompts when file paths are enough.
Do not render final MP4 files before reviewing snapshots and the Studio preview.

Frequently Asked Questions

Does this skill need API keys?

No API keys are required for basic capture. Optional Gemini or Google keys can improve image descriptions, but they must be handled securely.

Can it work with any website?

It is intended for public or authorized websites. Sites behind login, paywalls, or legal restrictions need explicit permission and careful handling.

Does it automatically create an MP4?

No. The workflow delivers a local HyperFrames Studio preview first and renders MP4 only after the user explicitly asks.

What files does it create?

It creates capture artifacts, design notes, scripts, storyboards, compositions, snapshots, and optional render files inside a project directory.

Can Claude Code use this skill?

Yes. The skill is compatible with Claude, Codex, and Claude Code when the HyperFrames tooling is available.

What should users review before publishing?

Users should review captured screenshots, extracted text, referenced assets, preview scenes, and any generated narration for accuracy and rights clearance.