メインコンテンツへ移動
AIチュートリアル

claude-kitでClaude Codeのワークフローをよりスマートに構築

claude-kitが、計画ワークフロー「savvy-flow」とインターフェース「savvy-progress」によってClaude Codeを拡張する方法を紹介します。このチュートリアルでは、マーケットプレイスと手動インストール、プラグインの名前空間、セッション設定、検証、実践的な使用パターンについて解説します。

claude-kitでClaude Codeのワークフローをよりスマートに構築

claude-kitが提供するもの

claude-kitは、Claude Code向けの独立したスキル、エージェント、モッドのコレクションです。各項目はリポジトリのplugins/ディレクトリに配置されているため、必要な機能だけをインストールできます。

  • savvy-flow:セッションでタスクを計画し、階層化されたワーカーサブエージェントに作業を委任して、結果をレビューできるスキルとエージェントのパッケージです。手動でインストールした場合は/savvy-flowで、マーケットプレイス経由でインストールした場合はプラグインの名前空間を付けて呼び出します。
  • savvy-progress:プロンプトの上に進捗バーとライブのエージェントパネルを追加するモッドです。savvy-flow向けに設計されていますが、任意のサブエージェントも表示できます。

2つのプラグインは独立して動作します。両方をインストールすると、savvy-flowが進捗バーを動かし、そのワーカーがエージェントパネルに進捗を報告します。

マーケットプレイスからclaude-kitをインストールする

マーケットプレイス方式は、Claude Codeにプラグインをインストールする最も簡単な方法です。

  1. Claude Codeを開きます。
  2. リポジトリをマーケットプレイスとして追加し、必要なプラグインをインストールします。
/plugin marketplace add johnnyvizz/claude-kit
/plugin install savvy-flow@claude-kit
/plugin install savvy-progress@claude-kit

インストール後にセッションを再起動します。マーケットプレイスからインストールしたスキルとエージェントには名前空間が付きます。そのため、savvy-flowスキルは/savvy-flow:savvy-flowとして呼び出し、エージェントにはsavvy-flow:savvy-carefulのような名前を使用します。

ワークフローに合う場合は、1つのプラグインだけをインストールすることもできます。計画ワークフローと視覚的な進捗インジケーターを連携させたい場合は、両方をインストールしてください。

コンポーネントを手動でインストールする

手動インストールは、スキルをClaude Codeの設定にコピーしたい場合や、ローカルチェックアウトからモッドを直接読み込みたい場合に便利です。

リポジトリをクローンする

git clone https://github.com/johnnyvizz/claude-kit.git ~/claude-kit

savvy-flowのスキルとエージェントをコピーする

この方法でインストールする場合、スキルにプラグインシステムは必要ありません。スキルフォルダーをClaude Codeのスキルディレクトリにコピーします。

cp -R ~/claude-kit/plugins/savvy-flow/skills/savvy-flow ~/.claude/skills/

次に、用意されているエージェント定義をエージェントディレクトリにコピーします。

