Communitygithub.com

kelvinmacaco/short-animation

用於在 generate.py 中繪製 Short 動畫場景 – 從 lib_short 中選取正確的素材片段,適合每個段落(第 0 幀標題、單詞、計數器、目標、箭頭、SVG 旗幟、進度引信、遮罩填充揭示、平靜或動感的結尾、循環),並確保每個場景在影片的基調中具有互動性。

short-animation 是什麼?

此技能專為生成動畫 Short 影片而設計,透過 `generate.py` 腳本協調場景繪製。它依賴 `hyperframes`、`hyperframes-registry` 和 `graphify` 等輔助技能,幫助開發者從素材庫中挑選正確的動畫片段,並避免重複造輪子。技能涵蓋從開場鉤子、文字顯示、數字特效、衝突箭頭、SVG 旗幟、進度引信、畫面填充,到結尾的平靜或動感循環等多種場景。每個場景都需在 1.5–2.5 秒內切換互動,且遵循嚴格的安全區域、時間軸與效果規則(如禁止對 clip 本身做 visibility/opacity 動畫、使用 `immediateRender:false`、用 `repeat` 搭配 `yoyo` 實現連續效果)。透過這個技能,開發者能快速產出具有專業動畫質量的 Short 影片,同時保持程式碼結構清晰且易於維護。

相容平台~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/kelvinmacaco/kit-shorts-virais/tree/HEAD/.claude/skills/short-animation

在你喜歡的 AI 中提問

開啟一個已預先載入此 Agent Skill 的新對話。

說明文件

場景動畫

支援技能:hyperframes(渲染合約、時間軸、片段規則)、hyperframes-registry(在親手繪製前先尋找現成的區塊,例如 glitch、CRT、圖形)以及 graphify,用於在 lib 中尋找素材片段(graphify explain "pavio_scene")。

從 template/build/generate.py 開始,該檔案已包含每個腳本部分的範例場景。

每個段落的正確素材片段

段落素材片段備註
第 0 幀 / 鉤子hook_html + shake + drift相同標題會在循環中重複出現
口說句子kline + words_js;對關鍵字使用 slam每段 2–4 個單詞使用一行
謎團燈光點亮,在「最糟」/「日期」上使用 slam旋轉的日曆(「20??」)
數字counter(...) + 衝擊縮放 + shake使用巴西葡萄牙語格式(toLocaleString)
地點或目標脈動的 ping 環搭配日期或來源,使用等寬字體
衝突箭頭相撞 + hit 閃光A 方 × B 方
各方或國家SVG 旗幟 + 繪製線條(pathLength="1")+ 帶標籤的移動點不使用紋章
列表進度pavio_scene,一根引信每完成一個項目就燃燒,並在高潮時爆炸取代「1/3」;step_badge 僅在最後手段使用
破壞、規模螢幕被點填滿(clip-path)+ 巨型計數器資料來源使用等寬字體
電視視窗tvv + enter_tv用於橫向影片片段
沉重結尾輕柔問題、緩慢填充的心形、深色 follow_card、淡出至全黑無彈出、閃光、閃爍或切換
輕快結尾like_block + plane_svg + follow_card可以有彈出和光亮
循環鉤子的反向片段,結尾回到第 0 幀 + 相同標題從黑色開始(沉重),或搭配 osd_rewind(輕快)

規則

  • 每 1.5–2.5 秒有變化,且每個場景都有互動。
  • 時間設定: 局部位於 scene() 內,全域則在 SCENES、切換、效果和字幕中。
  • 安全區域: 文字 x 在 90–900,y 在 170–1330。長行請縮小字型(Archivo Black 每個字母約佔 0.75 em)。
  • @ 標誌: lib 會將其放在字幕下方(WM_TOP);不需要再畫一個。
  • 片段規則:
    • 不要對 clip 本身進行 visibility/opacity 動畫;
    • 在後續的 fromTo 中使用 immediateRender:false;
    • 對連續效果(火花、脈衝)使用 repeat 搭配 yoyo;
    • 不要使用隨機性(噪點使用固定種子)。
  • 基調: 在沉重的影片中,紅色脈衝不透明度最多 0.32;在輕快的影片中,顏色更鮮豔。

Individual skills in this repo

This repo contains 2 individual skills — each has its own dedicated page.

相關技能