mirror of
https://github.com/nexu-io/open-design.git
synced 2026-10-27 09:51:12 +01:00
* feat(plugins): refresh HyperFrames video templates from html-video
Replace the 11 HeyGen catalog stub entries (no bundled source, duplicate
catalog-block cover images) with 23 fully bundled HyperFrames templates
imported from nexu-io/html-video, so both the in-app Plugins home and the
marketing site's /plugins/templates/hyperframes/ show real, renderable,
visually distinct templates with hover-autoplay motion previews.
Added (plugins/_official/video-templates/<slug>/):
- open-design.json — od.surface "hyperframes" (HyperFrames artifact type),
en + zh-CN title/description, inputs, and jsDelivr-hosted preview assets.
- template.json — client card metadata.
- SKILL.md — how to repaint and render the composition.
- source/ — the HTML+CSS+GSAP (or Remotion) composition, verbatim.
- preview.mp4 — a looping motion preview rendered with the html-video
HyperFrames renderer, trimmed to the full animation length (cards
hover-autoplay from frame 0, detail page plays it); each under the 1 MiB
blob limit. 21 of 23 ship a video; frame-logo-outro (a held logo) and
frame-data-rollup (Remotion, blank native render) ship a still poster.
- preview.png — poster frame extracted from that render.
Landing-page tweaks:
- Hide the two cover-less examples/{hyperframes,video-hyperframes} onboarding
scenarios from the public template library (feature demos, not templates).
- Point the "use this" CTAs (template card + plugin detail) at the desktop
download page instead of the detail page / GitHub releases.
- Hover-autoplay restarts each preview from frame 0 so the full animation
plays on every hover instead of resuming mid-loop.
- SEO: keyword-led <title> ("HyperFrames templates & skills …") and a
rewritten, keyword-rich category description (all 18 locales) to target
"hyperframes template" / "hyperframes skill" search intent.
Removed the 11 source-less hyperframes-* HeyGen catalog stubs. Licensing is
mirrored faithfully per upstream and summarised in HYPERFRAMES-ATTRIBUTIONS.md:
8 Apache-2.0 forks of heygen-com/hyperframes, 1 MIT from
nateherkai/hyperframes-student-kit, 7 original Apache-2.0, and 7 derived from
MIT design skills (frontend-slides, huashu-design) with studio inspiration
recorded as non-affiliated L1 origin.
Registry seed nets +12 entries (402 -> 414); bundledPreinstallCount updated.
* fix(plugins): self-contain hyperframes templates + narrow aspect options
Address review on the HyperFrames import:
- Narrow each fixed-layout (1920×1080) hyperframes manifest's
od.inputs.aspect.options to the single aspect its template.json actually
ships (e.g. frame-vignelli is 9:16, the rest 16:9), so the picker/agent
can't request portrait/square renders the composition can't produce.
frame-data-rollup (responsive Remotion, layout computed off canvas size)
keeps 16:9/9:16/1:1.
- frame-kinetic-type: drop the external 9 MB S3 A-roll video from
source/compositions/main-graphics.html. The timeline sets that layer to
opacity:0 at t=0 and never reveals it, so it was never visible; replacing
it with an empty self-contained layer keeps the render identical (verified)
and removes the only third-party runtime media dependency. Re-rendered its
preview from the vendored source.
* fix(plugins): vendor all runtime assets so hyperframes templates are self-contained
Make every bundled HyperFrames template render with no third-party network
dependency, per review and per each template's own SKILL.md "keep the
composition self-contained under source/" contract:
- GSAP: vendor gsap@3.14.2 into each template's source/ and rewrite the
jsDelivr <script src> to a relative path (9 templates).
- Google Fonts: fetch each family's woff2, ship them under source/fonts/,
inline a local @font-face fonts.css, and drop the googleapis <link>/@import
(20 templates). CJK families (Noto Sans/Serif SC) are intentionally not
vendored — they exceed the 1 MiB blob limit; their placeholder sample text
falls back to the OS CJK font, keeping the source dependency-free.
- Tailwind: replace the cdn.tailwindcss.com JIT script with a static
tailwind.css built from the classes each template actually uses (6).
- Textures/media: vendor the remaining external texture (warm-grain) and copy
the previously-missing local assets/ (screenshots, audio, swiss-grid.svg)
into frame-product-promo, frame-product-promo-30s, frame-swiss-grid.
- od.context.assets now stages ./template.json + ./source so the renderer
materializes the full bundle.
All vendored files are under the 1 MiB blob limit. Re-rendered the six
templates whose output could shift (Tailwind static build + CJK fallback);
verified renders are visually intact. Final audit: zero external CDN/http
asset references across all 23 template sources.
* fix(plugins): inline vendored GSAP + enrich plugin detail SEO
- Inline the vendored GSAP runtime directly into each template's index.html
instead of shipping gsap.min.js, so no new committed `.js` files trip the
repository-layout guard (`scripts/guard.ts` residual-JS policy). Compositions
use the global `gsap` the inlined runtime defines. Templates stay fully
self-contained; re-rendered frame-kinetic-type / frame-swiss-grid to confirm
motion is intact.
- Plugin detail pages now lead their <title> and meta description with the
artifact type + brand keywords — "<HyperFrames video template> · Open Design"
and "... for Open Design — the open-source Claude Design alternative" — so
each detail page ranks for "hyperframes template", "Open Design", and
"open source Claude Design alternative".
* fix(plugins): replace placeholder screenshots in frame-product-promo-30s
The product-surfaces scene referenced source/assets/screenshot-{1,2,3}.png,
which were 67-byte 1×1 placeholder PNGs carried over from the upstream
template, so a render of that scene showed blank laptop screens. Replace them
with three self-contained 1440×900 dashboard mockups (distinct Plan/Build/
Monitor accents) so the bundled source renders usable product surfaces, and
re-render the preview. All three are well under the 1 MiB blob limit.
* fix(plugins): give frame-logo-outro a motion preview like the rest
frame-logo-outro shipped as an image-only preview, so it was the one new
HyperFrames template without hover-autoplay / detail playback. Re-render it
from its (now self-contained) source as a short looping logo-reveal MP4 and
switch its manifest to previewType "video", matching the other 22. 72 KB,
under the 1 MiB blob limit. (frame-data-rollup remains a still poster — its
Remotion native render comes out blank; tracked as a follow-up.)
* fix(landing): keep plugin detail lead localized, SEO suffix meta-only
The keyword-rich English SEO suffix was appended to `description`, which is
both the <meta description> and the visible <p class="lead">, so non-English
plugin detail pages rendered mixed-language body copy. Split it: `description`
stays the fully-localized lead, and a separate `seoDescription` carries the
English brand/keyword suffix for <Layout description> + JSON-LD only.
---------
Co-authored-by: Joey <276262049+xne998808-ai@users.noreply.github.com>