前回は CLAUDE.md でプロジェクトのルールを AI に伝える方法を紹介しました。ルールを決めたら、次は Claude Code 自体の動き方を設定する 番です。
Claude Code には3つの拡張機能があります。Skill（カスタムコマンド）、Hook（自動ガードレール）、MCP（外部ツール接続）。設定にかかる時間は合計15分ほど。たったそれだけで、AI の作業品質とスピードが大きく変わります。
Skill — 毎回5分の引き継ぎ確認を10秒に
Skill は Claude Code のカスタムコマンドです。プロジェクト内の .claude/commands/ フォルダにマークダウンファイルを1つ置くだけで、/コマンド名 で呼び出せます。
弊社で最も効果が大きかったのは /start-session と /end-session の2つです。
/start-session — AI に「前回の続き」を思い出させる
AI は新しいセッションを始めるたびに、前のセッションの記憶を失います。毎回「前回どこまでやったか」を人間が説明し直すのは手間です。そこで、セッション開始時に AI が自動で確認すべき項目をコマンド化しました。
セッション開始時に以下を順番に確認してください。
1. memory/ のインデックスを読んで前回の記憶を把握する
2. docs/tasks.md を読んで残タスクと優先度を確認する
3. docs/logs/ の最新エントリを読んで前回の作業内容を把握する
4. 結果を簡潔に報告する/start-session と打つだけで、AI が自分でファイルを読み、「前回はここまで完了。今日の優先タスクはこれ」と報告してくれます。
/end-session — セッションの学びを自動で記録
終了時はさらに重要です。AI がセッション中に得た学び・タスクの進捗・作業ログを自動で記録します。この記録が次回の /start-session で読まれるため、セッションをまたいでも AI が文脈を失わない仕組み になっています。
弊社では60回を超えるセッションを重ねましたが、AI は毎回「前回どこまでやったか」を正確に把握しています。この2つのコマンドだけで、毎回5分かかっていた引き継ぎ確認が10秒で終わるようになりました。
Hook — 「CLAUDE.md に書いても守らない」を物理的に防ぐ
CLAUDE.md にルールを書いても、AI が100%守るとは限りません。特にファイルの保存先や操作の制限は、セッションが長くなると忘れることがあります。
Hook はこの問題を解決します。AI がツールを実行する 直前 に自動でチェックスクリプトを走らせ、ルール違反があればその操作自体を拒否します。
弊社での実例を紹介します。Playwright（ブラウザ自動操作ツール）で頻繁にスクリーンショットを撮るのですが、AI が保存先をホームディレクトリにしてしまい、画像ファイルが散乱する問題がありました。
CLAUDE.md に「screenshots/ フォルダに保存して」と書いてもたまに忘れる。そこで Hook を設定しました。
動作の流れ:
- AI がスクリーンショットを保存しようとする
- Hook が保存先パスをチェック
screenshots/フォルダ以外なら → 自動で拒否、正しい保存先を AI に通知- AI が保存先を修正して再実行
CLAUDE.md が「お願い」なら、Hook は「強制」です。設定は ~/.claude/settings.json にチェック対象のツール名とスクリプトのパスを登録するだけ。スクリプト自体は10行程度のシェルスクリプトです。
Hook を書くときの注意点が1つあります。 チェックロジックは JSON の中に直接書かず、外部のシェルスクリプトに切り出してください。JSON 内にシェルコマンドを書くとエスケープの問題で動かなくなります。
MCP — AI が WordPress とブラウザを直接操作する
MCP（Model Context Protocol）は、AI が外部ツールを直接操作できるようにするプラグインです。弊社では2つの MCP を常用しました。
WordPress MCP — 管理画面を開かずに記事を投稿
AI が WordPress の管理画面を ブラウザなしで 直接操作します。記事の作成・更新・画像アップロードがすべてコマンドラインから完結します。
たとえば、このブログ記事自体も WordPress MCP で投稿しています。AI が下書きを作成し、slug を設定し、公開ステータスに変更するまで、ブラウザを1回も開いていません。
Playwright MCP — AI が自分の作業結果を目で確認する
ブラウザの自動操作ツール Playwright を AI に接続します。スクリーンショット撮影、DOM の検査、JavaScript の実行が可能です。
これが最も効果的だった MCP です。 CSS を変更した後、AI 自身がブラウザでページを開き、スクリーンショットを撮り、「意図通りに表示されているか」を確認します。問題があれば自分で修正して再確認する。このサイクルを人間が介入せずに回していました。
弊社のリニューアルでは、14ページ分のレスポンシブ対応を AI がこの方法で自律的に進めました。人間がやるのはスクリーンショットを見て「OK」と言うだけです。
3つの拡張の使い分け
| 拡張 | 役割 | 弊社での効果 |
|---|---|---|
| Skill | 定型作業の自動化 | 引き継ぎ確認を毎回5分→10秒に |
| Hook | ミスの物理的ブロック | ファイル散乱ゼロに |
| MCP | 外部ツールとの接続 | CSS確認の自律化・WP投稿の自動化 |
CLAUDE.md が「AI に方針を伝える」ものなら、Skill・Hook・MCP は「AI の手足を拡張する」ものです。方針と実行環境の両方が揃って初めて、AI は人間の代わりに作業を回せるようになります。
次回予告
ここまでは AI を1人で動かす話でした。第4回では Claude Code のチーム機能 を使って、PM・コーダー・デザイナーを並列稼働させた話をします。
AI を活用したWEB制作に興味をお持ちですか？ Skill・Hook・MCP の設定を含めた導入支援も行っています。