ホーム / 全スキル / コンテンツ制作 / product-demo-integration
コンテンツ制作 · saranambiar/hyperframes-video-agent-skills

product-demo-integration

クロップ判定、ズーム維持、カメラスワイプ遷移、UI視認性チェック、ナレーションに合わせたタイミング調整など、未加工の製品デモ録画をエージェント作成動画へ統合します。ユーザーから画面録画、製品ウォークスルークリップ、SaaSデモ、アプリ映像、ブラウザ録画が提供された場合や、製品デモ映像への出入りトランジションを求められた場合に使用します。

L4 高権限 · 段階的認可と監査V1 コミット固定コマンド実行ファイル書き込みDual-pass Audit
Author saranambiarGitHub saranambiar/hyperframes-video-agent-skills ↗Stars 48License Apache-2.0(仓库根 LICENSE 为 Apache License Version 2.0;GitHub API license.spdx_id = Apache-2.0)Commit f6b043d9fd
管理レベルは Skill の能力と推奨統制措置を示すものであり、品質や安全性の認証、利用可否の判定ではありません。使用の可否はユーザーおよび管理者が決定します。Agent 環境によって制約が異なるため、自動保護を仮定しないでください。第三者製 Skill の著作権は原著作者に帰属し、利用リスクは利用者が負います。

1仕組みと動作原理

デフォルトの基本方針は「キャンバス除去よりもUI保持を優先」:ズームやスクロールの全編にわたり主要UIが常時視認でき、かつ検証フレームで最もタイトなクロップの成立が確認できた場合にのみクロップを実行する。

skills/product-demo-integration/SKILL.md
Default to preserving UI over removing background canvas.
ここで行われていること:クロップを「見栄えを整えるデフォルト動作」から「条件付きのリスク動作」へと格下げし、検証フレームをアンロック条件に設定——ファミリ全体で反復される「実証してから着手する」規範を体現。

トリムやリタイミングを決定する前に、まず moment map(録画タイムスタンプ / 視認可能な内容 / 対応するナレーションフレーズ / 目標グローバル時間 / カーソルの重要度 / スクロール位置の重要度 / 字幕の重複 / クロップの安全性)を作成する。

skills/product-demo-integration/SKILL.md
Create a moment map before editing:
ここで行われていること:「どのフレームがどの台詞に対応するか」を事前に表へ落とし込み、編集時に録画を見返してタイミングを探す手間を排除。

イン・トランジションの規則:前シーンの最終フレームから開始し、(連続性が求められる場合は)ハードカットではなくカメラスワイプまたはプッシュを用い、録画の現在の先頭フレームに着地させる。録画冒頭の無駄時間は同期が維持される場合にのみ切り詰める。

skills/product-demo-integration/SKILL.md
- Land on the current first frame of the product recording.
ここで行われていること:「先頭フレームの整合」を必須要件として扱い、scene-continuity-and-transitions の先頭フレーム一致規範と連動。

4つの同期基準:製品状態が台詞の瞬間に視認可能であること(必要に応じてトランジションを前倒し)、理解が重要なら最終フレームを保持、スクロールを不自然に加速させるくらいなら直前の映像を減速させる、単語の途中で絶対にカットしない。

skills/product-demo-integration/SKILL.md
- Do not cut mid-word in narration to reach a product state.
ここで行われていること:「同期」を「尺の単純な一致」ではなく「製品状態が台詞に乗ること」と定義——そのため強引なカットよりも手前の速度調整を優先。

録画のクリーンアップはチェックリスト化しつつも節度を保つ:カーソル、ブラウザUI、通知ポップアップ、無駄時間、読み込み時の白画面、デスクトップ端、スクロール速度、ズームフォーカス——製品の明瞭さを損なわない場合にのみ処理する。

skills/product-demo-integration/SKILL.md
- Notification popups.
ここで行われていること:クリーンアップ対象(プライバシーに関わる通知ポップアップを含む)を網羅しつつ、「製品の明瞭さを損なわない場合にのみ削除または非表示にする」ことで過剰加工を抑止。

クロップ判定マトリクスは3段階:クロップなし(キャンバス許容、画面またぎのズーム、本文欠けのリスク、洗練度より製品状態を重視)、ライトクロップ(キャンバスが目障りだがUIは中央配置、字幕のスペースが必要、ブラウザUIや無駄な余白を安全に除去可能)、ダイナミッククロップ(全クロップ領域がマッピング済み、動きに意図がある、全重要製品状態の検証フレームが存在)。

