まず生成 AI の進化とこれまでのチャット型AIとの違いを理解し、Claude のアカウント作成・デスクトップ版セットアップから使い方までを知る。そのうえで"AIで処理するもの"と"アプリに任せるもの"を見極めて、
石垣商店オリジナルの業務ツールを完成させ、Cloudflare Pages で公開する。3日間の集大成となる 4 時間45分。
これまでの学びを整理し、Claude と AIエージェントを理解したうえで、"AIで処理するもの／アプリに任せるもの"を見極めて、自分専用の業務ツールを完成させる。
1〜2日目の要点を確認しましょう。スマホかブラウザで答えてみてください。
業務のデジタル化（DX）は、いきなり大きなシステムを買うのではなく 手作業 → 数式 → GAS → GAS＋画面（アプリ） と段階的に育てていくのが基本です。1〜2日目で触れた内容がこの地図のどこにいたかを確認し、「今日はその一番上を AI と一緒に体験する」とつなげます。
見える画面
（ボタン・入力欄）
裏で動く仕組み
（計算・処理）
情報を溜める箱
（記録・保管）
在庫表・顧客リスト・日報など。手で入力して、関数で集計するだけのシンプルな状態。画面・処理・データが全部ひとつのシートに同居。
SUM・IF だけでなく、別のシートからデータを引っ張る IMPORTRANGE、絞り込む QUERY 等を使うと、プログラミングなしで複数ファイル横断の処理ができる。
GAS（Google Apps Script）は、スプレッドシートに「裏で動く小さな命令」を追加できる機能。例：毎朝9時に在庫表をメール送信／ボタンを押すと自動で帳票を作る。画面は今までのスプレッドシートのまま、裏側だけ強くなる。← 2日目のデモ（見積書自動作成など）はここ。
画面は Google フォームに任せる。データはスプレッドシートに自動で溜まる。GAS で集計・通知をする。画面は Google の作った安定品 = エラー率ほぼゼロ。中小企業の業務システムの多くがここで十分。
画面（HTML/CSS/JS）も自分で作る。AI に書かせるから書ける。データの保存先はスプレッドシートでも、ブラウザのメモでも OK。今日は Claude と一緒に「材料計算チェッカー」をこの形で作ります。
「手作業 → 数式 → GAS → GAS＋画面」。AI は、この各段を"作る手間"を一気に縮めてくれる存在。今日は一番上の STEP 5 を AI と一緒に体験します。
まず生成 AI がこの数年でどう進化してきたか・これまでの「チャット型」AIと何が違うのかを理解する。そのうえでもう一つの主要 AI「Claude」を無料版で使えるようになり、Gemini との使い分けをつかむ。
Claude や Gemini の話に入る前に、ここ数年で生成 AI がどう変わってきたかを整理します。「AI＝チャットで質問に答えてくれるもの」という理解は、実はもう半分古くなっています。
あらかじめ決めたルールで動く。迷惑メール判定・顔認識など。人間のように会話したり文章を作ったりはできない。
大量のテキストを学習し、人間のような文章・要約・翻訳・コードを生成。ただし基本は「1回の質問 → 1回の回答」で、次に何をするかは常に人間が指示する。
ゴールだけ伝えると、AI が自分で手順を考え、複数のツール（検索・ファイル操作・コード実行・ブラウザ操作等）を横断しながら、複数ステップの作業を人の手を借りずに完了させる。今日学ぶ Claude も、この流れの中にある最新世代の AI。
一度に扱えるテキスト量（コンテキストウィンドウ）が大幅に拡大し、長い資料や過去のやり取りを踏まえて応答できる
画像・音声・動画も理解できるマルチモーダル化が進み、「見て・聞いて」判断できるようになった
検索・計算・コード実行などの「ツール呼び出し」を AI 自身が判断して行えるようになった
即答するだけでなく、内部で段階的に考えを整理してから答える「推論モデル」が登場し、複雑な問題にも対応できる
Claude（クロード）は Anthropic 社の AI アシスタント。じっくり考える・長い文章・コード生成が特に得意で、今日のアプリ作りの相棒になります。まずはアカウントを作り、パソコンにもインストールしておきましょう。
Chrome や Edge のアドレスバーに claude.ai と入力。
メール／パスワードでの新規登録ではなく、会社の Google アカウント（GWS）で連動させるのが簡単で安全。新しいパスワードを覚える必要がない。
普段 Gmail や Docs で使っている会社のアカウントを選択。利用規約への同意を求められたら確認して進む。
利用目的などを聞かれることがあるが、答えなくても進められる。無料プランのままでOK。クレジットカード登録は不要。
claude.ai にログイン後、画面のメニューから「Download desktop app（デスクトップアプリをダウンロード）」を選ぶ。お使いの OS（Windows／Mac）用のインストーラーが入手できる。
ダウンロードしたファイルをダブルクリックし、画面の案内に従って進める（「次へ」を押していくだけでOK）。
起動したら「Continue with Google」で先ほど作った同じアカウントを選択。ブラウザ版と同じ会話履歴が引き継がれる。
ダーク／ライトモードなどの見た目はお好みで。通知が気になる場合はオフにできる（設定はアプリ内の歯車アイコンから）。
「こんにちは、自己紹介して」と入力し、返事が返ってくることを確認できたらセットアップ完了。
アカウントとデスクトップ版の準備ができたら、実際にチャットしてみましょう。使い方は Gemini とほとんど同じです。
日本語で質問・依頼を打つだけ。ブラウザ版・デスクトップ版どちらからでもOK（会話は共有される）。
一度で完璧な答えが出なくても、「もっと短く」「別の案も」のように続けて対話しながら仕上げていく。
左側の「+ New chat」で話題ごとに会話を分けられる。今日のアプリ作りも新しい会話で始める。
どちらが上ということではなく、得意分野が違うので使い分けます。
| 観点 | Gemini（Google） | Claude（Anthropic） |
|---|---|---|
| 得意なこと | GWS連携・検索・その場の要約 | 長文・論理的思考・コード生成 |
| GWSとの連携 | ★標準搭載（Gmail/Docs/Sheets内） | コピペ／ファイル添付で連携 |
| 今日の使い方 | 日常のGoogle業務でサッと | アプリのコードを書かせる相棒 |
先ほど見た「AIエージェント」を、もう少し実務目線で整理します。これから広がるのが AIエージェント = 指示すると自分で手順を考えて、複数の作業を続けて実行してくれるAI です。
「◯◯して」と目的を伝えるだけ
必要な作業を分解して順に実行
ドライブ・Web・アプリを横断
例：「ドライブのこの資料を読んで、要点を整理して、お客様向けの説明資料のたたき台まで作って」——これを一気にやってくれるイメージ。今日作る"アプリ"も、将来はエージェントが下書きを作ってくれる時代になります。
「AI が直接やる仕事」と「AI に作らせたアプリがやる仕事」の違いを理解し、なぜ今日"アプリ"を作るのかを腹落ちさせてから制作に入る。
同じ "AI活用" でも、AI に毎回その場で処理させるのと、AI に一度アプリ（プログラム）を作らせて、以後はそのアプリで処理するのは、まったく性質が違います。分かれ目は 「曖昧さが許されるかどうか」です。
石垣商店様の銅・真鍮加工業務に特化した計算ツールを、Claude に作らせます。「計算は正確に」だから、まさにアプリ向きのお題です。
骨格・構造
「柱と壁」= 入力欄・ボタン
デザイン・見た目
「壁紙と塗装」= 色・配置
動き・計算
「電気・設備」= 重量の計算式
記録・保管
「倉庫」= 計算履歴の保存先
Claude に段階的にコードを書かせ、ブラウザで動く「材料計算チェッカー」を全員が完成させる。AI に頼むコツ（段階的に頼む／エラーはそのまま貼る）を体で覚える。
「誰が・何を・どう操作すると・何が起きるか」を具体的に。「なんかいいツール」は NG。
一度に全部頼まず「まず HTML の骨格だけ」→「次に CSS」→「次に計算」と分けて依頼する。
ブラウザのエラー文をコピーして「このエラーが出ました。直してください」と貼るだけ。
メモ帳等に貼り付けて「○○.html」で保存。ダブルクリックでブラウザが開く。
まず Claude に「骨格だけ」を頼みます。以下のプロンプトをコピーして Claude に貼り付けてください。
コードをすべて選択してコピーする（コードブロック右上のコピーボタンが便利）
Windows：スタートメニュー → メモ帳 Mac：テキストエディット
ファイル → 名前を付けて保存 → ファイル名に「calculator.html」と入力
保存したファイルをダブルクリック → Chrome や Edge で開く
骨格ができたら、見た目を整えましょう。
JavaScript で実際に計算できるようにします。ここが「アプリに正確に処理させる」中心部分です。
エラーが出ても慌てないでください。AI がすぐ直してくれます。
基本が完成したら、石垣商店の業務に合わせてカスタマイズしましょう。
Day 2 の宿題で考えたアイデアを形にしてみましょう。以下のテンプレートを使ってください。
今、手元のファイルを開いているだけの状態です。URLで誰でも見られる状態にして初めて「公開」したことになります。ここでは Claude で作っても Gemini で作っても同じ手順で公開できる方法を使います。
ファイルをアップロードするだけで、公開URLが発行される無料サービス。無料アカウント登録（メールアドレスでOK）をすれば、何度でも同じURLのまま更新できます。帯域無制限・月500回まで公開できるため、今日程度の利用では上限を気にする必要はありません。
メールアドレスで登録。すでに Cloudflare アカウントがある人はログインするだけでOK。
プロジェクト名を入力する（これが公開URLの一部になる。例：ishigaki-calculator）。
calculator.html を1つドロップするだけ。複数ファイルに分かれている場合は、フォルダごとドラッグすれば OK（CSS/JSを別ファイルにした場合や、複数ページ構成でも、フォルダ内の相対リンクを保ったまま公開できる）。
https://プロジェクト名.pages.dev のURLが表示される。クリックして実際に動くか確認。
パソコン以外でも動くことを確認できたら公開完了。QRコードにして共有すると発表がスムーズ。
Cloudflare Pages なら、どちらの AI で作っても・1ファイルでも複数ファイルでも同じ手順で公開できるため、AI を乗り換えても手順は1つだけで迷いません。
今日の材料計算チェッカーのように「入力 → その場で計算 → 画面に表示」だけなら Cloudflare Pages 単体で完結します（バックエンドもDBも不要）。一方、「入力したデータをスプレッドシートに保存・一覧・みんなで共有したい」となった瞬間、話が変わります。
完成したアプリを見せ合い、3日間の成長を全員で実感する。第2期（上級コース）への期待を高める。
いつもの Google（Gmail/Docs/Sheets）の中で AI を使い、メール・文書・集計を楽にする。
スプレッドシートを DB に、GAS で処理を自動化。買わずに自社で作って保守できる。
曖昧さが許されない計算はアプリに任せる。AI にコードを書かせて、自分の道具を作れる。
3日間で、AI の基礎から Gemini の実務活用、スプレッドシート×GAS の仕組みづくり、そして Claude で自分専用の Web アプリ制作まで駆け抜けました。
今日のアプリ作りで一番大事だったのは、実はコードの書き方ではありません。「自分の業務を、AI に伝わる言葉にする」ために、普段なんとなくやっていた仕事を、あらためて分解し・言葉にし・見つめ直したはずです。その業務理解の深まりこそが、これからの仕事への向き合い方を変えていく一番の力になります。
みなさんはもう「AI を使える人」です。
ここから先は、日常業務の中で少しずつ試して、自分の「使い方」を磨いていってください。
第1期を修了した方の中から、特に意欲的な方を対象に上級コースを開催します。
完璧でなくてよい。実際に使うことで「次に何が必要か」が見えてくる。
「メールの返信を書いて」「この数字を表にして」等、小さなことから継続する。
業務で面倒だと感じた瞬間に AI を試すクセをつける。それが習慣化の一歩。