Communitygithub.com

nathankim0/app-demo-recorder

AndroidエミュレータまたはiOSシミュレータ上で動くモバイルアプリの、きれいでテンポの良いデモクリップを録画します。広告、ストアプレビュー、SNS投稿、画面録画を入力とするAI動画ツール向けに最適です。

app-demo-recorder とは?

このスキル(nathankim0/app-demo-recorder)は、AIエージェント(Claude Code、Cursor、Codexなど)がAndroidエミュレータやiOSシミュレータ上で動作するモバイルアプリのデモ動画を、人間が操作しているような自然な品質で録画・編集するためのものです。各クリップは「1機能につき1クリップ」というルールで録画され、`$S`スクリプトが`ffmpeg`、`adb`(Android)、`xcrun simctl`(iOS)を利用して、ホスト側からの録画、無駄な時間のカット、クリップの検証を自動化します。特に、録画前に端末のパフォーマンス調整(メモリ割り当て、ステータスバーのクリーン化)を行い、リハーサル→本番録画→待機時間削減(`tighten`、`speed`)というワークフローで、広告やストアプレビューにそのまま使える高品質なクリップを生成します。デバッグビルドと本番ビルドの使い分け、クレデンシャルの安全な入力、録画後のデータ削除など、実際のマーケティング用途に配慮した設計が特徴です。

対応~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/nathankim0/app-demo-recorder/tree/HEAD/skills/app-demo-recorder

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

アプリデモレコーダー

アプリを自信を持って使っている人のように見える、短い画面録画を作成します。1クリップに1機能、読み込み中の停止なし、デバッグオーバーレイなし、広告なし、整理されたステータスバー。

$S はこのスキルのディレクトリにある scripts/appdemo.sh です。これには ffmpeg(brew install ffmpeg)に加えて、Android用の adb または iOS用の Xcode の xcrun simctl が必要です。サンドボックス化されたエージェントでは、昇格された権限で実行してください。エミュレータ、シミュレータと通信し、ワークスペース外にも書き込みを行います。

1. 何を表示するか合意する

  • ユーザーが指定していない場合は、表示する機能を尋ねてください。機能ごとに1クリップを録画し、クリップ名を NN_feature(01_price_search、02_calculator)と名付けます。アプリが開く最初の画面ではなく、製品が最も優れているものから始めてください。
  • どのビルドとアカウントを使用するかが明らかでない場合は、尋ねてください。マーケティング用の映像は通常、本番リリースビルドと実際のデータが必要です。デバッグ/ステージングビルドでは、開発メニュー、警告トースト、テストデータが表示され、動作も遅くなります。推測しないでください。ステージング録画は通常、やり直しが必要になります。
  • クリップに有料またはプレミアム状態が必要な場合は、実際の課金に触れる前に、アプリ内のデバッグ/開発者オーバーライドを探してください。
  • ユーザーから与えられたクレデンシャルは、すべてのコマンドをログに記録するツールではなく、出力を破棄するコマンド(Androidでは adb shell input text ... >/dev/null、iOSでは printf ... | xcrun simctl pbcopy <udid> してからペースト)で入力し、ファイルに書き込まないでください。

2. デバイスを高速かつ静かにする

  • Androidエミュレータ: リソースを割り当ててください。小さなAVDは画面がカクつき、そのカクつきがクリップに残ります。 emulator -avd <name> -memory 6144 -cores 4 -gpu host -no-snapshot-save -no-boot-anim 同じアプリIDが異なる署名キーで既にインストールされている場合は、アンインストールする代わりに別のAVDを使用してください(アンインストールするとユーザーのデータが削除されます)。
  • リリースビルドをインストールして実行し、ログインします。録画前に、初回起動時のポップアップ、権限プロンプト、インタースティシャル広告を閉じてください。
  • $S statusbar on: 固定時間(APPDEMO_TIME、デフォルト9:41)、フルバッテリーとフル信号、通知アイコン非表示。$S statusbar off で元に戻します。
  • Androidでは、アプリのルート画面でシステムの戻るボタンを押さないでください。アクティビティが終了し、メモリ内のオーバーライド(プレミアムスイッチ、機能フラグ)は再起動時に失われます。

3. リハーサルをしてから録画する

  1. 各クリップを録画せずに一度リハーサルします。 タップ、座標、待機時間を習得します。画面を一度開くことでキャッシュもウォームアップされるため、本番のテイクの読み込みが速くなります。
  2. 録画:
    $S start 01_price_search
    # アプリを操作: adb shell input tap/swipe/text、xcrun simctl、またはUI自動化ツール
    $S stop 01_price_search        # -> $APPDEMO_OUT/01_price_search.mp4
    
    録画はホスト側で実行されます(adb emu screenrecord / simctl io recordVideo)。エミュレータでデバイス内の adb shell screenrecord を使用しないでください。アプリとCPUを競合し、UIがフリーズしてスクロールやタップが表示されなくなる可能性があります。
  3. クリップのアクションは、タップごとに1回のツール呼び出しではなく、短いスリープ(0.5〜2.5秒)を挟んだ1つのバッチとして送信します。ステップ間で画面を検査すると、テイク内に長い無駄な時間が残ります。
  4. スクロールは意図的に段階的に行います(画面の約40%、スワイプあたり600〜800ミリ秒)。視聴者が読めるようにするためです。
  5. 非ASCIIテキスト(韓国語、絵文字)にはUIドライバーのテキスト入力を使用します。adb shell input text はASCIIのみを処理します。
  6. 機能がデータ(台帳、日記、カート)でのみ価値を示す場合、現実的なエントリを作成して録画し、すぐに削除して、画面が元の状態に戻ったことを確認します。最初に共有のデフォルト設定を確認してください。新しい投稿が公開される可能性があります。

4. すべてのクリップを確認する

$S strip $APPDEMO_OUT/01_price_search.mp4 /tmp/01.jpg 8

スクリプトではなく、ストリップ画像を見てください。意図した各ステップが実際に行われたこと(スクロールが動いた、タブが切り替わった、結果が表示された)を確認し、不要なものが画面に映っていないことを確認します。トースト、キーボードで隠れたコンテンツ、広告、実際の住所などの個人データ、デバッグバナーなど。失敗したクリップは再録画してください。アクションが何も実行しなかったクリップを出荷しないでください。

5. 待機時間をカットする

$S tighten in.mp4 out.mp4          # アイドルリードインカット、フリーズ部分 -> 0.35秒、最終結果画面は1.5秒保持
$S speed  in.mp4 out.mp4 1.3       # オプションの均一なスピードアップ

tighten は、最初の実際のアクションの0.4秒前からクリップを開始し(start 後のアイドル秒は完全に静止していることはないため、フリーズ検出だけでは見逃されます)、画像が変化しないすべての部分を短縮します。これにより、タップがアプリを知っている人のように連続して行われます。通常、クリップの長さは約半分になります。tighten したクリップも strip で確認してください。小さな変更(数字の入力、チップのトグル)がカットされた場合は --noise を下げ、ポーズが残っている場合は --min-freeze を下げてください。

6. 納品する

すべてを1つのフォルダにまとめます。生のクリップ、タイト化したバージョン(編集用に推奨)、各クリップの一覧、その内容、ユーザーが知っておくべきこと(作成および削除したデータ、表示される個人データ、エミュレータのカメラ切り欠きが上部にあるなど)を記載した短いREADME。クリップの長さ、録画できなかったものとその理由を報告します。

関連スキル