skill-recorder 徹底入門|画面操作を録画するだけでGitHub Copilot CLIのAIスキルを自動生成する

約18分で読めます by ぽんたぬき
skill-recorder 徹底入門|画面操作を録画するだけでGitHub Copilot CLIのAIスキルを自動生成する

skill-recorder 徹底入門|画面操作を録画するだけでGitHub Copilot CLIのAIスキルを自動生成する

1. はじめに:その反復作業、もう「一度やって見せる」だけでいい

毎週同じフォームを埋めていませんか?

週次レポートの提出、経費申請フォームへの入力、プロジェクト管理ツールへのチケット起票——こうした定型業務は「手順書を書いた」「マニュアルを整備した」ところで、結局のところ毎回人が手を動かしています。RPAで自動化しようとしたものの、画面レイアウトが変わるたびにスクリプトが壊れ、メンテナンスコストが本来の業務以上にかかる、という経験をお持ちの方も多いのではないでしょうか。

そのボトルネックを、Microsoftが公開したOSSツール skill-recorder が根本から変えようとしています。

skill-recorder とは何か(30秒サマリー)

skill-recorderは、MITライセンスで公開されたデスクトップアプリです。コンセプトは非常にシンプルです。

「一度やってみせれば、AIエージェントが繰り返し実行できる」

画面操作を録画すると、GitHub Copilot CLIがその内容を解析し、SKILL.mdという形式のAIスキルを自動生成します。生成されたスキルは、Copilot CLIから呼び出すだけで実行できます。

この記事のゴールと前提条件

この記事では、インストールから自作スキルをCopilot CLIで実行するまでを段階的に解説します。

前提条件:

  • Node.js 24 以上がインストール済み
  • macOS / Ubuntu / Windows のいずれかを使用
  • GitHub Copilot が利用可能なアカウントを持っている

所要時間は一度通して読めば約30分、実際に手を動かしながら進めると1〜2時間程度が目安です。


2. skill-recorder の仕組みを3ステップで理解する

Record → Analyze → Generate という流れ

skill-recorderの動作は、以下の3ステップに整理できます。

[Record]  画面操作を録画
   ↓  クリック / ウィンドウ切替 / URL / クリップボード / 音声(99言語対応)
[Analyze] GitHub Copilot CLI が分析
   ↓  「意図」+「順序付きステップリスト」を自動抽出
[Generate] スキル or 自動化を生成
   ↓  SKILL.md(オンデマンド実行) or Automation(スケジュール実行)

Record:何が記録されるのか

録画フェーズでは、クリック座標だけでなく以下の情報が収集されます。

  • アクセスしたURLとウィンドウの遷移履歴
  • クリップボードにコピーされた内容
  • 画面の操作ログ(クリック・入力・スクロール)
  • 音声ナレーション(99言語対応)

特に音声が重要です。「ここで先月の日付を入れます」と喋りながら操作すると、その発言が「可変値の補足説明」としてスキルに反映されます。

Analyze:「操作」を「意図」に翻訳する

単なる操作ログを再生するのではなく、Copilot CLIがその操作列から「目的(intent)」と「順序付きステップ」を抽出します。ここが従来のRPAや画面キャプチャ再生との決定的な違いです。

Generate:Skill と Automation の使い分け

生成物 実行タイミング 向いている業務
SKILL.md オンデマンド(呼び出し時) 都度発生する定型作業
Automation スケジュール実行 週次・月次のレポート業務

プライバシー設計

プライバシーについても明確な設計がなされています。録画中の処理はすべてローカルで完結し、音声文字起こしもオンデバイス処理のみです。クラウドへデータが送信されるのは「Analyze」を選択したタイミングだけです。


3. 【準備編】インストールと初期セットアップ

Step 1:Node.js 24 を用意する

まずNode.jsのバージョンを確認します。

# Node.js インストール後に確認
node --version
# v24.x.x が表示されること

バージョンが古い場合は、nvmまたはvoltaでアップグレードしてください。

