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.
中文翻譯
創作一支 20.00 秒的動態口語影像,標題爲“BUILD THE FLOOR.” 把它當作一場完全通過字體排版來調度的原創微型演講。每一行都改變畫面的建築結構。最後的宣言必須立在早先那些詞句實際構造出來的東西之上。 交付一個自包含的 HTML 文件,1080×1080,目標 60fps,使用 SVG 和/或 Canvas。嵌入所有必需資源。 藝術指導 背景 #102820。紙張 # F4E9D5。結構強調色 # F2B544。一個文學編輯式的世界,具有公共紀念碑般的尺度與自信。演講用高對比襯線體,承重詞用厚重的 grotesque,小幅時間標記用剋制的等寬字體。不要做舊式抗議海報的陳詞濫調、擴音器、旗幟、人羣、麥克風或素材畫面。 原創演講——精確的詞句,精確的順序 “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.” 不要把這些詞句歸於任何真實人物。不要額外的口號。完整的演講必須在沒有音頻的情況下也能被理解。 核心視覺規則 詞句被賦予建築角色。WAIT 是一根過樑。WAITING 是一個懸掛荷載。VOICE 是一根支撐。ROOM 是一個開口。FLOOR 是一個平臺。這些角色必須從實際的字形中生成,而不是來自放在文字後方的獨立插圖。 分鏡 0.00–3.00 “We were told to wait.” 句子佔據巨大的 WAIT 下方一條狹窄的水平開口。開口緩慢壓縮,同時句子保持可讀。壓力來自版式,而不是鏡頭抖動。 3.00–6.50 “So we learned the weight of waiting.” 按口語短語組揭示句子。WAITING 沿兩條細豎線下降。這兩條線變成懸索。基線在視覺荷載下彎曲,使用受控的矢量變形。 6.50–10.00 “Then one voice made room.” VOICE 豎直進入,並旋轉成一根結構支撐。它抬起基線的一端。ROOM 中 O 的字腔變成一個光圈。下一個構圖通過那個光圈顯露。 10.00–12.50 “Then another.” 第二根支撐抵達。傾斜的結構變平。這是整支影片中第一次完美的水平對齊。用一段短暫的靜止讓這一變化顯得是掙來的。 12.50–16.00 “Now the floor belongs to us.” 先前的結構詞句組裝成一個平臺。最後的句子落在其上。US 通過共享的對齊與尺度獲得強調,絕不通過單獨的炫目效果。 16.00–18.00 保持完整的宣言。一點輕微的張力釋放沿着支撐線傳遞。沒有新文字。沒有躁動的裝飾性運動。 18.00–20.00 鏡頭在完成的平臺下方跟拍。它的底面填滿畫面並變成開場那根 WAIT 過樑。在完全遮蔽下,把隱藏元素歸回初始位置。揭示與開場完全相同的構圖。 編排 不要把演講硬壓到舞曲節拍上。使用基於短語、停頓和強調的提示表。短語的揭示應遵循閱讀順序。至少留出一個 400ms 的絕對靜止時刻。對沉降荷載使用臨界阻尼運動。只對基線使用受控的彈性變形。讓可用空間中的變化承載情緒推進。 字體實現 結構詞使用真實的字形路徑。在變形過程中保留字腔與可讀性。對於不相關詞之間的過渡,使用遮蔽或匹配的結構邊緣;不要對任意路徑點做插值。在當前正在說出的短語變成建築結構之前,保持它可讀。 工程實現 實現 window.seek(t) 作爲確定性的場景渲染器。沒有累積物理、自主的 CSS 過渡或變化的隨機值。使用時間重映射曲線與解析變換。使用 20 秒的週期時間軸,render(0)=render(20)。爲 1200 個導出幀提供 n/60 的固定步長訪問。音頻可選且默認關閉;不依賴瀏覽器語音合成或自動播放。 質量關卡 檢查八個代表性幀。檢查演講按正確順序讀出。檢查結構變換絕不會在觀衆讀到某一行之前將其摧毀。檢查最終平臺明顯是由先前的元素組裝而成。返回完整的 HTML 實現。