Prompt Style Atlas

代码动效参考 · 动态视觉

Create a 20.00-second kinetic spoken-word film titled “BUILD THE FLOO…

Created by

原始 Prompt

原文已收录 · 未独立复现

Create a 20.00-second kinetic spoken-word film titled “BUILD THE FLOOR.” Treat this as an original miniature speech staged entirely through typography. Every line changes the architecture of the frame. The final declaration must stand on something the earlier words physically constructed. Deliver one self-contained HTML file, 1080×1080, targeting 60fps, using SVG and/or Canvas. Embed all required assets. ART DIRECTION Background #102820. Paper # F4E9D5. Structural accent # F2B544. A literary editorial world with the scale and confidence of a public monument. Use a high-contrast serif for the speech, a heavy grotesque for load-bearing words, and a restrained monospace for small timing marks. No distressed protest-poster clichés, megaphones, flags, crowds, microphones, or stock footage. ORIGINAL SPEECH — EXACT WORDS, EXACT ORDER “We were told to wait.” “So we learned the weight of waiting.” “Then one voice made room.” “Then another.” “Now the floor belongs to us.” Do not attribute these words to any real person. No extra slogans. The complete speech must be understandable without audio. CENTRAL VISUAL RULE Words have assigned architectural roles. WAIT is a lintel. WAITING is a suspended load. VOICE is a support. ROOM is an opening. FLOOR is a platform. These roles must emerge from the actual letterforms, not from separate illustrations placed behind text. STORYBOARD 0.00–3.00 “We were told to wait.” The sentence occupies a narrow horizontal opening beneath a massive WAIT. The opening slowly compresses while the sentence remains readable. The pressure comes from the layout, not camera shake. 3.00–6.50 “So we learned the weight of waiting.” Reveal the sentence in spoken phrase groups. WAITING lowers on two fine vertical rules. Those rules become suspension cables. A baseline bends under the visual load using a controlled vector deformation. 6.50–10.00 “Then one voice made room.” VOICE enters vertically and rotates into a structural support. It lifts one end of the baseline. The counter of the O in ROOM becomes an aperture. The next composition is revealed through that aperture. 10.00–12.50 “Then another.” A second support arrives. The tilted structure levels. This is the first moment of perfect horizontal alignment in the film. Use a brief stillness to make the change feel earned. 12.50–16.00 “Now the floor belongs to us.” Earlier structural words assemble into a platform. The final sentence settles onto it. US receives emphasis through shared alignment and scale, never through a separate flashy effect. 16.00–18.00 Hold the complete declaration. A slight release of tension travels through the supporting rules. No new text. No restless decorative motion. 18.00–20.00 The camera tracks beneath the completed platform. Its underside fills the frame and becomes the opening WAIT lintel. Under full occlusion, return hidden elements to their initial positions. Reveal the exact opening composition. CHOREOGRAPHY Do not force the speech onto a dance beat. Use a cue sheet based on phrases, pauses, and emphasis. Phrase reveals should follow reading order. Allow at least one 400ms moment of absolute stillness. Use critically damped motion for settling loads. Use controlled elastic deformation for the baseline only. Make the changes in available space carry the emotional progression. TYPE IMPLEMENTATION Use actual glyph paths for structural words. Preserve counters and legibility during deformation. For transitions between unrelated words, use occlusion or matched structural edges; do not interpolate arbitrary path points. Keep the currently spoken phrase readable before it becomes architecture. ENGINEERING Implement window. seek(t) as a deterministic scene renderer. No accumulated physics, autonomous CSS transitions, or changing random values. Use time-remapping curves and analytic transforms. Use a 20-second periodic timeline with render(0)=render(20). Provide fixed-step access at n/60 for 1200 export frames. Audio is optional and off by default; no browser speech synthesis or autoplay dependency. QUALITY GATE Inspect eight representative frames. Check that the speech reads in the correct order. Check that structural transformations never destroy a line before the audience can read it. Check the final platform is visibly assembled from earlier elements. Return the complete HTML implementation.

查看 X 原帖

视频信息

时长: 0:20
画幅: 1080 × 1080

技术栈

canvas

如何使用这条 Prompt

这些案例通过代码制作动效或交互 HTML，不是 Sora、Runway 等文生视频模型的生成配方。来源 Prompt 和预览不保证同样输出，复现前请检查依赖及原帖说明。

使用流程

用来源需求重建代码动效

预览用于参考，来源文字可能省略后续修改、素材或依赖；本站未独立复现这些案例。

阅读代码动效使用指南

01
先看完整/部分原文标识，再到原帖检查缺失指令与素材。
02
向编程助手说明输出格式、库版本和素材要求，先完成一个可运行场景。
03
运行生成的项目，先检查浏览器控制台，再增加效果。
04
对照预览检查时序和交互，并检查缩放、移动端和减少动态效果模式。

结果不符合预期？先检查这些

场景黑屏？依次检查加载错误、画布尺寸、相机取景和渲染循环。
代码动效需求不能直接当作文生视频配方使用。

同类更多 Prompt

群友一句话提示词用Opus5.5做的粒子网站真的太酷了

@zhang_baoqing

趁着今天有空回看和分析了一下整个视频审美在线的Opus 5.5确实顶 @claudeai 3D渲染器像素风这个渲染效果确实做得很强，逻…

@sciencedegens

make a dynamic 15-second motion graphics video that shows what an inc…

@ajith_io