@vfrey/vfrey 0.0.1 → 1.0.0-beta.1

package/src/scene/blocks/index.json

@@ -0,0 +1,824 @@
+{
+  "source": "vfrey-framey",
+  "commit": "9d893096f7dfe4dc65dde650775ccade7baaef33",
+  "commitDate": "2026-10-26T21:12:00+07:00",
+  "blocks": [
+    {
+      "name": "mk-background",
+      "category": "background",
+      "title": "Minimal Gradient Background",
+      "description": "Procedural soft-blob gradient backdrop in a minimalist presentation style: two radial blobs drifting over a base color, with an animatable rounded-card bar mask and optional frosted-glass mode",
+      "tags": [
+        "background",
+        "gradient",
+        "minimal",
+        "professional",
+        "presentation"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 10,
+      "fit": "cover",
+      "bytes": 7537,
+      "files": [
+        "mk-background.html"
+      ],
+      "source": "registry/blocks/mk-background"
+    },
+    {
+      "name": "oscilloscope-trace",
+      "category": "background",
+      "title": "Oscilloscope Trace",
+      "description": "CRT oscilloscope beam sweeping a waveform across a 10x8 graticule, with closed-form phosphor persistence: the tail decays as exp(-age/tau) and brightens where the beam slows",
+      "tags": [
+        "instrument",
+        "data",
+        "showcase",
+        "retro"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 6,
+      "fit": "scale",
+      "bytes": 20756,
+      "files": [
+        "oscilloscope-trace.html"
+      ],
+      "source": "registry/blocks/oscilloscope-trace"
+    },
+    {
+      "name": "snow",
+      "category": "background",
+      "title": "Snow",
+      "description": "Seek-safe falling-snow overlay: sparse or dense flakes drift down with size, speed and opacity correlated per flake for depth, radial-masked so the frame center stays clear",
+      "tags": [
+        "snow",
+        "snowfall",
+        "winter",
+        "weather",
+        "overlay",
+        "ambient",
+        "particles",
+        "media-treatment-overlay",
+        "loopable"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 6,
+      "fit": "cover",
+      "bytes": 8446,
+      "files": [
+        "snow.html"
+      ],
+      "source": "registry/blocks/snow"
+    },
+    {
+      "name": "starfield",
+      "category": "background",
+      "title": "Starfield",
+      "description": "Seek-safe night-sky overlay: sparse or dense stars in three size tiers that twinkle and drift in two parallax layers, radial-masked to keep the frame center clear",
+      "tags": [
+        "starfield",
+        "night-sky",
+        "stars",
+        "twinkle",
+        "sky",
+        "weather",
+        "overlay",
+        "ambient",
+        "particles",
+        "media-treatment-overlay",
+        "loopable"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 6,
+      "fit": "cover",
+      "bytes": 7478,
+      "files": [
+        "starfield.html"
+      ],
+      "source": "registry/blocks/starfield"
+    },
+    {
+      "name": "yt-lcd-background",
+      "category": "background",
+      "title": "Scanline Board Background",
+      "description": "Textured paper board: scanlines with slow drift, optional pixel grid, static grain, and display text with a blur-focus entrance and chromatic-fringe title",
+      "tags": [
+        "background",
+        "texture",
+        "creator"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 10,
+      "fit": "cover",
+      "bytes": 10408,
+      "files": [
+        "yt-lcd-background.html"
+      ],
+      "source": "registry/blocks/yt-lcd-background"
+    },
+    {
+      "name": "bar-chart-race",
+      "category": "chart",
+      "title": "Bar Chart Race",
+      "description": "Ranked bars grow and overtake each other as a time series advances, with the axis rescaling as values climb and the accent handing over to whoever leads",
+      "tags": [
+        "data",
+        "chart",
+        "statistics",
+        "ranking"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 12,
+      "fit": "scale",
+      "bytes": 21936,
+      "files": [
+        "bar-chart-race.html"
+      ],
+      "source": "registry/blocks/bar-chart-race"
+    },
+    {
+      "name": "data-chart",
+      "category": "chart",
+      "title": "Data Chart",
+      "description": "Animated bar + line chart with staggered reveal, NYT-style typography, and value labels",
+      "tags": [
+        "data",
+        "chart",
+        "statistics"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 15,
+      "fit": "scale",
+      "bytes": 13774,
+      "files": [
+        "data-chart.html"
+      ],
+      "source": "registry/blocks/data-chart"
+    },
+    {
+      "name": "mk-line-graph",
+      "category": "chart",
+      "title": "Minimal Line Graph",
+      "description": "One or two SVG series draw on with dots popping and value labels riding the draw front; dim baseline axis, x-labels, color-dot legend",
+      "tags": [
+        "data-viz",
+        "chart",
+        "graph",
+        "minimal"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 7,
+      "fit": "scale",
+      "bytes": 10466,
+      "files": [
+        "mk-line-graph.html"
+      ],
+      "source": "registry/blocks/mk-line-graph"
+    },
+    {
+      "name": "mk-progress-stat",
+      "category": "chart",
+      "title": "Count-Up Stat Card",
+      "description": "Big-numeral statistic with count-up, label, thin progress track filling to value/max, and caption; light and dark schemes",
+      "tags": [
+        "data-viz",
+        "stat",
+        "minimal"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 7,
+      "fit": "scale",
+      "bytes": 5879,
+      "files": [
+        "mk-progress-stat.html"
+      ],
+      "source": "registry/blocks/mk-progress-stat"
+    },
+    {
+      "name": "mk-specs-list",
+      "category": "chart",
+      "title": "Specs Checklist",
+      "description": "Left-aligned specs/traits checklist over footage or a board: rows slide in staggered with an accent underline sweep; light and dark schemes",
+      "tags": [
+        "data-viz",
+        "list",
+        "minimal",
+        "professional"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 8,
+      "fit": "scale",
+      "bytes": 7241,
+      "files": [
+        "mk-specs-list.html"
+      ],
+      "source": "registry/blocks/mk-specs-list"
+    },
+    {
+      "name": "week-in-merges",
+      "category": "chart",
+      "title": "Week in Merges",
+      "description": "Each author's avatar bounces across their row at a speed set by how many pull requests they merged",
+      "tags": [
+        "data",
+        "chart",
+        "ranking",
+        "leaderboard"
+      ],
+      "width": 1080,
+      "height": 1350,
+      "duration": 16,
+      "fit": "native",
+      "bytes": 16064,
+      "files": [
+        "week-in-merges.html"
+      ],
+      "source": "registry/blocks/week-in-merges"
+    },
+    {
+      "name": "macos-notification",
+      "category": "chat",
+      "title": "macOS Notification",
+      "description": "Animated macOS-style notification banner with app icon and message",
+      "tags": [
+        "social",
+        "overlay",
+        "notification"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 5,
+      "fit": "scale",
+      "bytes": 5268,
+      "files": [
+        "macos-notification.html"
+      ],
+      "source": "registry/blocks/macos-notification"
+    },
+    {
+      "name": "spotify-card",
+      "category": "chat",
+      "title": "Spotify Now Playing",
+      "description": "Animated Spotify now-playing card with album art and progress bar",
+      "tags": [
+        "social",
+        "overlay",
+        "spotify"
+      ],
+      "width": 1080,
+      "height": 1920,
+      "duration": 5,
+      "fit": "scale",
+      "bytes": 8701,
+      "files": [
+        "spotify-card.html"
+      ],
+      "source": "registry/blocks/spotify-card"
+    },
+    {
+      "name": "thread-message-stack",
+      "category": "chat",
+      "title": "Thread Message Stack",
+      "description": "A source-owned editable conversation stack with arbitrary incoming and outgoing messages",
+      "tags": [
+        "social",
+        "conversation",
+        "messages"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 8,
+      "fit": "scale",
+      "bytes": 8411,
+      "files": [
+        "thread-message-stack.html"
+      ],
+      "source": "registry/blocks/thread-message-stack"
+    },
+    {
+      "name": "x-post",
+      "category": "chat",
+      "title": "X Post Card",
+      "description": "Animated X/Twitter post card overlay with engagement metrics",
+      "tags": [
+        "social",
+        "overlay",
+        "twitter"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 5,
+      "fit": "scale",
+      "bytes": 13223,
+      "files": [
+        "x-post.html"
+      ],
+      "source": "registry/blocks/x-post"
+    },
+    {
+      "name": "yt-comment-card",
+      "category": "chat",
+      "title": "Comment Cards",
+      "description": "Social comments typing on over footage: avatar pop, username and time, per-character typewriter, likes row; image avatars or initials chips",
+      "tags": [
+        "social",
+        "comments",
+        "creator",
+        "overlay"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 8,
+      "fit": "scale",
+      "bytes": 10351,
+      "files": [
+        "yt-comment-card.html"
+      ],
+      "source": "registry/blocks/yt-comment-card"
+    },
+    {
+      "name": "code-diff",
+      "category": "code",
+      "title": "Code Diff",
+      "description": "An edit shown as a colored diff — removed lines collapse in red, added lines expand in green.",
+      "tags": [
+        "code",
+        "code-animation",
+        "diff",
+        "developer"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 6,
+      "fit": "scale",
+      "bytes": 27157,
+      "files": [
+        "code-diff.html"
+      ],
+      "source": "registry/blocks/code-diff"
+    },
+    {
+      "name": "code-snippet-apple-terminal-pro",
+      "category": "code",
+      "title": "Code Snippet - Apple Terminal Pro",
+      "description": "Apple Terminal Pro profile: black background with grey text and lime green cursor, per-character typing animation of a shell session.",
+      "tags": [
+        "code",
+        "developer",
+        "showcase",
+        "terminal",
+        "apple",
+        "apple-terminal"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 12,
+      "fit": "scale",
+      "bytes": 6953,
+      "files": [
+        "code-snippet-apple-terminal-pro.html"
+      ],
+      "source": "registry/blocks/code-snippet-apple-terminal-pro"
+    },
+    {
+      "name": "code-typing",
+      "category": "code",
+      "title": "Code Typing",
+      "description": "Token-streamed typing reveal with a caret that tracks the frontier — deterministic, no CSS animation.",
+      "tags": [
+        "code",
+        "code-animation",
+        "typing",
+        "developer"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 5,
+      "fit": "scale",
+      "bytes": 25701,
+      "files": [
+        "code-typing.html"
+      ],
+      "source": "registry/blocks/code-typing"
+    },
+    {
+      "name": "flowchart-vertical",
+      "category": "diagram",
+      "title": "Flowchart Vertical",
+      "description": "Portrait animated decision tree with SVG connectors, sticky-note nodes, cursor interaction, and typing correction",
+      "tags": [
+        "diagram",
+        "flowchart",
+        "interactive",
+        "portrait"
+      ],
+      "width": 1440,
+      "height": 2560,
+      "duration": 12,
+      "fit": "scale",
+      "bytes": 13569,
+      "files": [
+        "flowchart-vertical.html"
+      ],
+      "source": "registry/blocks/flowchart-vertical"
+    },
+    {
+      "name": "lt-accent-underline",
+      "category": "lower-third",
+      "title": "Lower Third — Accent Underline",
+      "description": "Cardless lower third for footage overlay: name rises, an accent rule draws left-to-right, role fades in; text-shadowed for legibility",
+      "tags": [
+        "lower-third",
+        "overlay",
+        "podcast",
+        "interview",
+        "minimal"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 4.8,
+      "fit": "crop",
+      "bytes": 3429,
+      "files": [
+        "lt-accent-underline.html"
+      ],
+      "source": "registry/blocks/lt-accent-underline"
+    },
+    {
+      "name": "lt-bold-block",
+      "category": "lower-third",
+      "title": "Lower Third — Bold Block",
+      "description": "High-energy podcast lower third: solid dark block wipes in, uppercase name slams up, accent tag pops",
+      "tags": [
+        "lower-third",
+        "overlay",
+        "podcast",
+        "interview",
+        "bold"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 4.8,
+      "fit": "crop",
+      "bytes": 3351,
+      "files": [
+        "lt-bold-block.html"
+      ],
+      "source": "registry/blocks/lt-bold-block"
+    },
+    {
+      "name": "lt-clean-bar",
+      "category": "lower-third",
+      "title": "Lower Third — Clean Bar",
+      "description": "Minimal white-card lower third for podcasts/interviews: accent tab, name + role, clip-wipe entrance",
+      "tags": [
+        "lower-third",
+        "overlay",
+        "podcast",
+        "interview"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 4.8,
+      "fit": "crop",
+      "bytes": 3504,
+      "files": [
+        "lt-clean-bar.html"
+      ],
+      "source": "registry/blocks/lt-clean-bar"
+    },
+    {
+      "name": "lt-dark-card",
+      "category": "lower-third",
+      "title": "Lower Third — Dark Card",
+      "description": "Charcoal card lower third for bright footage: name, drawn accent underline, role; slide-up entrance",
+      "tags": [
+        "lower-third",
+        "overlay",
+        "podcast",
+        "interview",
+        "dark"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 4.8,
+      "fit": "crop",
+      "bytes": 3457,
+      "files": [
+        "lt-dark-card.html"
+      ],
+      "source": "registry/blocks/lt-dark-card"
+    },
+    {
+      "name": "lt-kicker-name",
+      "category": "lower-third",
+      "title": "Lower Third — Kicker Name",
+      "description": "Cardless lower third with an accent eyebrow/kicker tag, heavy name, and a drawn baseline; for footage",
+      "tags": [
+        "lower-third",
+        "overlay",
+        "podcast",
+        "interview",
+        "bold"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 4.8,
+      "fit": "crop",
+      "bytes": 3556,
+      "files": [
+        "lt-kicker-name.html"
+      ],
+      "source": "registry/blocks/lt-kicker-name"
+    },
+    {
+      "name": "lt-mask-reveal",
+      "category": "lower-third",
+      "title": "Lower Third — Mask Reveal",
+      "description": "Cardless lower third: an accent sweep crosses and clip-path-reveals a heavy name, role fades up; for footage",
+      "tags": [
+        "lower-third",
+        "overlay",
+        "podcast",
+        "interview",
+        "bold"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 4.8,
+      "fit": "crop",
+      "bytes": 4113,
+      "files": [
+        "lt-mask-reveal.html"
+      ],
+      "source": "registry/blocks/lt-mask-reveal"
+    },
+    {
+      "name": "lt-neon-border",
+      "category": "lower-third",
+      "title": "Neon Border",
+      "description": "Two arcs of light travel the edge of a rounded panel and snap corner to corner, trailing a soft three-layer bloom. A lower third for a name and role.",
+      "tags": [
+        "lower-third",
+        "glow",
+        "loop",
+        "video-primitive"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 4.8,
+      "fit": "crop",
+      "bytes": 15139,
+      "files": [
+        "lt-neon-border.html"
+      ],
+      "source": "registry/blocks/lt-neon-border"
+    },
+    {
+      "name": "lt-stack-bars",
+      "category": "lower-third",
+      "title": "Lower Third — Stack Bars",
+      "description": "Two stacked bars: a dark name bar wipes from the left, an accent role bar wipes from the right",
+      "tags": [
+        "lower-third",
+        "overlay",
+        "podcast",
+        "interview",
+        "bold"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 4.8,
+      "fit": "crop",
+      "bytes": 3373,
+      "files": [
+        "lt-stack-bars.html"
+      ],
+      "source": "registry/blocks/lt-stack-bars"
+    },
+    {
+      "name": "camcorder-hud",
+      "category": "overlay",
+      "title": "Camcorder HUD",
+      "description": "Responsive REC, battery, editable date placeholder, and timeline-driven counter overlay for creator-camera and camcorder treatments",
+      "tags": [
+        "camcorder",
+        "camera",
+        "recording",
+        "hud",
+        "overlay",
+        "creator",
+        "media-treatment-overlay"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 4,
+      "fit": "scale",
+      "bytes": 4982,
+      "files": [
+        "camcorder-hud.html"
+      ],
+      "source": "registry/blocks/camcorder-hud"
+    },
+    {
+      "name": "mk-callout-highlight",
+      "category": "overlay",
+      "title": "Word-Sweep Highlight",
+      "description": "A sentence whose word-by-word emphasis is driven by a single scalar — tween it to sync the highlight with a voiceover",
+      "tags": [
+        "typography",
+        "karaoke",
+        "captions",
+        "minimal"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 8,
+      "fit": "scale",
+      "bytes": 7060,
+      "files": [
+        "mk-callout-highlight.html"
+      ],
+      "source": "registry/blocks/mk-callout-highlight"
+    },
+    {
+      "name": "news-ticker",
+      "category": "overlay",
+      "title": "News Ticker",
+      "description": "Premium broadcast-style lower-third ticker with live label, headline ribbon, and scrolling news crawl.",
+      "tags": [
+        "lower-third",
+        "overlay",
+        "news",
+        "ticker"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 7,
+      "fit": "scale",
+      "bytes": 11628,
+      "files": [
+        "news-ticker.html"
+      ],
+      "source": "registry/blocks/news-ticker"
+    },
+    {
+      "name": "organic-light-leak-overlay",
+      "category": "overlay",
+      "title": "Organic Light Leak Overlay",
+      "description": "Finite CSS light-leak overlay for memory beats and motivated transitions",
+      "tags": [
+        "light-leak",
+        "film",
+        "memory",
+        "transition",
+        "overlay",
+        "media-treatment-overlay"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 4,
+      "fit": "cover",
+      "bytes": 3879,
+      "files": [
+        "organic-light-leak-overlay.html"
+      ],
+      "source": "registry/blocks/organic-light-leak-overlay"
+    },
+    {
+      "name": "split-flap-board",
+      "category": "overlay",
+      "title": "Split-Flap Board",
+      "description": "Solari-style departure board: every cell walks its drum forward through the intervening characters of a fixed alphabet until it lands on its target, so the text resolves as a mechanical cascade instead of a fade.",
+      "tags": [
+        "text",
+        "kinetic",
+        "mechanical",
+        "split-flap",
+        "solari",
+        "departure-board",
+        "reveal"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 3.5,
+      "fit": "scale",
+      "bytes": 13451,
+      "files": [
+        "split-flap-board.html"
+      ],
+      "source": "registry/blocks/split-flap-board"
+    },
+    {
+      "name": "yt-prism-title",
+      "category": "title",
+      "title": "Chromatic Fringe Title",
+      "description": "Display title on a transparent root: blur-focus entrance, red/blue fringe that settles then breathes, perspective bow, slow scale drift",
+      "tags": [
+        "typography",
+        "title-card",
+        "creator"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 6,
+      "fit": "scale",
+      "bytes": 6743,
+      "files": [
+        "yt-prism-title.html"
+      ],
+      "source": "registry/blocks/yt-prism-title"
+    },
+    {
+      "name": "beat-freeze-cut",
+      "category": "transition",
+      "title": "Beat Freeze Cut",
+      "description": "A beat-driven speed ramp, freeze-frame hit, and hard-cut sequence for music-led promos and montages.",
+      "tags": [
+        "transition",
+        "music",
+        "beat-driven",
+        "freeze-frame"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 6,
+      "fit": "scale",
+      "bytes": 27449,
+      "files": [
+        "beat-freeze-cut.html"
+      ],
+      "source": "registry/blocks/beat-freeze-cut"
+    },
+    {
+      "name": "camera-dolly-zoom",
+      "category": "transition",
+      "title": "Dolly Zoom (Vertigo Shot)",
+      "description": "Camera tracks toward or away from the subject while the field of view changes the opposite way, so the subject holds its frame size while the background collapses behind it or rushes in. Focal length is solved from dolly distance every frame against d * tan(FOV/2) = const, not keyframed beside it. Requires depth: the subject sits on the z = 0 plane and the content behind it must be layered or genuinely 3D (translateZ at two or more distinct depths) -- a flat element gains nothing from this move.",
+      "tags": [
+        "camera",
+        "depth",
+        "3d",
+        "cinematic"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 4,
+      "fit": "scale",
+      "bytes": 12107,
+      "files": [
+        "camera-dolly-zoom.html"
+      ],
+      "source": "registry/blocks/camera-dolly-zoom"
+    },
+    {
+      "name": "hw-scribble-transition",
+      "category": "transition",
+      "title": "Scribble Transition",
+      "description": "Overlay transition: scribble bands accumulate to cover the frame with a solid backstop, the host cuts beneath, and the scribble clears",
+      "tags": [
+        "handwritten",
+        "transition",
+        "wipe"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 2.2,
+      "fit": "scale",
+      "bytes": 5378,
+      "files": [
+        "hw-scribble-transition.html"
+      ],
+      "source": "registry/blocks/hw-scribble-transition"
+    },
+    {
+      "name": "mk-clone-wall-transition",
+      "category": "transition",
+      "title": "Text Clone Wall Transition",
+      "description": "Overlay transition: a tiled word wall covers the frame, inverts via difference blending, and clears — hard-cut the content beneath while covered",
+      "tags": [
+        "transition",
+        "typography",
+        "wipe"
+      ],
+      "width": 1920,
+      "height": 1080,
+      "duration": 2.4,
+      "fit": "scale",
+      "bytes": 8305,
+      "files": [
+        "mk-clone-wall-transition.html"
+      ],
+      "source": "registry/blocks/mk-clone-wall-transition"
+    }
+  ]
+}