
このSkillで書き出した映像
フォローカード(動画アプリ) v1.0.0
アバター、名前、フォロワー数を載せた TikTok 風のフォローカード。赤いフォローボタンをタップするとフォロー中に切り替わります。
- フォーマット
- ショート動画 · 9:16
- 尺
- 0:05
ショート動画スタイルで見せる、4.5秒のフォロー行動喚起向けの無料 HyperFrames ブロック。アバター、名前、ハンドル、フォロワー数を載せたダークなプロフィールの帯が弾むように現れ、赤いフォローボタンがタップされてフォロー中に変わります。名前、ハンドル、フォロワー数、アバターは HTML で編集します。背景は透過です。
2026年11月3日 更新
得られるもの
- 透過背景の4.5秒・1080×1920 のオーバーレイ
- プロフィールカードと、アニメーションするフォローのタップ
- 映像に重ねるための手順
向いている用途
- TikTok、リール、ショートのエンドカード
- 飲食店、フード、ライフスタイルのブランド
- クリエイターのチャンネル
向いていない用途
- 横型の動画
- 長い行動喚起
このSkillについて
/tiktok-follow Ember & Bun(@emberandbun、フォロワー 212K)の TikTok 風フォローカードを作って。アバターは Double Stack、うちのバーガーのショットに重ねる。
フォローされるかどうかは、ショート動画の最後の1秒で決まります。フォローカード(動画アプリ)は、その1秒にわかりやすくおなじみのお願いを添えます。あなたのプロフィールと、気持ちいいフォローのタップを、いちばん良いショットに重ねて。
使い方
- 依頼:表示名、ハンドル、フォロワー数、正方形のアバター、そして重ねるショットをエージェントに伝えます。
- 入力:コピーと色をブロックの変数に書き込みます。文字数はレイアウトの想定に近い長さに保ちます。
- レンダー:
npx hyperframes renderで下書きをレンダーし、いくつかのフレームを確認してから最終版の MP4 を書き出します。 - 再利用:変数は小さな JSON ファイル1つにまとまっているので、次のバージョンもレンダー1回で済みます。
コツ
- アバターには、いちばん見分けやすい商品か顔を使いましょう。
- 名前は短く。長い名前は2行に折り返されます。
- カードは透過背景なので、アルファチャンネル付きでレンダーして自分の映像や写真に重ねます。そのための2つのコマンドは SKILL.md に載っています。
- 商品が力強く映る最後のフレームと組み合わせましょう。
オープンソース
これは HyperFrames のレジストリブロックです。HeyGen と HyperFrames のコントリビューター(heygen-com/hyperframes)が作り、Apache License 2.0 で公開しています。ダウンロードはアセット込みのブロックに Reelity が書いた SKILL.md を添えたもので、エージェントが中身の埋め方とレンダー方法を把握できます。HyperFrames 本体は npm から実行されます。
始める前に必要なもの
- 用意するもの
- 名前、ハンドル、フォロワー数、正方形のアバター、重ねるショット。
- 依存関係
- Node.js 22 以降 — 必須 · FFmpeg — 必須
- 外部コスト
- ありません。HyperFrames は無料のオープンソースで、手元のマシンでレンダーします。
- 最終テスト
- v1.0.0 —
ユーザーレビュー
まだレビューはありません。インストールして最初に評価しましょう。
よくある質問
ボタンの文言を翻訳できますか?
はい。「Follow」と「Following」は HTML 内のただのテキストです。
写真アプリ向けのバージョンはありますか?
はい。フォローカード(写真アプリ)が、同じアイデアを青いボタンで表現しています。
なぜ無料なのですか?
HeyGen と HyperFrames のコントリビューターによるオープンソースの HyperFrames ブロックです。手を加えずに掲載し、エージェントが使えるよう SKILL.md を添え、自社ブランド Ember & Bun で作ったサンプルを付けています。







