2026.03.18 DX

スクショを見せるだけ。Claude Codeで画像付き社内マニュアルを作った話

左のチャット画面でスクリーンショットが送られ、矢印を経て右側の手順付きWordマニュアルに整理される様子を示したイラスト

社内マニュアル、作るのが面倒で後回しにしていませんか

「この手順、マニュアルにまとめておかないと」と思いつつ、結局やらないまま数ヶ月が過ぎている。そんな経験はないでしょうか。

私もそうでした。毎月やっている請求書のダウンロード作業。

手順自体は難しくないけれど、ステップが多いので他のスタッフに引き継ぐにはマニュアルが必要です。でも、スクリーンショットを撮って、Wordに貼って、説明文を書いて……と考えると、つい後回しにしてしまいます。

今回、Claude Codeを使って、この「面倒なマニュアル作成」を試してみました。結論から言うと、操作しながらスクショを見せて「ここをクリック」と伝えるだけで、画像付きのWordマニュアルが完成しました。スクショを撮り始めてからWordが出来上がるまで、実質30分もかかっていません。

マニュアル化したかった作業

今回マニュアルにしたのは、利用している会社のWeb請求サービスから請求書（PDF）をダウンロードする手順です。

毎月、メールで請求確定の通知が届きます。そこからWeb請求サービスにログインして、請求書のPDFをダウンロードするのですが、確認ポップアップが何度も出たり、ZIPファイルで圧縮されていたりと、ステップがなかなか多い。全部で9ステップというわけです。

私は毎月やっているので慣れていますが、他のスタッフが代わりにやるとなると「どこをクリックするの？」となるのは目に見えています。

やったこと：画面を見せながら1ステップずつ伝えた

特別な準備はしていません。いつもどおり請求書をダウンロードする作業をしながら、各画面のスクリーンショットをClaude Codeに見せて、操作内容を一言添えただけです。

具体的にはこんなやり取りです。

ステップ1：通知メールのスクショを見せて「メールのURLからログインする」。最初の画面さえ見せれば、あとはClaude Codeがメール内のリンク先やサービス名も読み取ってくれます。

ステップ2：ログイン画面のスクショを見せて「専用アカウントでログイン」

ステップ3：認証画面のスクショを見せて「2段階認証のコードを入力する」

こんな調子で、9ステップ分のスクリーンショットと操作内容を順番に渡していきました。1ステップあたり、画像を貼り付けて一言添えるだけ。1つにかかる時間は数秒です。

これ、マニュアル作っている感覚がまったくないんですよね。

Claude Code側は、渡したスクショと説明を受け取りながら「ステップ1：メールのURLからWeb請求サービスにアクセス」「ステップ2：専用アカウントでログイン」……と、手順を整理してくれていました。

請求書ダウンロードの全13ステップを一覧表にまとめた図。ブラウザ操作8ステップ、ファイル操作3ステップ、仕分け2ステップに分類され、ログインと2段階認証に人手が必要、最終ステップは自動化済みであることを示している

「マニュアル作って」の一言でWordが出てきた

9ステップ分を全部伝え終わったタイミングで、こう頼みました。

「社内に周知したいのでマニュアルを作成して」

これだけです。するとClaude Codeが、渡した情報をもとにWordファイルを自動生成してくれました。

出来上がったWord文書には、こんな内容が整理されていました。

概要：何のためのマニュアルか
前提条件：ログイン用アカウントやスマートフォンが必要なこと
Step 1〜9の手順：各ステップの操作内容を箇条書きで記載
補足情報や備考

見出しのデザインや表組みも整っていて、そのまま社内で配布できるレベルでした。

「画面キャプチャも入れて」で画像付きに進化

テキストだけのマニュアルでも十分使えますが、やはり画面キャプチャがあったほうがわかりやすい。そこで追加でこう頼みました。

「画面キャプチャを渡していたので、それも入れて作成できますか？」

Claude Codeはスクリーンショットの保存場所を確認し、各画像がどのステップに対応するかを自動で判別。画像をWordに埋め込んで、キャプション（説明文）まで付けてくれました。

最終的に出来上がったのは、9ステップすべてに画面キャプチャ付きのWordマニュアルです。

ただし、1点だけ手直しが必要でした。Claude Codeが画面全体をわかるようにと大きめにキャプチャを取り込んでいたので、Word上ではサイズが大きすぎて少し見づらい部分がありました。とはいえ、必要な箇所だけキャプチャを撮り直して差し替えれば体裁はすぐに整えられます。構成や文面がすでにできているので、画像の入れ替えだけで済むのは楽です。

Claude Codeが自動生成したWord手順書の1ページ目。概要・前提条件・Step 1〜2の構成で、各ステップに画面キャプチャ付きのレイアウトになっている

驚いたポイント

今回やってみて、特に驚いたのは2つです。

1つ目は、スクショの中身をAIが読み取っていたこと。

こちらが「専用アカウントでログイン」としか伝えていなくても、スクリーンショットの画面内容から「IDを入力して『次へ』」「パスワードを入力してログイン」と、操作の詳細を補完してくれていました。画像を「見ている」から、こちらが細かく説明しなくても伝わるわけです。自分より画面をよく見ている……。

2つ目は、画像とステップの対応を自動で判別したこと。

スクリーンショットのフォルダには、今日撮ったキャプチャが十数枚入っていました。ファイル名は「スクリーンショット 2026-03-12 185101.png」のような自動生成の名前で、どれがどのステップかはファイル名からはわかりません。それでもClaude Codeは各画像の内容を見て、正しいステップに対応づけてくれました。十数枚の画像を時系列と内容で照合して、間違いなく配置していたのには驚きました。