Claude Codeにスキルを追加する方法【初めてでもできます】

Claude Codeにスキルを追加する方法【初めてでもできます】

Claude Codeに「スキル」を覚えさせると、日本語で頼むだけでPowerPointの資料が出てくるようになります。ただ、使えるようにするまでに最初の1回だけ準備が必要です。

この記事では、その準備を順番に書きます。ターミナルを使ったことがない方に向けて書いているので、画面の説明も省いていません。作業そのものは、慣れていなくても10分ほどで終わります。

いちばん簡単なのは、Claudeにやってもらう方法です

先に結論を書きます。ダウンロードしたzipファイルを、Claude Codeにドラッグ&ドロップして「このスキルファイルを覚えて」と頼むだけです。解凍も、置き場所も、Claudeがやってくれます。

ただし、その前にひとつだけ自分でやることがあります。そこから順番に見ていきます。

準備Node.js が入っているか確かめる(入っていなければ入れる)
STEP1zipをClaude Codeにドラッグ&ドロップする
STEP2「このスキルファイルを覚えて」と頼む
STEP3Claude Codeを開き直して、日本語で頼む
トミー

僕もこのやり方で入れました。
「解凍して、隠しフォルダを探して、そこに置いて…」を全部Claudeに任せられるので、いちばん迷いません。

はじめに確認してください

ひとつだけ、先に確かめてほしいことがあります。このスキルが動くのはClaude Codeです。ブラウザで開く claude.ai(チャット画面)では動きません。

Claude Codeは、パソコンにインストールして使うClaudeです。ターミナル版とデスクトップアプリ版があり、どちらでも構いません。MacでもWindowsでも動きます。

Claude Codeを起動した画面
Claude Codeを起動した画面。ここにzipを渡します。

【準備】Node.js が入っているか確かめる

Node.js は、パソコンの中でプログラムを動かすための土台です。PowerPointを書き出すときに使うので、これだけは先に入れておく必要があります。ここはClaudeには代わってもらえません(インストールに管理者の権限が要るためです)。

すでに入っている方も多いので、まず確認から始めます。

ターミナルを開く

Mac の場合は、画面右上の虫めがねマーク(Spotlight)をクリックして「ターミナル」と入力し、出てきたアプリを開きます。Windows の場合は、スタートボタンの横の検索欄に「コマンドプロンプト」と入力して開きます。

黒い画面(Macでは白いこともあります)が出てきたら、それで合っています。

ターミナルを開いた直後の画面
ターミナルを開いた直後。この画面が出ればOKです。
トミー

「ターミナル」と聞いた時点で身構える方、多いと思います。
僕も最初はそうでした。ただ、ここで打つのは1行だけですし、間違えてもパソコンは壊れません。安心して進めてください。

1行打って、Enterを押す

node -v

v22.11.0 のように、v で始まる数字が出てくれば入っています。STEP1へ進んでください。

「command not found」や「認識されていません」と出た場合は、まだ入っていません。Node.jsの公式サイトを開いて、案内に従ってダウンロードしてください。インストールが終わったらターミナルをいったん閉じて、もう一度開いてから node -v を打ち直します。

node -v を実行してバージョンが表示されたところ
v で始まる数字が出れば、Node.js は入っています。

【STEP1】zipをClaude Codeにドラッグ&ドロップする

ここからが本題です。といっても、やることはほとんどありません。

Claude Codeを開いて、ダウンロードしたzipファイルを、入力欄にドラッグ&ドロップします。解凍は必要ありません。zipのまま渡して大丈夫です。

zipファイルをClaude Codeの入力欄にドラッグしているところ
zipのまま、入力欄にドラッグ&ドロップします。解凍は不要です。

【STEP2】「このスキルファイルを覚えて」と頼む

ファイルを渡したら、そのまま日本語で頼みます。

このスキルファイルを覚えて

これだけです。Claudeがzipを解凍して、中身を確認して、決まった場所に置いてくれます。どこに置けばいいかを自分で調べる必要はありません。

途中で「このコマンドを実行していいですか」と確認されることがあります。内容を見て、問題なさそうであれば許可してください。ファイルを解凍したり、フォルダを移動したりするための確認です。

「このスキルファイルを覚えて」と入力したところ
ファイルを渡したら、日本語でこう頼むだけです。

PowerPointを書き出すための部品(pptxgenjs)が入っていない場合は、それもあわせて入れておいてと頼めば、Claudeが実行してくれます。自分でやる場合は、ターミナルで次の1行です。

npm install -g pptxgenjs
npm install -g pptxgenjs を実行して完了したところ
pptxgenjs のインストールが終わった状態。最初の1回だけの作業です。

これは最初の1回だけの作業です。2つ目、3つ目のスキルを入れるときは、もう必要ありません。

ちゃんと入ったか確かめる

入ったかどうかは、そのままClaudeに聞くのがいちばん早いです。フォルダを探しにいく必要はありません。

スキルがちゃんと入っているか確認して

Claudeが置き場所を見にいって、入っているかどうかを教えてくれます。もし置き方が間違っていれば、そのまま直してもらえます。「直しておいて」と頼めば大丈夫です。

スキルがちゃんと入っているか確認した結果
置き場所・SKILL.md・Node.js・pptxgenjs をまとめて確認してくれます。

自分の目でも確かめたい方へ

正しく入っていると、こういう状態になっています。

Mac      ~/.claude/skills/blue-deck/SKILL.md
Windows  C:\Users\(ユーザー名)\.claude\skills\blue-deck\SKILL.md

