القائمة
Electric split with hand-drawn script — offset panels slide in, display title rises with an outlined word, script strokes itself in.
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
استنادا إلى تصنيف SOC المهني
A native Remotion data frame — bars grow from zero by real data via spring physics while the figures roll 0→target in sync. The numbers come alive in a way a static HTML chart can't.
A 1970s European editorial poster in motion — a red rule draws across, a giant tilted figure drops in, a three-line headline rises line-by-line, an italic serif standfirst fades.
Bold colored card on a dark gradient — big section number, nav breadcrumb, orange card sliding in, title rising.
Luxury-minimal whitespace hero — single word reveals letter by letter, warm-gold hairline, breathing indicators.
Two-panel split with quote as hero — white/blue panels open from center, accent bar grows, quote reveals line by line.
Swiss-grid statistic anchor — giant number, red accent, growing bars, black data bar. Rational and editorial.
| name | frame-creative-voltage |
| zh_name | 创意电压分屏帧 |
| en_name | Creative Voltage Frame |
| emoji | ⚡ |
| description | Electric split with hand-drawn script — offset panels slide in, display title rises with an outlined word, script strokes itself in. |
| zh_description | 创意电压分屏帧:电光蓝/暗错位分屏滑入 + 描边电光词 + 手写 script 自描, 复古现代有活力 |
| en_description | Electric split with hand-drawn script — offset panels slide in, display title rises with an outlined word, script strokes itself in. |
| category | video |
| scenario | video |
| aspect_hint | 1920×1080 (16:9) |
| featured | 0 |
| recommended | 6 |
| tags | ["split-panel","electric","script","retro-modern","voltage","frame"] |
| example_id | sample-frame-creative-voltage |
| example_name | 创意电压帧 · make it move |
| example_format | markdown |
| example_tagline | 电光蓝/暗错位分屏 + 手写 script 自描 |
| example_desc | 能量感品牌标题 — 描边电光词 + 手写体描入 + 扫入下划线 |
| example_source_url | https://github.com/zarazhangrui/frontend-slides |
| example_source_label | frontend-slides · Creative Voltage (MIT) |
| od | {"mode":"video","surface":"video","scenario":"video","featured":0,"upstream":"https://github.com/zarazhangrui/frontend-slides","preview":{"type":"html","entry":"index.html","reload":"debounce-100"},"design_system":{"requires":false},"example_prompt":"Use the Creative Voltage Frame template to turn my title into an energetic split reveal — electric-blue and dark panels sliding in offset, a display title rising with one outlined electric word, and a handwritten script stroking itself in. Preserve the template's visual signature, use real content, and avoid lorem ipsum or placeholder images.","example_prompt_i18n":{"zh-CN":"用「创意电压分屏帧」模板把我的标题做成一段能量感分屏揭示:电光蓝与暗色面板错位滑入 + 标题升起带一个描边电光词 + 手写体自描入。保持模板的视觉签名,使用真实内容,避免 lorem ipsum 和占位图片。"}} |
【模板: 创意电压分屏帧 (Creative Voltage)】 【意图】能量感品牌/活动标题 / 带手写人味的创意揭示 / 复古现代 hero。视觉提炼自 frontend-slides 的 Creative Voltage 预设 (MIT, © Zara Zhang)。
【画布】1920×1080, 左电光蓝屏 (#2f4bff, 47%) + 右暗屏 (#0d0d14, 53%), 错位分割。
【字体】display Syne 800; mono Space Mono; 手写 Caveat。
【主结构 (时间轴, 默认 4s)】
// CREATIVE_MODE · ON) 淡入。.volt 描边电光词 (-webkit-text-stroke + 蓝色填充)。font-size 132px, 右对齐。Caveat, rotate -7°) 弹入。【配色纪律】电光蓝 #2f4bff/#6f86ff / 暗 #0d0d14 / 白。蓝是能量主色, 描边词与 script 制造"电压"对比。禁止杂色。
【内容纪律】
.volt 描边强调。@keyframes + SVG stroke, prefers-reduced-motion 下全部停在终态。