skills/product-demo-integration/SKILL.md
Choose dynamic crop only when:
ここで行われていること:「どの程度クロップするか」を美的嗜好ではなく条件判定とし、ダイナミッククロップに最も厳格なアンロック条件を設定。

ユーザー承認ポイントの前置:視認可能なキャンバスの切り取り、カーソル削除、大幅な倍速化、製品詳細のぼかしやマスク、実際の録画をリメイクされたモックUIへ置き換える行為——これらは事前に必ず確認する。

skills/product-demo-integration/SKILL.md
Ask before: - Cropping out visible canvas.
ここで行われていること:「情報の真正性を変えうる編集」を承認必須項目として規定。特にモックUIへの差し替えは、製品本来の機能と誤認されるリスクがあるため極めて慎重に扱う。

2コア機能

01画面録画のインテーク検証:再生時間、解像度、フレームレート、音声、およびキャンバス、ブラウザ枠、カーソル、ズーム、スクロール、無駄時間の有無を識別
023段階のクロップ判定(no crop / light crop / dynamic crop)とクロップ安全手順:録画開始点、各ズームピーク、各スクロール停止位置、必須製品状態、最終フレームからフレームを抽出し、候補クロップを逐次検証。重要な文字、カーソル文脈、UIコントロールが欠ける場合は即座に却下し、やや広めの余白を優先
03製品パートへの出入りトランジション規則と検証フレーム(トランジション境界のフレーム抽出、録画末尾の不意なブランクフレーム回避、最後の製品状態に対する十分な認識時間の確保)
04製品モーメントのマッピングとナレーション同期(必要に応じたトランジションの前倒し、最終フレーム保持、スクロール加速を避けた前段の減速、単語途中でのカット禁止)
05字幕安全性チェック:字幕焼き込み時に下部ナビゲーションバー、製品テーブル、モーダルボタン、タイムライン操作部を確認。必要に応じて字幕マージンを調整または検証フレームを差し替え
06QAチェックリストと引き継ぎフィールド(最初の製品フレーム、各ズームピーク、各必須製品状態、出入りトランジション、字幕によるUI遮蔽なしの確認。ソース録画、クロップ方針、カット点、リタイム比率、主要検証フレーム、未解消のUI不備を含む引き継ぎレポート)

3外部依存関係

KindDependency / Endpoint
cli媒体探测与切分(时长/分辨率/帧率/音轨;trim 与重定时)——SKILL.md 只写探测要求,具体命令由同族 ffmpeg/ffprobe 链路承担
cliffmpeg(间接:抽帧与接触表的实现工具,见仓库根 scripts/extract_proof_frames.py)
package素材输入:用户提供的原始屏幕录制(SaaS demo / app 录屏 / 浏览器录制),本地文件,无外部服务
package参考文件 skills/product-demo-integration/references/crop-and-zoom.md(裁切安全程序与常见错误清单)

4推奨統制措置と判定根拠

安全運用のための推奨統制措置
Agent 向け
段階的・都度認可、サンドボックス推奨
管理者向け
承認フロー、ロールバック可能、全履歴監査
判定根拠(ファイルパスと抜粋)
  • scripts/: ローカルスクリプトまたはコマンドの実行: (本スキルディレクトリ内にスクリプトなし)仕様書に基づき、ホスト側で録画の検証、フレーム抽出、クロップ、リタイミング(ffmpeg/ffprobe ツールチェーン)を実行し、製品クリップをレンダリング
  • 本地工作目录: ファイルの読み書きと成果物の出力: クロップおよびリタイミング済みの製品クリップとレンダリング出力(renders/ 配下)
監査ノート: スキルディレクトリ内は SKILL.md + references/crop-and-zoom.md のみ(純粋な指示書でありスクリプトなし)。動作範囲はローカルのファイル読み書き(録画のフレーム抽出、クロップ、リタイミング、レンダリング、検証フレーム出力)およびローカルメディアツールに限定され、青色ランクに適合します。**外部サービスへの素材送信なし**:スキルディレクトリ全体の完全スキャンにより、http(s):// エンドポイント、fetch/requests、トークン/環境変数の読み取りが存在しないことを確認済み。録画はユーザーから提供され、加工はすべてローカルで完結します。ドキュメントでは「製品詳細のぼかしやマスク」「実際の録画をリメイクしたモックUIへ置き換える行為」など視聴者を誤導する可能性のある編集に対してユーザー承認ゲートを設けています。同ファミリ9件のスキルと判定基準は一致:ディレクトリ内は SKILL.md(+ references)のみで、動作はローカル読み書きとローカルCLIに留まり、エンドポイント、認証情報、素材の外部送信は一切含まれていません。

