Files
open-design/plugins/_official/examples/hyperframes/open-design.json
T
pftom c12c816a44 feat(design-systems): add new design systems for Agentic, Airtable, Ant, Apple, Application, Arc, and Artistic
- Introduced comprehensive design documentation and JSON configurations for multiple design systems, including Agentic, Airtable, Ant, Apple, Application, Arc, and Artistic.
- Each design system includes detailed guidelines on visual themes, color palettes, typography, spacing, layout, components, and interaction principles.
- Enhanced the overall design framework to support diverse user interfaces and improve consistency across applications.

This update significantly enriches the design resources available for developers, enabling them to create visually cohesive and user-friendly applications.
2026-05-12 15:18:16 +08:00

87 lines
2.7 KiB
JSON

{
"$schema": "https://open-design.ai/schemas/plugin.v1.json",
"name": "example-hyperframes",
"title": "Hyperframes",
"version": "0.1.0",
"description": "Create video compositions, animations, title cards, overlays, captions, voiceovers, audio-reactive visuals, and scene transitions in HyperFrames HTML. Use when asked to build any HTML-based video content, add captions or subtitles synced to audio, generate text-to-speech narration, create audio-reactive animation (beat sync, glow, pulse driven by music), add animated text highlighting (marker sweeps, hand-drawn circles, burst lines, scribble, sketchout), or add transitions between scenes (crossfades, wipes, reveals, shader transitions). Covers composition authoring, timing, media, and the full video production workflow. For CLI commands (init, lint, preview, render, transcribe, tts) see the hyperframes-cli skill.",
"license": "MIT",
"author": {
"name": "Open Design",
"url": "https://github.com/nexu-io"
},
"homepage": "https://github.com/nexu-io/open-design/tree/main/plugins/_official/examples/hyperframes",
"tags": [
"example",
"first-party",
"video",
"hyperframes",
"html-video",
"video-composition",
"interactive-video",
"captions",
"tts-video",
"kinetic-typography",
"html-in-canvas",
"drawelementimage",
"html-shader",
"vfx-iphone-device",
"vfx-liquid-glass",
"vfx-portal"
],
"compat": {
"agentSkills": [
{
"path": "./SKILL.md"
}
]
},
"od": {
"kind": "scenario",
"taskKind": "new-generation",
"mode": "video",
"scenario": "video",
"surface": "video",
"preview": {
"type": "html",
"entry": "./example.html"
},
"useCase": {
"query": "A 5-second product reveal: a minimal high-end product on a clean cream\nsurface, soft side light, slow camera push-in, restrained motion, no\ntext overlays."
},
"context": {
"skills": [
{
"path": "./SKILL.md"
}
],
"assets": [
"./references/audio-reactive.md",
"./references/captions.md",
"./references/css-patterns.md",
"./references/dynamic-techniques.md",
"./references/html-in-canvas.md",
"./references/motion-principles.md",
"./references/transcript-guide.md",
"./references/transitions.md",
"./references/tts.md",
"./references/typography.md"
]
},
"pipeline": {
"stages": [
{
"id": "generate",
"atoms": [
"file-write",
"live-artifact"
]
}
]
},
"capabilities": [
"prompt:inject",
"fs:write"
]
}
}