cp ~/claude-kit/plugins/savvy-flow/agents/*.md ~/.claude/agents/

この方法では名前が短いままになります。スキルには/savvy-flowを、エージェントにはsavvy-carefulのような名前を使用します。

1つのセッションでsavvy-progressを読み込む

特定のClaude Codeセッションでのみ進捗モッドを読み込むには、プラグインディレクトリを指定してClaude Codeを起動します。

claude --plugin-dir ~/claude-kit/plugins/savvy-progress

すべてのセッションでsavvy-progressを読み込む

デスクトップアプリを含むすべてのセッションでモッドを利用できるようにするには、~/.claude/settings.jsonでCLAUDE_CODE_PLUGIN_DIRSを設定します。

{
  "env": {
    "CLAUDE_CODE_PLUGIN_DIRS": "~/claude-kit/plugins/savvy-progress"
  }
}

複数のプラグインフォルダーを設定する場合は、:で区切ります。CLAUDE_CODE_PLUGIN_DIRSにすでに値がある場合は、既存のエントリを置き換えずに新しいフォルダーを追加します。

基本的なワークフローを実行する

savvy-flowをインストールしたら、計画と調整を行うタスクを渡します。たとえば、手動でコピーしたスキルの場合は次のようにします。

/savvy-flow review the authentication changes and identify missing tests

マーケットプレイスからインストールした場合は、名前空間付きの形式を使用します。

/savvy-flow:savvy-flow review the authentication changes and identify missing tests

セッションモデルは作業を計画し、ワーカーサブエージェントにタスクを委任して、その出力をレビューします。savvy-progressも有効になっている場合は、進捗バーとエージェントパネルでその活動をリアルタイムに確認できます。

具体的なタスクは自由に選べます。計画と作業の委任が役立つコードレビュー、調査、その他の開発タスクを渡してください。

リポジトリの構成を理解する

各プラグインは予測可能な構造に従います。マーケットプレイスカタログとプラグインマニフェストによって、Claude Codeがコンポーネントを検出する方法が定義されています。

.claude-plugin/marketplace.json   カタログ。`/plugin marketplace add`が読み取る
plugins/<name>/
  .claude-plugin/plugin.json      マニフェスト
  skills/<skill>/SKILL.md         スキル
  agents/*.md                     同梱されるサブエージェント
  hooks/hooks.json                モッド:フックモジュールを指定
  hooks/register.tsx              モッド:モジュール本体
  types/index.d.ts                モッド:$.stateコントラクト

この構成では、スキルはSKILL.mdファイルで記述され、エージェント定義を同梱できます。モッドはフック設定と登録モジュールを使用し、その型宣言で$.stateコントラクトを文書化します。

公開前にプラグインを検証する

Claude Codeの検証コマンドを使用して、個別のプラグインまたはマーケットプレイスカタログを確認します。

claude plugin validate plugins/<name>
claude plugin validate .

最初のコマンドはプラグインディレクトリを検証します。2つ目のコマンドは、リポジトリのルートからカタログを検証します。

手動インストールを最新の状態に保つ

クローンしたリポジトリからモッドを直接読み込む場合は、次のコマンドで更新します。

cd ~/claude-kit
git pull

そのディレクトリから読み込まれたmodは、更新されたファイルを使用します。~/.claude/skills/にコピーしたスキルは自動更新されないため、新しい変更を取り込んだ後は、スキルとエージェントのファイルをもう一度コピーしてください。

高度な考慮事項

名前空間付きコマンドと短いコマンドを意図的に選ぶ

Marketplaceからのインストールでは、/savvy-flow:savvy-flowのような名前空間付きの名前によってプラグインが分離されます。手動でスキルをインストールするとプラグインシステムを介さず、コマンドを短く保てます。Marketplaceでの管理を優先するか、ローカルファイルへ直接アクセスするかに応じて、最適な方法を選んでください。

modの互換性を考慮する

modはhooks/register.tsxを通じて関数フックを使用します。これはClaude CodeのアーリーアクセスAPIです。このリポジトリはClaude Code 2.1.286でテストされていますが、APIはリリースごとに変更される可能性があります。

Marketplaceからインストールしたmodが表示されない場合は、--plugin-dirを使って手動で読み込むか、CLAUDE_CODE_PLUGIN_DIRSでそのフォルダーを設定してください。

可視性が必要な場合はプラグインを組み合わせる

savvy-flowはsavvy-progressなしで動作でき、savvy-progressもsavvy-flowなしで動作できます。両方をインストールする構成が最も情報量に優れています。ワークフローがタスクを調整し、modが進捗とアクティブなエージェントの状態を表示します。

まとめ

claude-kitは、Claude Codeユーザーにモジュール式の計画、委任、レビュー、進捗監視のためのツールを提供します。管理された構成にするにはMarketplaceからsavvy-flowとsavvy-progressをインストールするか、リポジトリをクローンしてコンポーネントを手動でコピーまたは読み込んでください。名前空間の違いを確認し、公開前に変更を検証するとともに、コピーしたスキルはリポジトリから読み込んだmodとは別に更新してください。