wide data · date + value
Single-line Story
A single time series grows across the frame with a live endpoint readout and a decisive final lockup.- Linear trace
- Smooth trace
オープンソース・モーションテンプレート · v0.1
データを、フレームに
入力 · CSV / JSONSCRUB · ANY FRAMEBUILT FOR HYPERFRAMESデータを編集可能な動画へ
AIエージェント向け。HyperFramesで動作。
Give your AI agent a CSV, JSON, URL, API, or named public data source. Plotbeat retrieves or maps the data into a reusable, editable HyperFrames video project instead of an opaque export.
single-line-story18 sec
36ROWS MAPPED
ここから開始
ひとつのスキル
どんなデータでも
Plotbeatを追加し、ファイルを添付するかデータソースを指定してください。取得、テンプレート選択、マッピング、テンポ、検証、HyperFramesプロジェクトまで処理します。
Plotbeatを追加
$
npx skills add DbgKinggg/plotbeat --skill plotbeatサンプルプロンプト
FREDから過去10年間の米国の月次失業率データを取得し、系列名と取得日を明記して、テンポのよい編集可能なHyperFramesトレンド動画にしてください。$plotbeatを使い、ビジュアルスタイルの選択を手伝い、レンダリング前に確認させてください。
ひとつの文法 · 複数のビジュアル
雰囲気を
選ぶ
同じデータ、違う演出。
FilterEvery thumbnail is a real HyperFrames capture.
データ織機を
紹介します
行を入力。
チャートフレームを出力。
Rows enter as structured cells. A visible timing machine turns them into motion, then releases finished chart frames.
モーション文法 · 8 ready
プロットを
選ぶ
モーション文法を選択。
Every template is a real HyperFrames composition with frozen sample data, a clear input contract, seek-safe motion, eight visual styles, and a polished finale.
long data · date + series + value
Multi-line Rank
Multiple time series grow together while a live legend glides through rank changes, followed by a final table.- Full field
- Top five
long data · date + series + value
Bar Race
Ranked horizontal bars trade places over time while the scale and current-period readout update continuously.- Absolute values
- Leader indexed
long data · date + series + value
Stacked-area Story
Multiple time series accumulate into a flowing stacked-area composition with absolute and percentage views, live mix readouts, and a polished finale.- Absolute total
- 100% composition
long data · date + series + x + y
Scatter Journey
Entities move through two-dimensional space over time with connected trails, live coordinates, and optional bubble sizing.- Connected trail
- Bubble trail
location rows data · location + latitude + longitude + value
Animated Map
Locations pulse across a stylized world map while optional connection flows and live intensity readouts build the geographic story.- Location pulse
- Connection flow
metric rows data · metric + value + target + change
KPI Dashboard
A cinematic performance board stages multiple KPIs, target progress, and direction of change without feeling like a static dashboard.- Metric cards
- Radial progress
event rows data · date + title
Milestone Timeline
Events reveal across a continuous timeline with alternating chapter cards, a moving playhead, and a focused live milestone readout.- Continuous line
- Chapter cards
見える制作フロー
行を入力
ビートを出力
DATA → STYLE → TIMELINEMap the rows
The skill inspects dates, series, units, missing values, and the story your data can honestly support.
Pick a grammar
Start from a proven chart composition instead of rebuilding the same motion language every time.
Choose the style
Select a polished light or dark visual system, or build your own palette, typography, and composition tokens.
Preview in HyperFrames
Your data is compiled locally into an ordinary, editable HyperFrames HTML project.
Approve + render
Check arbitrary seeks, tune the pacing in Studio, then let HyperFrames produce the final video.
エンジンは見えるまま
HyperFrames
上に構築
Remove HyperFrames and the product stops working. That is the point: the skill specializes the engine instead of quietly rebuilding its timeline, preview, or renderer.
CORE ENGINEAI skillIntent → template + mappings
Template systemComposition + chart runtime
Prepared dataCleaned and ready to animate
HyperFrames engineTimeline · Studio · Check · Render
モーションを指示
大切なことを
伝える
Choose the data and the narrative. The skill handles the repeatable setup, while you keep control of pacing, styling, and final Studio approval.
01トレンド
“$plotbeatを使ってFREDから過去10年間の米国の月次失業率データを取得し、系列名と取得日を明記して、Studio Blueprintスタイルのテンポのよい単一折れ線HyperFrames動画にしてください。”
02ランキング
“$plotbeatを使ってcohorts.csvからPaper Cutスタイルの複数系列ランキング動画を作成してください。地域をアクティブユーザー数で時系列に順位付けし、上位8件を表示して、見やすい最終表で締めてください。”
03マップ
“$plotbeatを使ってUSGS GeoJSONフィードから直近30日間のマグニチュード5以上の地震を取得し、マグニチュードを値として、Signal NoirスタイルのテンポのよいHyperFramesアニメーションマップにしてください。”