--- title: "Kinetic typography poem where words become architecture" description: "A 20-second kinetic typography film in which spoken-word lines build architectural structures on screen." canonical: "https://potto.ai/zh/videos/kinetic-typography-poem-where-words-become-architecture" language: "zh-CN" datePublished: "2026-09-25" --- # Kinetic typography poem where words become architecture A 20-second kinetic typography film in which spoken-word lines build architectural structures on screen. A 20-second kinetic typography piece on a 1080x1080 canvas at 60fps, built with Canvas and SVG in a single HTML file. The speech unfolds line by line as words take on architectural roles: WAIT as a lintel, WAITING as a suspended load, VOICE as a support, ROOM as an opening, and FLOOR as a platform, with these roles emerging from the letterforms themselves. The palette uses background #102820, paper #F4E9D5, and structural accent #F2B544, with a high-contrast serif for the speech, a heavy grotesque for load-bearing words, and a restrained monospace for timing marks. - [动态文字](https://potto.ai/zh/videos/kinetic-type.md) - 由 Gdgtify - 时长与比例: 0:20 · 1:1 - 制作工具: Canvas - 发布于 2026年9月25日 - 查看原片: https://x.com/Gdgtify/status/2103458245213929495 ## 提示词 ```text 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. ``` ## Kinetic typography poem where words become architecture 常见问题 Kinetic typography poem where words become architecture 的制作方式、提示词内容，以及如何用 Potto 做出同类的 动态文字 视频。 ### Kinetic typography poem where words become architecture 是什么？ Kinetic typography poem where words become architecture 是 Gdgtify 制作的 动态文字 动态图形视频。 A 20-second kinetic typography film in which spoken-word lines build architectural structures on screen. ### Kinetic typography poem where words become architecture 是怎么制作的？ Kinetic typography poem where words become architecture 使用 Canvas 制作，属于 Potto 上 动态文字 分类的 AI 动画视频。 ### 可以查看 Kinetic typography poem where words become architecture 的提示词吗？ 可以。本页有 Kinetic typography poem where words become architecture 的完整提示词。你可以复制，或点击「使用此提示词」，在 Potto 工作台中打开。 ### Kinetic typography poem where words become architecture 有多长，画面比例是多少？ Kinetic typography poem where words become architecture 时长为 0:20，画幅为 1:1。 ### 我能用 Potto 做出像 Kinetic typography poem where words become architecture 这样的 动态文字 视频吗？ 可以。点击「使用此提示词」，把 Kinetic typography poem where words become architecture 的提示词载入 Potto 工作台。Potto 会渲染自己的版本，导出前你可以修改文字和风格。 ### 在哪里观看 Kinetic typography poem where words become architecture 的原片？ Kinetic typography poem where words become architecture 最初由创作者发布。点击「查看原片」，即可在新标签页打开该帖。 ### 在哪里可以找到更多像 Kinetic typography poem where words become architecture 这样的 动态文字 视频？ 在 Potto 上浏览 动态文字 合集：85 支视频，每支都附有提示词、规格和来源。