AI导哈

其他

wireframe-portal-title

heygen-com/hyperframes

A wireframe portal bursts open, the title comes through, then its letters swap into a second phrase. HyperFrames block, 1920×1080, 8s, 9 variables.

  • 1.1万 次安装
  • 7.5万 星标
  • 收录于

安装命令

npx skills add https://github.com/heygen-com/hyperframes --skill wireframe-portal-title

SKILL.md

Wireframe Portal Title

Extruded wireframe letterforms are built from the bundled Geist face with a TTF loader and polygon offsetting, then revealed through a portal burst whose chaos is a variable. A second beat swaps the letters into a replacement phrase with whole-word wrapping and auto type size, staggered with a tunable easing curve and settle glitch, with optional depth fog.

Composition id: wireframe-portal-title. Duration 8 s at 30 fps, 1920×1080.

Files

  • wireframe-portal-title.html (63 KB)
  • assets/fonts/Geist-Bold.ttf (65 KB)
  • assets/fonts/Geist-Regular.ttf (65 KB)
  • assets/fonts/Geist-SemiBold.ttf (65 KB)
  • assets/fonts/Geist-OFL.txt (4 KB)

Install

Install with npx hyperframes add wireframe-portal-title; by default the files above land under compositions/wireframe-portal-title/. Then mount the block from the host index.html:

相关 Skills

hyperframes-cliheygen-com/hyperframesThe HyperFrames CLI by job - scaffold, check, look at frames, edit the timeline, preview, render locally or in the cloud, publish, project history - plus reading its JSON and recovering from build or render failures.设计与多媒体132.4万hyperframesheygen-com/hyperframesRead first to make, edit, animate or render any video with HyperFrames (HTML rendered to video), including launch films, explainers, music videos, charts, maps, vertical clips, title cards, captions and overlays. Holds the render contract, the work loop and what each kind of video needs.设计与多媒体129.1万media-useheygen-com/hyperframesGet or make any media for a HyperFrames video - music, sound effects, images, icons, logos, voiceover, avatar and generated video, transcripts, cutouts, colour grades and looks - with HeyGen or free local tools, and mix placed audio. Also for footage that looks dark, flat or dull, or should be stylized or hidden.设计与多媒体119.6万hyperframes-registryheygen-com/hyperframesAbout 450 ready-made HyperFrames blocks and components installed as editable source - transitions, overlays, titles, kinetic type, captions, charts, map overlays, 3D, camera moves. Use it before hand-building any named visual (CRT scanlines, glitch, film grain, a chart); also for hyperframes add and catalog.数据与研究108.7万hyperframes-animationheygen-com/hyperframesAll animation knowledge for HyperFrames — atomic motion rules, multi-phase scene blueprints, scene transitions, broader motion-design techniques, AND the seven runtime adapters (GSAP default, plus Lottie, Three.js, Anime.js, CSS keyframes, Web Animations API, TypeGPU). Use for any motion or animation task: pick 2-4 rules and compose, or load a blueprint, or look up runtime-specific API (e.g. GSAP eases / Lottie player / Three.js mixer). Also covers auditing an existing composition's choreography (animation map) and 24 named text-animation effects. HyperFrames-native: single paused timeline, seek-safe, deterministic.设计与多媒体100.5万hyperframes-coreheygen-com/hyperframesThe HyperFrames composition contract — build one renderable project. Use for composition structure, the `data-*` timing attributes, `class="clip"`, tracks, sub-compositions, variables, framework-owned media playback, deterministic-render rules, and validation. Read before writing composition HTML.设计与多媒体93.1万