大事なのは、スキル名のフォルダの直下に SKILL.md というファイルがあることです。フォルダが二重になっていたり、LICENSE.txt などが一緒に置かれていたりすると、うまく読み込まれないことがあります。

スキルフォルダのありか

【STEP3】Claude Codeを開き直して、頼んでみる

Claude Codeをいったん終了して、もう一度開きます。開き直さないと、入れたばかりのスキルが読み込まれません。ここを忘れて「動かない」と思ってしまう方が多いところです。

あとは、ふだんの言葉で頼むだけです。コマンドを覚える必要はありません。

ブルーverで、新サービスの提案書を作って

Claudeがスキルを読み込んで、内容に合わせてページを組み立て、PowerPointファイルを書き出してくれます。何を大きく見せるか、どこを図解にするかといった判断は、スキルの中に書いてあるものが使われます。

ブルーverで〜作って」と入力したところ
書き出されたPowerPointの表紙

どんなものが出てくるか先に見たい場合は、「このスキルのサンプルを作って」と頼んでください。同梱の見本データで、全ページが出力されます。

うまくいかないときは

つまずきやすいところは、だいたい決まっています。

「Cannot find module ‘pptxgenjs’」と出る

いちばん多いのがこれです。PowerPointを書き出す部品が入っていません。Claudeに「pptxgenjs を入れて」と頼むか、ターミナルで次を実行してください。

npm install -g pptxgenjs

スキルが反応しない

まず、Claude Codeを開き直したかを確認してください。それでも反応しない場合は、置き場所です。skills の直下にスキル名のフォルダがあり、その中に SKILL.md がある状態かを見てください。

そもそも反応が違う

ブラウザの claude.ai を開いていないか確認してください。見た目は似ていますが、ブラウザ版はパソコンの中のファイルを読めないので、スキルは動きません。

自分でフォルダを置きたい方へ

Claudeに任せず、自分で置くこともできます。中で何が起きているかを知っておきたい方や、うまくいかなかった方向けに書いておきます。

zipファイルをダブルクリックして解凍すると、中にスキル名のフォルダ(たとえば blue-deck)が入っています。このフォルダごと、次の場所に移動します。

zipを解凍して blue-deck フォルダが出てきたところ
解凍すると、zipの隣にスキル名のフォルダができます。動かすのはこのフォルダです。
Mac      ~/.claude/skills/blue-deck/
Windows  C:\Users\(ユーザー名)\.claude\skills\blue-deck\

skills というフォルダが見当たらない場合は、新しく作ってください。名前は半角で skills です。同梱の LICENSE.txt や「はじめにお読みください」は、ここには入れません。

「.claude」が見つからないとき

自分で置くときにいちばんつまずくのがここです。.claude は先頭にドットが付いていて、ふだんは隠れているフォルダだからです。

Macでは、Finderを開いた状態で Command + Shift + .(ドット) を押すと、隠れているフォルダが表示されます。もう一度押すと元に戻ります。Windowsでは、エクスプローラーの「表示」メニューから「隠しファイル」にチェックを入れます。

一度入れてしまえば、次からは1分です

ここまで読むと長く感じたかもしれませんが、Node.jsとpptxgenjsは最初の1回だけの作業です。2つ目のスキルを入れるときは、zipをドラッグして「覚えて」と頼んで、Claude Codeを開き直すだけになります。

最初の1回さえ越えてしまえば、あとは日本語で頼むだけです。

実際に使えるスキル

KAKERUデザインでは、20年以上の制作で使ってきたデザインの判断基準を、Claudeが読める形にまとめたスキルを公開しています。何を大きく見せるか、どこを比較にするか、余白をどう使うか。毎回こまかく指示を出さなくても、同じ考え方で資料が組み上がります。

CLAUDE CODE SKILL

プレゼン資料作成スキル:ブルーver

白ベースに青の差し色。社内提案から顧客提案まで、通年で使える主力のスキルです。「ブルーverで企画書を作って」と日本語で伝えるだけで、9種類のレイアウトから中身に合ったページを組み、PowerPointで書き出します。見本の企画書と素材一式も入っているので、届いたその日に中身を確認できます。

1,980(税込)

買い切り/購入後すぐダウンロード

このスキルを購入する

ご購入前にご確認ください。このスキルは Claude Code(ターミナル版・デスクトップアプリ版)で動きます。ブラウザ版の claude.ai では動作しません。ほかに Node.js と、PowerPointを書き出すための部品(npm install -g pptxgenjs)が必要です。この記事の手順どおりに進めれば入ります。

CLAUDE CODE SKILL

プレゼン資料作成スキル:ハロウィンver

オレンジ×パープルの季節向け。社内イベントやSNSキャンペーンの企画書に向いています。はじめてスキルを試す方の入口として、価格を抑えています。使い方はブルーverとまったく同じなので、この記事の手順がそのまま使えます。

980(税込)

買い切り/購入後すぐダウンロード

このスキルを購入する

ご購入前にご確認ください。このスキルは Claude Code(ターミナル版・デスクトップアプリ版)で動きます。ブラウザ版の claude.ai では動作しません。ほかに Node.js と、PowerPointを書き出すための部品(npm install -g pptxgenjs)が必要です。この記事の手順どおりに進めれば入ります。

あわせて読んでほしい記事

実際にどんな資料ができるのか、なぜこういう作り方をしているのかは、こちらに書いています。

Claudeで企画書を作ったら、ここまでできた|デザイン判断をSkill化して資料作成
NEXORA企画書サンプル 表紙
ページの目的ごとにレイアウトを変えた4例
Claude Codeにスキルを追加する方法【初めてでもできます】

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA