無料
Ember & Bun · 4:5
このSkillで書き出した映像
リーダーボード・レース v1.0.0
各メンバーのアバターが自分の行を、件数に応じたスピードで跳ねながら進むリーダーボード。トップの人がいちばん速く進みます。
まだ評価はありません 0 ダウンロード
- フォーマット
- 動画 · 4:5
- 尺
- 0:16
16秒・4:5 のリーダーボード向けの無料 HyperFrames ブロック。アイブロウ、タイトル、期間、合計の下に、名前と件数を載せた行が1人ずつ並び、アバターまたはイニシャルがその行を跳ねながら進みます。件数が多いほど速く進みます。アイブロウ、タイトル、期間、合計、フッター、出典、各行（名前、件数、アバター）は変数です。背景は透過です。
2026年11月4日 更新
得られるもの
- 透過背景の16秒・1080×1350 のリーダーボード
- 件数に応じたスピードで跳ねるアバター
- すべてのラベルと各行の変数
向いている用途
- チームやコミュニティへのシャウトアウト
- 売上、配達、サポートのリーダーボード
- オープンソースのコントリビューターのまとめ
向いていない用途
- 数十人規模のメンバー
- 厳密な比較
このSkillについて
依頼の例
/week-in-merges Ember & Bun のリーダーボード・レースを作って。「Orders delivered this week」、10月27日から11月2日、合計412件、配達員は Sam 96、Priya 88、Leo 74、Ana 66、Tomas 51、Mei 37。
リーダーボードがあると、成果発表が楽しくなります。リーダーボード・レースは、1週間の数字（配達数、売上、登録数、プルリクエスト）をレースに変えます。全員が自分のペースで行を跳ねながら進むので、トップが一目でわかり、みんなに見せ場ができます。
使い方
- 依頼：ボードに載せるメンバー、各自の件数、何を数えるか、期間をエージェントに伝えます。
- 入力：コピーと色をブロックの変数に書き込みます。文字数はレイアウトの想定に近い長さに保ちます。
- レンダー：
npx hyperframes renderで下書きをレンダーし、いくつかのフレームを確認してから最終版の MP4 を書き出します。 - 再利用：変数は小さな JSON ファイル1つにまとまっているので、次のバージョンもレンダー1回で済みます。
コツ
- 4:5 では6〜8行がいちばん読みやすいです。
- アバターには写真を使うか、空欄にしてイニシャルを表示しましょう。
- 背景は透過なので、アルファチャンネル付きでレンダーして自分の映像や写真、単色の背景に重ねます。そのための2つのコマンドは SKILL.md に載っています。
- 1080×1350 で作られているので、LinkedIn や Instagram のフィードに投稿しましょう。
オープンソース
これは HyperFrames のレジストリブロックです。HeyGen と HyperFrames のコントリビューター（heygen-com/hyperframes）が作り、Apache License 2.0 で公開しています。ダウンロードはアセット込みのブロックに Reelity が書いた SKILL.md を添えたもので、エージェントが中身の埋め方とレンダー方法を把握できます。HyperFrames 本体は npm から実行されます。
始める前に必要なもの
- 用意するもの
- 6〜8人分の名前と件数、何を数えるか、期間。
- 依存関係
- Node.js 22 以降 — 必須 · FFmpeg — 必須
- 外部コスト
- ありません。HyperFrames は無料のオープンソースで、手元のマシンでレンダーします。
- 最終テスト
- v1.0.0 —
ユーザーレビュー
まだレビューはありません。インストールして最初に評価しましょう。
よくある質問
何を数えられますか？
何でも数えられます。サンプルでは配達数を数えています。単位の言葉は HTML 内で設定し、すべてのラベルは変数です。
写真を追加できますか？
はい。各行にアバター画像を設定できます。空欄の行にはイニシャルが表示されます。
なぜ無料なのですか？
HeyGen と HyperFrames のコントリビューターによるオープンソースの HyperFrames ブロックです。手を加えずに掲載し、エージェントが使えるよう SKILL.md を添え、自社ブランド Ember & Bun で作ったサンプルを付けています。
