Claude Codeのスキルとは｜「こんな画像を作っておいて」の一言で生成からHP反映まで終わる実例
先に結論です。Claude Codeに画像生成を「スキル」として組み込むと、ホームページ制作中に画像が必要になっても、「こんな感じの画像を作っておいて」と一言頼むだけで、画像の生成からサイトへの反映まで全部終わります。画像素材サイトを探し回ることも、生成AIのサイトを開いてダウンロードして、ファイルを移動して、コードに書き込むこともありません。
このサイトを4時間で作ったとき、みやっち🧑💻が画像まわりでやったことは、本当にこの一言だけでした。今日はその種明かしとして、「スキル」とは何か、なぜ一言で終わるのかをお話しします。
Claude Codeの「スキル」とは
スキルとは、Claude Codeに覚えさせる「業務の手順書」です。 「この種類の頼まれごとが来たら、この道具を、この手順で使う」という段取りをMarkdownのファイルに書いて渡しておくと、Claude Codeは依頼の内容から自分で手順書を選び、そのとおりに実行してくれます。
第3回の記事で、Claude Codeを仕事の基盤にする要素のひとつとして「Skills(手順書)」を紹介しました。ただ、こう説明しても「で、それが何の役に立つの?」とピンと来ない方が多いのも事実です。今回の画像生成は、その答えとしてわかりやすい実例だと思います。
「こんな感じの画像を作っておいて」で本当に終わる
このサイトを作っている最中、トップページの背景や挿絵など「画像がいろいろ欲しいな」という場面が何度もありました。そのたびにみやっち🧑💻がやったのは、Claude Codeにこう言うだけです。
「信頼感のある、海と船のイメージの画像を作っておいて」
すると、Claude Codeは勝手に画像生成のスキル(手順書)を開き、勝手にプロンプトを組み立てて画像を生成し、勝手にファイルを正しい場所に保存して、勝手にホームページのコードにまで反映してくれます。みやっち🧑💻が次に見るときには、もうサイトに画像が表示されている状態です。
従来なら、この間に挟まっていた作業を思い出してください。
- 画像生成AIのサイトを開く
- プロンプトを考えて入力する
- 生成された画像をダウンロードする
- ファイル名を整えて、プロジェクトのフォルダに移動する
- サイズを調整して、コードに画像のパスを書き込む
1枚なら大した手間ではありません。でもサイト制作では画像は何枚も必要になり、そのたびに作業の流れが中断されます。この「手が止まる時間」が丸ごと消えるのが、スキル化の効果です。実際、このサイトのトップページの背景も、ブログ記事のサムネイル背景も、すべてこの方式で作っています。
きっかけは「みやっちペット」という遊び
このスキルが生まれたきっかけは、正直に言うと遊びです。
あるとき、AIに自分の分身キャラクター「みやっちペット」を作らせてみました。ただの思いつきだったのですが、自分のためのキャラクターをAIがその場で描いてくれると、一気に「パーソナルなAIエージェント」という感覚が出てきます。道具ではなく相棒に近づく瞬間です。
そこで「この画像生成、毎回お願いするんじゃなくて、手順書にして組み込んでおけばいいのでは」と気づき、スキルとして整備しました。遊びで触っていたものが、ホームページ制作という実務でフル稼働する道具に化けたわけです。AIの活用は、こういう「遊びから実務への昇華」がよく起きます。最初から業務効率化を狙うより、まず面白がって触るほうが結果的に近道だったりします。
仕組み: 手順書とちいさなスクリプトだけ
中身は驚くほど単純です。専門用語が苦手な方は、この章は雰囲気だけ掴んでもらえれば大丈夫です。
みやっち🧑💻の image-gen-codex というスキルは、次の2つでできています。
- 手順書(Markdownファイル): 「画像を作ってと頼まれたら、依頼内容を英語のプロンプトに翻訳し、保存先のファイル名を考えて、スクリプトを呼び出す」という段取りを日本語で書いたもの
- 小さなシェルスクリプト: 画像生成AI(Codex CLIに内蔵されたもの)を呼び出して、できた画像を指定の場所に保存するもの
ポイントは、新たな契約や支払いが増えないことです。本来、プログラムから画像生成AIを使うには、APIキーを発行して「使った分だけ支払う」従量課金の設定が必要です。しかしCodexには、APIキーの代わりにChatGPTアカウントでサインインする方式が用意されていて、利用分はいまのChatGPTプランの範囲内に含まれます。手元にある道具を手順書でつなぎ直しただけです。
この仕組みは、講座の全体ライブでも受講生向けに解説しました。「コードが書けないと無理そう」と思うかもしれませんが、手順書もスクリプトも、Claude Code自身に「こういうスキルを作って」と頼んで作らせたものです。
本質は「ツールの足し算」ではなく「ワークフローの統合」
ここが今日いちばんお伝えしたいことです。
画像生成AI単体なら、もう誰でも使えます。ChatGPTでもGeminiでも、頼めばきれいな画像が出てくる。でもそれは、ツールが1個増えただけです。生成した画像を持ち運び、加工し、成果物に組み込む作業は、相変わらず人間が手でやっています。
スキルとして組み込むと何が変わるか。「生成する」「保存する」「コードに反映する」という別々の作業が、1回の依頼で流れる1本のワークフローになります。 ツールの足し算ではなく、仕事の流れそのものの統合です。
これは画像生成に限った話ではありません。議事録の作成、請求書の下書き、SNS投稿の生成。「毎回同じ段取りでやっている仕事」は、すべて手順書にしてClaude Codeに渡せます。そして一度スキルにした仕事は、次から一言で終わるようになります。
まとめ
- スキルとは、Claude Codeに渡す「業務の手順書」。依頼の内容に応じてAIが自分で手順書を選んで実行する
- 画像生成をスキル化すると、「作っておいて」の一言で生成からコード反映まで終わる。このサイトの画像は実際にこの方式で作られている
- 価値はツールの追加ではなくワークフローの統合。毎回同じ段取りの仕事は、何でもスキルにできる
「自分の仕事のどこがスキルにできるのか」を考えることは、第1回の記事でお話しした「業務の言語化」そのものです。AIに任せる準備とは、結局、自分の仕事の手順を言葉にすることなのだと思います。
AI Crewでは、こうしたスキルの作り方を含めて、Claude Codeをあなたの業務に組み込むところまで一緒に進めています。「自分の仕事ならどこから手をつけるべきか」を知りたい方は、まず無料セミナーでお会いしましょう。