# nvm を使う場合(nvm 未インストールの場合はまず nvm をインストール)
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"
[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion"
nvm install 24
nvm use 24

# volta を使う場合(volta 未インストールの場合はまず volta をインストール)
# curl https://get.volta.sh | bash
# export VOLTA_HOME="$HOME/.volta"
# export PATH="$VOLTA_HOME/bin:$PATH"
# volta install node@24

よくある落とし穴: Node.js 22以下では起動時にエラーが発生します。必ずv24以上を用意してください。

Step 2:skill-recorder を導入する

GitHubリポジトリからクローンしてビルドします。

# nvm のシェル環境を再読み込みしてから実行
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"
nvm use 24

git clone https://github.com/microsoft/skill-recorder.git
cd skill-recorder
npm install
npm run build

各OSの注意点は以下のとおりです。

  • macOS:Xcodeコマンドラインツールが必要な場合があります(xcode-select --install
  • Ubuntulibgtk-3-dev などのシステムライブラリが必要になるケースがあります
  • Windows:Windows Build Tools(npm install --global windows-build-tools)を事前にインストールしてください

Step 3:GitHub Copilot CLI を接続する

GitHub CLI(gh)をインストールし、認証を済ませます。

# gh コマンドの認証確認
gh auth status

# 未認証の場合はログイン
gh auth login

# GitHub Copilot CLI 拡張をインストール
gh extension install github/gh-copilot

正常に動作するか確認します。

gh copilot --version

Step 4:画面収録・アクセシビリティ権限を許可する

macOS の場合、「システム設定」→「プライバシーとセキュリティ」→「画面収録」と「アクセシビリティ」の両方でskill-recorderを許可してください。許可しないと録画が開始できません。

Windows の場合は、ユーザーアカウント制御(UAC)の確認ダイアログが表示された際に「はい」を選択します。

Ubuntu の場合は、X11またはWayland環境に応じた権限設定が必要です。

Step 5:録画ショートカットを覚える

OS 録画開始ショートカット
macOS ⌘⇧R
Windows Ctrl+Shift+R

4. 【実践編】最初のスキルを作る:週次レポート提出を自動化する

Step 1:録画するタスクを設計する

最初の録画では、以下の基準でタスクを選ぶと成功率が上がります。

  • 開始条件と完了条件が明確なもの(例:「ポータルを開く」→「送信ボタンを押す」)
  • 5〜10ステップ程度の小規模なもの
  • 毎回ほぼ同じ手順で完結するもの

週次レポートの提出を例に進めます。

Step 2:録画前のチェックリストを確認する

録画を開始する前に以下を確認してください。

  • 不要なタブ・ウィンドウを閉じている
  • 通知(Slack・メール)をオフにしている
  • パスワードやAPIキーが表示される操作を含まない(詳細は後述)

Step 3:音声ナレーションを添えながら操作する

ショートカット(⌘⇧R)で録画を開始したら、実際の操作をしながら口頭で補足します。

「レポートポータルにアクセスします」
→(URLを入力してEnter)

「週次レポートフォームを開きます」
→(フォームのリンクをクリック)

「ここには毎回、前週の月曜日の日付を入れます」
→(日付フィールドに入力)

「集計した売上数値を入力します。この値は毎週変わります」
→(数値フィールドに入力)

「内容を確認してから送信ボタンを押します」
→(送信ボタンをクリック)

「毎回変わる」「前週の」という発言が汎化のヒントになります。音声で補足するほど、生成されるスキルの精度が上がります。

Step 4:録画を停止し「Analyze」を実行する

再度ショートカットを押して録画を停止し、UIから「Analyze」を選択します。Copilot CLIが録画を解析し、意図とステップリストを抽出します。

画面に表示されたステップリストを確認し、意図が正しく読み取られているかを確認します。ズレている場合は録り直すか、ステップを手動修正します。

Step 5:SKILL.md を生成して中身を確認する

「Generate」を選ぶと、以下のようなSKILL.mdが生成されます。

---
name: submit-weekly-report
description: 週次レポートフォームに前週の数値を入力して送信するスキル
---

# 週次レポート提出スキル

## 前提条件
- レポートポータルへのアクセス権限があること
- 提出する週の集計データが手元にあること

## 手順

1. レポートポータル(https://example.com/report)にアクセスする
2. 「週次レポート入力」フォームを開く
3. 対象期間(前週月曜日〜日曜日)を入力する
4. 各指標の数値を入力する(売上・訪問数など)
5. 入力内容を確認する
6. 送信ボタンをクリックして完了する

namedescriptionの役割: descriptionの記述がスキルの呼び出し精度を大きく左右します。「何のためのスキルか」を端的かつ具体的に書いてください。

Step 6:スキルを適切な場所に配置する

生成されたSKILL.mdの配置場所は用途に応じて使い分けます。

# リポジトリ単位でチームと共有する場合
.github/skills/submit-weekly-report.md

# Claude Code から利用する場合
.claude/skills/submit-weekly-report.md

# 個人のグローバルスキルとして登録する場合
~/.copilot/skills/submit-weekly-report.md

Step 7:Copilot CLI から実行して動作確認する

gh copilot run submit-weekly-report

初回実行時に確認すべき3点:

  1. ステップの抜け:録画時と同じ操作が再現されているか
  2. 権限エラー:外部サービスへのアクセス権が正しく設定されているか
  3. 外部サービス認証:セッションが切れていないか

5. 【応用編】スキルを育てる・チームで共有する

gh skill コマンドでスキルを管理する

2026年4月にパブリックプレビュー化されたgh skillコマンドを使うと、スキルの検索・インストール・公開が可能です。

# 公開されているスキルを検索する
gh skill search "weekly report"

# スキルをインストールする
gh skill install <owner>/<skill-name>

# 自作スキルを公開する
gh skill publish submit-weekly-report

チームにスキルを配布して業務手順を標準化する

.github/skills/ディレクトリをリポジトリにコミットすることで、チーム全員が同じスキルを使えるようになります。これにより、属人化していた手順書を「実行可能な資産」に変換できます。

# スキルをリポジトリにコミットする
mkdir -p .github/skills
cp submit-weekly-report.md .github/skills/
git add .github/skills/
git commit -m "Add weekly report submission skill"
git push

Automation でスケジュール実行に切り替える

週次・月次のように実行タイミングが固定された業務は、オンデマンド実行から定期実行(Automation)に切り替えることを検討してください。Generate時に「Automation」を選択すると、cron形式のスケジュール設定が付加された形式で出力されます。


6. 押さえておきたい注意点とベストプラクティス

UIオートメーション(RPA)との決定的な違い

実際の開発現場では、「RPAとどう違うのか」という疑問がよく挙がります。最も重要な差異はここです。

skill-recorderが生成するのは、座標クリックの再生スクリプトではない

RPAツール(Seleniumベースのものを含む)は「このピクセル座標をクリック」という命令を再生します。そのため、画面レイアウトが少し変わるだけでスクリプトが壊れます。

skill-recorderは「週次レポートを送信する」という意図を抽出し、Copilot CLIがgh CLIweb_fetchなどエージェントネイティブなツールを使って目的を達成します。結果として、環境依存が少なく、UIの変更に対して堅牢です。

機密情報を録画しないためのルール

以下のケースは録画の前に必ず対処してください。

  • パスワードの入力:録画前にパスワードマネージャーで自動入力を済ませておく
  • APIキー・トークン:環境変数として別途管理し、録画中は参照のみにする
  • 個人情報・機密データ:マスキングするか、ダミーデータで操作する

社内展開時には、「録画前チェックリスト」をチームのルールとして明文化することをベストプラクティスとして推奨します。

生成された SKILL.md は必ずレビューする

自動生成されたSKILL.mdをそのまま使うのではなく、以下の観点でレビューする習慣をつけてください。

  • 意図しない削除・送信操作が含まれていないか
  • **可変値(日付・数値)**が正しく変数として扱われているか
  • 手順の順序が実際の業務フローと一致しているか

うまくスキルが生成されないときのトラブルシューティング

症状 原因 対策
ステップが欠落する 操作が速すぎる ゆっくり丁寧に操作する
意図の抽出がズレる 音声補足が不足 各ステップで口頭説明を加える
スキルが長すぎる ステップ数が多い 録画を複数に分割する

7. SKILL.md エコシステムという「本命」

Agent Skills はオープン仕様である

skill-recorderが生み出すSKILL.mdの背景には、GitHub Copilot CLIのAgent Skills仕様があります。そしてこれは、特定のツールに依存した独自仕様ではありません。

ベストプラクティスとして押さえておきたいのは、一度作ったスキルが複数のAIエージェントで動作するという点です。現時点で動作が確認されているホストは以下のとおりです。

  • GitHub Copilot CLI
  • Claude Code(.claude/skills/配下)
  • Cursor

ベンダーロックインを避けられるという価値

AIエージェントの世界は現在、急速に変化しています。「このエージェントに乗り換えたら、これまで作った自動化資産がすべて無駄になる」というリスクは、多くの企業が懸念するところです。

SKILL.md形式がオープン仕様であることは、エージェントを乗り換えてもスキル資産を継続利用できることを意味します。これは長期的な観点で非常に大きな価値です。

skill-recorder はエコシステムへの「入口」

SKILL.mdを手書きできる技術者は限られています。skill-recorderの本質的な価値は、**「スキルを書けない人でも、録画するだけでAIスキル資産を生み出せる」**という入口を提供している点にあります。

録画1回で、属人化した業務ノウハウを誰もが実行可能な形式に変換できる。これが、ブックマーク185件を集めた即実用性の正体です。


8. まとめ:反復作業を「録画1回」で資産化する

この記事では、以下のステップを段階的に解説しました。

  1. インストール:Node.js 24 + skill-recorder + GitHub Copilot CLI の環境構築
  2. 録画:音声ナレーションを添えた操作録画
  3. 解析:Copilot CLIによる意図とステップの抽出
  4. SKILL.md生成:AIスキルファイルの生成とレビュー
  5. 実行gh copilot runでのスキル実行
  6. 共有.github/skills/へのコミットによるチーム配布

明日から試せる最初の一歩

まずは自分だけが使う小さな定型作業を1つ選んで録画してみてください。週次レポートでも、特定サイトへのデータ入力でも構いません。「一度やって見せる」という体験が、AIエージェント自動化を自分事として理解する最短ルートです。


参考リンク

コメント

0/2000