x-posting-license
Turn any X (Twitter) profile into a 10.3s animated "POSTING LICENSE" card video — a fake driver's license in X's branding: the card slides in over an animated dot-matrix ground, license text types on letter-by-letter, follower / following / post counters tick up, a diagonal glimmer sweeps as the card tilts in 3D, it flips to a fine-print back with a signature write-on, then crouches and leaps out of frame. Trigger on: "X driver's license", "posting license", "make an X license for @handle", "license card video". The whole composition is a finished template — the agent only supplies profile data and renders.
1How It Works & Mechanism
Follows a "template as finished product" approach: a fixed 1920×1080 @60fps, 10.35-second composition with locked motion (seamlessly overlapping keyframes, zero dead frames). The agent only fills in data tokens and renders—the timeline **must not be modified**, and data is the only variable.
One fixed 1920×1080 @ 60fps, 10.35s composition. The motion is locked and doctrine-verified (overlapped keyframes end to end, zero dead frames): do NOT edit the timeline — fill the data tokens and render.
A three-step workflow with zero composition work after step two: ① Collect data (name/handle/joined/followers/following/posts/one-line bio/400×400 avatar); ② Run node build.mjs to generate the project from the template; ③ Run npx hyperframes render to output an MP4 (prompt the user first if the host environment gates rendering).
1. **Gather profile data** — name, handle, joined month/year, followers, following, posts, one bio line, and the 400×400 avatar.
Rendering prerequisites are straightforward: Node 18+ and HyperFrames CLI fetched via npx (@latest can drift, so pin the version for byte-identical re-renders); macOS hardware GPU rendering is recommended for the WebGL dot-matrix ground; the signature uses macOS system font Snell Roundhand (src: local(...)), falling back to generic cursive on Linux—still functional, just less visually appealing.
macOS GPU render for the WebGL dot ground: `export PRODUCER_BROWSER_GPU_MODE=hardware`.
Data injection is treated as "untrusted input": build.mjs enforces required fields, handles must match ^[A-Za-z0-9_]{1,15}$, joined must match the format "JAN 2026" and derive ISS MM/YYYY, counter metrics strictly accept non-negative integers (explicitly rejecting signs, decimals, scientific notation, NaN, and commas as they land in composition <script>), text fields are stripped of control characters and length-limited, all strings are HTML-escaped before replacing {{TOKEN}}, and a final check verifies no lingering tokens remain.
// counters land inside the composition's <script>: accept ONLY plain … // non-negative integers (no signs, fractions, exponents, NaN, commas)
Disk writing is strictly bounded: After --out creates assets/ and renders/, its realpath is resolved; subsequent paths must resolve within the real out path (safePath), explicitly rejecting symlink targets from the start; templates resolve relative to the script itself, while --out resolves relative to the working directory; missing avatar files trigger immediate errors.
// after mkdir, every path we touch must resolve inside the real out dir
Fixed internal template structure: Data tokens reside in text nodes (NAME_BIG / NAME_SIG / HANDLE_UPPER / JOINED / ISS / FOLLOWERS_FMT / BIO_UPPER), counters tick up numerically in script context; #root hardcodes data-composition-id="x-license", data-duration="10.35", and data-fps="60", with the timeline registered under window.__timelines["x-license"]; the back fine print humorously uses follower count as a "date of birth", and long names are handled by widening the signature mask.
<div id="root" data-composition-id="x-license" data-start="0" data-duration="10.35" data-width="1920" data-height="1080" data-fps="60">
Two strict rules and one provenance statement: Data must be authentic (scraped from live profiles, never fabricated for counts or bio), bio is uppercase, ≤ ~65 chars, and delimited by ·, unusual display names are preserved as-is (e.g., `|||`); brand-wise, replicating X's identity and visual style falls under parody/fan content with publishing decisions left to the user; the dot-matrix ground is a deterministic GLSL/WebGL rewrite inspired by Originkit Dot Matrix (without redistributing original source), simplex noise uses the standard Ashima implementation (MIT), and GSAP is loaded from jsDelivr without vendoring.
- Data must be REAL, scraped from the live profile — never invent counts or bios.
2Core Capabilities
3External Dependencies
| Kind | Dependency / Endpoint |
|---|---|
| network | x.com/<handle>:登出档案页(agent 用浏览器工具读显示名/Joined/Following/Followers;纯 HTTP fetch 只得 JS 壳) |
| network | pbs.twimg.com:头像图片下载(profile_images 的 _400x400 变体) |
| api | api.fxtwitter.com/<handle>:取 post 数(免费、无凭证的第三方 API) |
| cli | HyperFrames CLI(经 npx,文档写 @latest;要 byte-identical 重渲需自行 pin 版本) |
| network | cdn.jsdelivr.net:构图在 preview/render 时加载 GSAP 3.14.2(文档明说渲染并非完全离线) |
| cli | curl(取数示例:下载头像、拉 fxtwitter JSON)与 macOS 系统字体 Snell Roundhand(src: local(...),Linux 退化为 cursive) |
4Recommended Governance & Evidence
- scripts/: Local script or command execution: node <SKILL_DIR>/scripts/build.mjs --out <dir> --name … --handle … --joined
- 网络端点: Declared external network access: https://x.com/<handle> (logged-out profile page for agent-side data scraping)
- 本地工作目录: File I/O and artifact output: Inside --out directory: index.html, assets/avatar.jpg, hyperframes.json, meta.json, and render output
5Second-Pass Verification
- [ok] 『do NOT edit the timeline』是否与模板事实一致 — #root 上写死 data-duration="10.35"、data-fps="60"、data-composition-id="x-license",时间线注册在 window.__timelines["x-license"];build.mjs 只做 token 替换,不触碰任何时间属性。模板确实锁死,agent 的改动面只有数据。
- [ok] 模板 token 与 build.mjs 的 fill 键是否一一对应 — fill 提供 NAME_BIG、NAME_SIG、HANDLE_UPPER、JOINED、ISS、FOLLOWERS、FOLLOWING、POSTS、FOLLOWERS_FMT、BIO_UPPER;模板中出现的 {{…}} 均在其中(FOLLOWERS_FMT 用于背面 fine print),且替换后有 unfilled token 检查兜底。
- [ok] 『profile 数据是不可信输入』的处理是否真存在 — cleanText(去控制字符 + 限长)、cleanCount(只收纯非负整数,显式拒绝符号/小数/指数/NaN/逗号)、handle 正则 ^[A-Za-z0-9_]{1,15}$、joined 走 MONTHS 枚举、esc() 逐字符转义、refuseSymlink() + safePath() 限定写入在 out 实路径内——逐条在源码可验。
- [ok] 端点是否都可预期、是否真的无凭证 — SKILL.md 的 Network and side effects 列表与 references/profile-data.md、模板引用一一对应;无 API key、无 cookie 读取、无 telemetry;fxtwitter 免认证且文档给了降级路径(不可用时问用户)。
- [ok] 『Rendering is NOT fully offline』是否属实 — 模板 <head> 第 6 行就有 jsDelivr 的 gsap@3.14.2 引用,preview/render 时构图会去取——与文档声明一致,不是夸大也不隐瞒。
- [unlocatable] 10.35s 与 flip ~6.5s / leap ~9.9s 的时刻声明 — 这些时刻来自文档叙述与模板属性,本次只读侦查未渲染核对;且文档用的是 @latest 的 CLI(版本未固定),故这些时刻只对该 pin commit 的模板有效,不作为已核事实。
6Verdict & Scenarios
6e227bb6839e972c…