5二重目の独立検証

  • [ok] 「无网络无凭证」是否成立 — 目录扫描无 URL、无 fetch、无 token/env/cookie;产品录屏作为本地素材处理,无上传、无生成服务,故不构成橙档。
  • [ok] 三处裁切判据是否自相矛盾 — SKILL.md 的 Use crop only when(三个必要条件)、Crop Decision Matrix(三档适用条件)、references 的四步程序(逐帧测试与否决规则)方向一致:默认不裁、裁切需证据、动态裁切最严。未发现冲突。
  • [discrepancy] 探测要求是否有可执行命令 — 本 skill 与族内多件一样只写探测要求,未点名 ffprobe 或仓库脚本;实际命令在 audio-sync-assembly(ffprobe 与探测脚本)与 render-qa-and-surgical-changes(scripts/probe_media.py)里。只加载本件时探测动作需自行补齐。
  • [ok] 用户批准点是否覆盖 references 建议的所有激进编辑 — SKILL.md 的 Ask before 列表含裁掉可见画布、去光标、大幅加速、模糊或遮罩产品细节、用重制 UI 替换真实录屏;覆盖了 crop-and-zoom.md 建议的动态裁切与「更优替代方案」中涉及真实性的项,未见遗漏的高风险编辑。
  • [ok] 转场规则是否与 scene-continuity-and-transitions 一致(避免两件给出不同做法) — 本件要求从前一场景末帧起、用相机擦或推而非硬切、落在当前首帧、边界抽证明帧;scene-continuity-and-transitions 的首帧匹配与边界证明程序方向相同(后者另给 0.05s 前后与转场中间的抽帧程序),互为细化而非冲突。
  • [ok] 是否有未声明的素材外发(例如云端转写或云渲染) — 全目录无端点、无服务名;清理与裁切均在本地完成。唯一外生动作是宿主抽帧后的读图(若使用视觉模型),不属本 skill 声明的调用。

6結論

  • クロップを「根拠が揃って初めてアンロックされるリスク動作」と定義し、検証フレームを条件に設定することで、ズーム後の重要UI欠損という最も頻発するトラブルを直接防止
  • moment map により「どのフレームがどの台詞に対応するか」を事前に表化し、カットやリタイミングを当て推量ではなく確固たる根拠に基づいて進行
  • 製品スクロールを不自然に加速させるくらいなら手前を減速させ、単語途中では絶対にカットしないという明確な同期哲学
  • 製品UIと字幕の競合(ボトムナビ、テーブル、モーダルボタン、タイムライン)を個別箇条書きで扱い、製品デモ特有の高頻度課題に対応
  • 視聴者を誤導する恐れのある編集(カーソル消去、詳細のぼかし、モックUIへの差し替え)をエージェント独自の判断に委ねず、ユーザー承認事項として義務付け
  • 最適な用途: 適合ケース:ユーザーから未加工の画面録画(SaaSデモ、アプリウォークスルー、ブラウザ録画、製品解説クリップ)が提供され、それをデザインされた動画へと組み込む必要がある場合——クロップの要否、出入りトランジションの設計、製品状態とナレーションの同期、字幕によるUI遮蔽の回避、検証フレームによる検収を行う場面。
    不向きな用途: 非適合ケース:① 製品画面録画が一切存在しない場合(hyperframes-scene-builder / motion-design-systems を利用);② ユーザーに代わって製品画面の録画や素材収集を行う必要がある場合(既存録画の加工のみを扱い、キャプチャ機能は含まない);③ 高度なポストプロダクション合成(マルチトラック、キーイング、トラッキング)を要するプロジェクト(本件はクロップ、トランジション、タイミング、視認性のみを対象);④ 素材の権利クリアランスやプライバシーコンプライアンス審査を要するプロジェクト(ドキュメントの対象外)。
    Install Agent-Ready
    ① Verified Mirror 2026-09-28
    Option A · Direct DownloadDownload product-demo-integration.tar.gz
    sha256: da34d1aa8e5b647e…
    Option B · Copy Guide for Agent
    install.json
    Agent はこの JSON ガイドから自動的にダウンロードして検証します。
    ② Upstream GitHub
    GitHub Repo ↗
    Pinned to commit f6b043d9fd.