免費
Halden Solace · 16:9
由此 Skill 渲染
一個免費的 HyperFrames 區塊，做 15 秒報紙風格的數據敘事。格線和月份標籤先出現，長條帶著數值逐一升起，接著一條折線帶著自己的百分比標籤劃過長條上方，上面有襯線字體的大標題、副標題、圖例和資料來源。月份、兩組數據、刻度、標籤和標題都在 HTML 裡修改。
更新於 2026年11月3日
你將得到
- 一段 15 秒、1920×1080、透明背景的圖表
- 依序長出的長條、折線和數值標籤
- 襯線字體的大標題、圖例和資料來源
適合
- 成果和成長故事
- 給投資人和董事會的進度報告
- 解說影片和報告
不適合
- 超過六個期間
- 資訊密集的儀表板
關於此 Skill
你只需說
/data-chart 做一張長條折線圖：「Halden Solace: pairs sold vs. repeat buyers」，6 月到 11 月，銷售雙數從 9 千到 2.3 萬，回購顧客從 24% 到 44%。
兩個一起變動的數字就是一個故事：銷量和回購顧客、流量和註冊數、營收和毛利。長條折線圖把兩者放進一張沉穩、編輯風格、會自己長出來的圖表，讓觀眾在旁白解釋之前就看懂趨勢。
運作方式
- 提出需求：告訴助手六個月份、長條和折線的數值、單位和一個大標題。
- 填入：它把你的文案和顏色寫進區塊的變數，文字長度盡量貼近版面原本設計的長度。
- 算繪：它用
npx hyperframes render算繪一版草稿，檢查幾格畫面，再算繪出最終的 MP4。 - 重複使用：變數都放在一個小小的 JSON 檔裡，下一個版本再算繪一次就好。
小訣竅
- 讓折線的位置高於長條，標籤才不會和長條重疊。
- 在副標題和圖例裡寫出單位。
- 背景是透明的，請帶 Alpha 通道算繪，再疊到你自己的影片、照片或純色背景上；SKILL.md 裡有這兩道指令。
- 這個區塊沒有變數：助手會照著 SKILL.md，直接在 HTML 裡修改文字和數字。
開源
這是 HyperFrames registry 裡的一個區塊，由 HeyGen 和 HyperFrames 貢獻者製作（heygen-com/hyperframes），以 Apache License 2.0 開源。下載內容包含區塊和它的素材，以及一份由 Reelity 撰寫的 SKILL.md，讓你的助手知道怎麼填寫和算繪；HyperFrames 本身從 npm 執行。
開始前需要準備
- 你需提供
- 兩項指標的六期數據、單位和一個大標題。
- 依賴
- Node.js 22 或更新版本——必要 · FFmpeg——必要
- 外部費用
- 沒有。HyperFrames 免費開源，在你自己的電腦上算繪。
- 最近測試
- v1.0.0 —
使用者評價
還沒有評價。安裝這個 Skill，成為第一個評分的人。
常見問題
可以不用月份，改用其他期間嗎？
可以。標籤是程式碼裡的一個清單，季度、年份或週都行。
怎麼避免標籤重疊？
把折線的最大值設得比長條的最大值低，折線就會落在長條上方；我們的範例就是這樣做的。
為什麼免費？
這是 HeyGen 和 HyperFrames 貢獻者做的開源 HyperFrames 區塊。我們原樣上架，附上 SKILL.md 讓你的助手直接上手，範例是用我們自家品牌 Halden Solace 做的。
