AI システム開発ワークショップ

受講テキスト

〜「作ってもらう」から「自分で作れる」へ〜
📅 2026年7月17日（金）14:00〜16:00 📍 本町

① あなたの環境を選んでください

2つ選ぶと、あなた専用の手順書が下に表示されます。

1パソコンの種類
2使うAIツール
👆 上の2つを選んでください
パソコンの種類と、使うAIツールを選ぶと、ここに手順書が表示されます。

はじめに：今日のゴール

ようこそ。今日の2時間で目指すのは、「自分にもできた！」という実感を1回つかむことです。

  • 完璧なアプリを完成させる日ではありません。
  • プログラミングの用語を覚える日でもありません。
  • 「AIにお願いしたら、自分の仕事に役立つ何かが本当に動いた」——その瞬間を体験する日です。

うまくいかないところがあって当たり前です。詰まったら手を挙げてください。それが正しい進み方です。 私たちが必ずフォローします。

🔑今日のキーワードは2つだけ。「動いた！」と「家で続きをやってみよう」。このテキストは持ち帰って、おうちで続きをやるときにも使えます。

どんな「アプリ」を作る？

アプリと一口に言っても、大きく3つの種類があります。今日は、いちばん手軽で、その場ですぐ動く「ウェブ（ブラウザ）アプリ」を作ります。まずは全体像を見てみましょう。

⭐ ウェブ（ブラウザ）アプリ
今日つくるもの		 スタンドアロンアプリ
（パソコンアプリ）		 スマホアプリ
どこで動く？ ブラウザ（Chromeなど）PCでもスマホでも パソコンの中（Windows / Mac） スマホ・タブレット
たとえるなら Google検索、YouTube、ネット通販 Word、Excel、メモ帳 LINE、Instagram、地図アプリ
インストール いらない（ファイルを開くだけ） 必要 必要（ストアから）
人に見せる・配る かんたん（URLやファイルを渡すだけ） ファイルを渡す・少し手間 知人へはファイル(.apk)で配れる／ストア公開は手間
作りやすさ（今日） ◎ とても作りやすい △ 準備がいる × 今日は完成が難しい
向いていること フォーム入力・計算・一覧表示・ゲーム（2D〜3D）🎮・その場で共有 パソコンの中のファイル整理・一括処理 位置情報・カメラなどスマホ機能を使う
⭐今日は全員 ウェブ（ブラウザ）アプリ を作ります。準備なし・その場で動く・人に見せられる、の3拍子がそろっていて、2時間で「動いた！」に確実にたどり着けるからです。
①

ウェブ（ブラウザ）アプリ　⭐今日つくるもの

どんなもの？　Chromeなどのブラウザの中で動くアプリです。Google検索やネット通販のように、みなさんが普段いちばんよく触れているタイプです。

得意なこと

  • 入力フォーム（アンケート・申込・問い合わせ）
  • 計算・集計（見積り・料金シミュレーション）
  • 一覧表示・検索（商品リスト・名簿）
  • ゲーム（2Dアクションから、動き回れる3Dゲームまで）🎮
  • その場で人に見せる・共有する

作り方（今日のやり方）　AIに、次のようにお願いします。

💬 コピーして使える文
ブラウザで動くウェブアプリを作ってください。 ・1つのHTMLファイルだけで完結させてください（インストール不要） ・○○（作りたいもの）ができるようにしてください ・スマホでもパソコンでも見やすいデザインにしてください

でき上がったHTMLファイルをダブルクリックすれば、その場でブラウザが開いて動きます。これだけです。

🎮

ゲームを作りたい人へ

ゲームも、今日のウェブアプリで作れます。しかも本格的です。AIにお願いすれば、動き回ってあそべる3Dゲームだってブラウザの中でちゃんと動きます。作ったゲームはパソコン・タブレット・スマホ・テレビ画面のどれでも遊べます。

2時間でこれくらい作れます 🚀

🎮 動き回れる3Dゲーム
  • 3Dの迷路やダンジョンを歩いて探検する
  • 玉を転がして障害物をよけながらゴールを目指す
  • 空を飛んでコインやアイテムを集める3Dワールド
  • ブロックを積んで街や家をつくる（マインクラフト風）
  • 3Dのレーシング／シューティング
🕹️ 定番の2Dアクション
  • ジャンプして進むアクション（マリオ風）
  • シューティング・ブロック崩し・よけゲー
  • スネーク・落ちものパズル（テトリス／ぷよ風）
💬 コピーして使える文（3Dゲーム）
ブラウザで遊べる3Dゲームを作ってください。 ・1つのHTMLファイルだけで完結させてください ・3Dの表示には Three.js を使ってください ・○○（作りたいゲーム。例：玉を転がしてゴールを目指す）で遊べるように ・キーボードで操作でき、スコアやゴール判定も入れてください ・子どもでも直感的に遊べる、カラフルで楽しい見た目にしてください
📶3Dゲームは、多くの場合 3D部品（Three.js など）をネット（会場のWi-Fi）から読み込んで動きます。特別なインストールは要りませんが、Wi-Fiが混んでいると重い・表示されないことがあります。そのときは少し待つか、AIに「動きません。直してください」と、出ているエラーをそのまま貼って伝えれば直してくれます（AIに「Three.js を1つのファイルに埋め込んで、ネットが無くても動くようにして」と頼む手もあります）。
②

スタンドアロンアプリ（パソコンアプリ）

どんなもの？　WordやExcel、メモ帳のように、パソコンの中にインストールして動かすアプリです。ブラウザは使わず、そのアプリ単体で立ち上がります。

得意なこと　パソコンの中のファイルやフォルダを直接あつかうこと。

  • 例：フォルダ内の写真をまとめてサイズ変更する
  • 例：たくさんのExcelファイルを1つに合体させる
  • インターネットがなくても動かしたいとき

（ウェブアプリは安全のため、パソコンの中のファイルを自由に触ることが苦手です。そこはパソコンアプリの得意分野です）

作り方（イメージ）

  • Python（パイソン）という言語で作るのが比較的やさしい（C#などもありますが準備がより大変です）
  • 事前にパソコンへPythonをインストールしておく必要がある
  • AIにコードを書いてもらい、それを実行する
  • 動かすときに「黒い画面（コマンド）」を使うことがある
💡言語の難しさより「環境の準備」でつまずきがちです。Pythonが全員のパソコンに入っていれば挑戦する価値は十分。「パソコンの中の作業を自動化したい」ときに向いています。
③

スマホアプリ

どんなもの？　LINEやInstagram、地図アプリのように、スマホやタブレットにインストールして使うアプリです。App Store（iPhone）やGoogle Play（Android）から入れます。

得意なこと　位置情報（GPS）、カメラ、通知などスマホならではの機能を使うこと。持ち歩いて、いつでもどこでも使えます。

作り方（イメージ）と注意点　「どこまで配りたいか」で難しさが大きく変わります。

  • 自分や、限られた知人に配るだけ → じつは意外とかんたん。Android なら、アプリを1つのファイル（.apk）にして渡せば、受け取った人がそのままインストールして使えます（お店＝ストアに出す必要はありません）
  • だれでもダウンロードできるように公開する → ここは大変。ストア（Google Play / App Store）に出すには審査・登録（有料の場合も）が必要です
📱ただしiPhone(iOS)は例外で、この「ファイルを渡すだけ」がむずかしく、限られた人に配る場合でもApple公式の登録（有料）などが必要です。手軽に配れるのは主にAndroidだと思ってください。また、.apk を作る作業自体にはパソコン側の準備が少し必要なので、今日は扱いません。
🪄いちばんかんたんな裏ワザ：実は「①のウェブアプリ」をスマホのブラウザで開けば、スマホアプリのように使えます。ホーム画面に追加すればアイコンからも起動でき、URLを送るだけで知人にも配れます（iPhoneでもAndroidでもOK）。「スマホで使いたい・配りたい」だけなら、まずはこれで十分なことが多いです。
🧭迷ったら　ウェブアプリで作る → スマホのブラウザでも開ける、というのが一番かんたんで応用の効くスタート地点です。②③は「こういう選択肢もある」と知っておくだけでOK。将来やりたいことに合わせて選べます。

今日の流れ

時間内容
14:00〜14:15はじめに ＆ AIで何ができるかを知る
14:15〜14:30PART 1　みんなで環境を整える（一緒に進めます）
14:30〜15:45PART 2　自分の業務アプリを作ってみる（メイン）
15:45〜16:00動かして確認 ＆ 家での続け方

始める前のチェック

3つだけ確認してください。できていなければ、すぐ手を挙げてください。

🏢 会社から貸与されたパソコン・アカウントの方へセキュリティ設定により、ソフトのインストールや外部への通信（API）が制限されていて進めないことがあります。うまくいかないときは無理せず手を挙げてください。可能であれば個人のパソコン・個人アカウントのほうがスムーズです。
  • ノートパソコンの電源が入っている（Windows / Mac どちらでもOK）
  • 会場のWi-Fiにつながっている
  • 【Windowsの方】PowerShell 7 を入れておく（これが無いと STEP 1 のインストールが失敗します。未導入なら PART 1 の「準備：PowerShell 7 を入れる」を先に。インストーラを“次へ”で進めるだけ・コマンドは不要）
  • ノートパソコンの電源が入っている（Windows / Mac どちらでもOK）
  • 会場のWi-Fiにつながっている
  • 個人の Google アカウントが使える（会社アカウントはAPIがブロックされることがあります）
  • Node.js（バージョン20以上）が入っている（未確認・未導入の方は早めにスタッフへ。当日の新規インストールは時間がかかります）
💬Gemini CLI は無料のAPIキーで動かします（1日あたり最大250回・Flash系モデル）。体験には十分です。分からなければ手を挙げてください。

PART 1　環境を整える（写経パート）

ここは講師と一緒に、同じものを打って進めます。まずは画面のとおりに打って実行するだけでOK。怖くありません。

各ステップに「👉 これは何をしているの？」と「✅ こうなったらOK」を書いています。OKが出たら手を挙げて教えてください。みんなで足並みをそろえて進みます。

準備

【Windowsのみ】PowerShell 7 を入れる

Windows の方だけの準備です（Mac の方は不要 → STEP 0 へ）。これは必須の準備です。飛ばすと STEP 1 のインストールが requires either Git for Windows or PowerShell と出て失敗します。コマンドは打ちません。画面を「次へ」で進めるだけです。
（※エラー文に「Git for Windows」と出ますが、Git は入れなくて大丈夫です。この PowerShell 7 だけ入れれば解決します。）

  • ブラウザで公式ページを開く 👉 https://aka.ms/powershell
  • ファイル名が …win-x64.msi で終わるインストーラをダウンロードして、ダブルクリックで開く
    （ふつうのパソコンは x64 でOK。新しい ARM のパソコンだけ arm64 を選びます。迷ったら手を挙げてください）
  • あとは 「Next（次へ）」→「Install（インストール）」→「Finish（完了）」と押していくだけ。途中の設定は変えなくてOKです（「Add PowerShell to PATH」のチェックは入れたままにしてください）。
  • 途中で「このアプリがデバイスに変更を加えることを許可しますか？」が出たら 「はい」 を押します。
👉PowerShell 7 は Microsoft 公式の新しい「命令の窓口」です。いま入っている「Windows PowerShell」は消えません（両方そのまま使えます）。Claude Code はこの PowerShell 7 を使って動きます。
✅入れ終わったら、スタートボタンを押して pwsh と入力し、黒っぽいアイコンの「PowerShell 7」が候補に出れば成功です。
大事：ここでいま開いているターミナルは一度閉じてください。このあと STEP 0 で新しく開き直した窓口（Windows PowerShell / PowerShell 7 どちらでも可）から進めれば、STEP 1 のインストールが成功します（古い窓口を開きっぱなしのまま実行すると requires either… で失敗します）。
📸 スクショ（Windows）：PowerShell 7 のインストーラ
aka.ms/powershell から win-x64.msi をダウンロードして実行し、「Next」で進める画面。「Add PowerShell to PATH」にチェックが入った状態。
STEP 0

ターミナル（命令の窓口）を開く

🪟 Windows

スタートボタンを押して powershell と入力 →「Windows PowerShell」を開く。

🍎 Mac

⌘（コマンド）＋ スペース を押して ターミナル と入力 → Enter。

👉パソコンに「文字で命令する窓口」を開いています。マウス操作の代わりに、ここに“呪文（コマンド）”を打って、道具を入れたり呼び出したりします。
✅黒い（または白い）画面が開いて、文字が打てる状態になっている。
📸 スクショ①：ターミナルの開き方
スタートメニューで「powershell」を検索し、Windows PowerShell が候補に出ている状態（ターミナルの開き方・Windowsの例）。
Spotlight（⌘＋スペース）で「terminal」を検索し、「ターミナル」が候補に出ている状態（ターミナルの開き方・Macの例）。
Windows: スタートメニューで powershell を検索した状態
Spotlightでterminalを検索してターミナルを開く（Mac）
STEP 1

AI開発ツール「Claude Code」をインストールする

下の自分のパソコンの行を1行コピーして貼り付け、Enterを押します。

🪟 Windows（PowerShell）
irm https://claude.ai/install.ps1 | iex

※このワークショップは PowerShell を推奨します（STEP 3以降のコマンドも PowerShell 前提です）。どうしても「コマンドプロンプト」を使う場合のみ、インストールは代わりにこちらを1行で。ただしそのあとの手順は必ず PowerShell を開き直して進めてください。

curl -fsSL https://claude.ai/install.cmd -o install.cmd && install.cmd && del install.cmd
🍎 Mac（ターミナル）
curl -fsSL https://claude.ai/install.sh | bash
👉「ネットから公式のインストール係を呼んできて、その場で実行して」という命令です。これ1行で本体が入ります。
（※むずかしい準備＝WSL や Node.js は要りません。Windows の方は前の「準備」で PowerShell 7 を入れておけばOKです。）
✅文字がしばらく流れたあと、installed などの完了メッセージが出て、また入力できる状態に戻る。
⏳30秒〜数分かかることがあります。流れ終わるまで待ちましょう。
🪟もし requires either Git for Windows or PowerShell と出て Installation failed になったら、前の「準備：PowerShell 7 を入れる」がまだの合図です。PowerShell 7 を入れてターミナルを開き直してから、もう一度この行を実行してください。
※エラー文に「Git for Windows」とありますが、Git は入れなくてOK。PowerShell 7 だけで解決します。
🪟完了メッセージの中に 「is not in your PATH」（例：...\.local\bin is not in your PATH）と出ることがありますが、あわてなくて大丈夫です。ここではまだ claude と打たないでください（打っても「認識されません」と出ます）。次の STEP 2 でターミナルを開き直すと使えるようになります（開き直しても出ないときの直し方も STEP 2 に用意しています）。
⏳ Macで初めての場合下の「コマンドラインデベロッパツール（git）」のインストールを求められることがあります。このダウンロードは数分〜十数分かかることがあり、会場のWi-Fiが混んでいるとさらに時間がかかります。焦らず、完了するまで待ってください（先に進めません）。時間がかかっても失敗ではありません。
📸 スクショ（Mac①）：インストールコマンドを入力
ターミナルに curl -fsSL https://claude.ai/install.sh | bash を貼り付けて Enter した直後の状態。
ターミナルでインストールコマンドを入力（Mac）
📸 スクショ（Mac②）：ツールの確認が出たら「インストール」
「“git”コマンドを実行するには、コマンドラインデベロッパツールが必要です」というダイアログが出たら 「インストール」 を押します（出ないこともあります）。
コマンドラインデベロッパツールのインストール確認ダイアログ（Mac）
📸 スクショ（Mac③）：インストール完了の表示
Claude Code successfully installed! と Installation complete! が出れば成功です。
（「~/.local/bin is not in your PATH」と出ても大丈夫。STEP 2で開き直します。）
Claude Codeのインストール完了メッセージ（Mac）
📸 スクショ②：Claude Code 初回起動・テーマ選択画面
claude を初めて起動したときに出る「Welcome / Choose the text style（テーマ選択）」画面。矢印キーで選んで Enter（基本はそのままでOK）。
Claude Code 初回起動・テーマ選択画面（Choose the text style）
STEP 2

ターミナルを一度閉じて、開き直す

いま開いている窓口をいったん閉じて、STEP 0と同じ方法でもう一度開きます。

🪟 Windowsで開き直しても見つからないときだけclaude と打っても「'claude' は認識されていません（is not recognized）」と出る場合は、道具の置き場所（PATH）がうまく登録されていないことがあります。下の1行を貼ってEnter → PowerShellをもう一度閉じて開き直します。
[Environment]::SetEnvironmentVariable("PATH", "$([Environment]::GetEnvironmentVariable('PATH','User'));$env:USERPROFILE\.local\bin", "User")
それでも見つからないときは、開き直さずその場で下のようにフルパスで直接呼ぶ方法でも進められます（応急処置）。困ったら手を挙げてください。
& "$env:USERPROFILE\.local\bin\claude.exe"
🍎 Macで開き直しても見つからないときだけ「command not found」や「not in your PATH」と出る場合は、下の1行を貼ってEnter（道具の置き場所を登録）→ もう一度ターミナルを開き直します。
echo 'export PATH="$HOME/.local/bin:$PATH"' >> ~/.zshrc && source ~/.zshrc
👉入れたばかりの道具の置き場所を、パソコンに覚え直させます。再起動のようなものです。
✅もう一度、文字が打てる画面が開いている。
STEP 3

今日の「作業部屋」をデスクトップに作る

下の3行を、1行ずつ打って Enter（3回くり返します）。

🪟 Windows（PowerShell）
cd ([Environment]::GetFolderPath('Desktop'))
mkdir myapp
cd myapp
🪟1行目は「デスクトップの“本当の場所”へ移動」する命令です（OneDriveを使っていてもOK）。もしエラーが出たら、代わりに下を試してください。直らなければ手を挙げてください。
cd $HOME\OneDrive\Desktop
🍎 Mac（ターミナル）
cd ~/Desktop
mkdir myapp
cd myapp
👉デスクトップに「myapp」という今日の作業部屋を作って、その中に入りました。デスクトップに置くのは、家に帰ってからすぐ見つけられるようにです。
✅画面の場所の表示に myapp という文字が見えている。
STEP 4

AIの相棒「Claude」を呼び出す ＆ サブスクでログイン

claude とだけ打って Enter。

claude
👉開発の相棒を呼び出します。初めての時だけ質問が出ます（見た目のテーマ、このフォルダを使ってよいか等）。基本は Enter（そのまま進める）でOK。
🔑 ここがいちばん大事！ログイン方法をたずねる画面（英語）が出ます。矢印キーで選んで Enter（または番号キー）。かならず一番上の 「1. Claude account with subscription」を選んでください。「2. Anthropic Console account」は選ばないでください。
⭕ 選ぶ：1. Claude account with subscription（Pro のアカウント）
→ 今日のために契約した月額プランの範囲で使えます（追加料金なし）
❌ 選ばない：2. Anthropic Console account（API usage billing）
→ 別料金（クレジット）扱いになり、しばらくすると「クレジットが足りません（Credit balance too low）」と止まります
📸 スクショ③：ログイン方法の選択画面 ★最重要
一番上の「1. Claude account with subscription」を選びます（「2. Anthropic Console／API」は選ばない）。
Claude Code ログイン方法の選択画面（1. Claude account with subscription を選ぶ）

ログイン方法を選ぶと、ブラウザが自動で開きます。さきほど claude.ai にログイン済みなので、表示された画面で 「許可（Authorize）」を押します。

🌐 ブラウザが自動で開かないときターミナルに Browser didn't open? Use the url below to sign in と長いURLが出ています。キーボードの c を押すとURLがコピーできます（またはドラッグで選択してコピー）。それをブラウザのアドレス欄に貼り付けて開いてください。
🔢 いちばん間違えやすい：認証コードのコピー＆貼り付け「許可」を押すと、ブラウザに「認証コード」の画面が出ます（「これを Claude Code に貼り付けてください」と表示）。あわてず、次の順にやります：
  • ブラウザの 「コードをコピー」 ボタンを押す（認証コードがコピーされます）
  • ターミナルに戻る。Paste code here if prompted > と貼り付け待ちになっています
  • そこに貼り付けて Enter（貼り付けは Windows は右クリック、Mac は ⌘＋V）
これでログイン完了。ターミナルに入力欄が出ます。
💬環境によっては、「許可」を押すと自動でターミナルに戻り、コード貼り付けが不要なこともあります。その場合はそのまま次へ進んでOK。うまく進まないときは手を挙げてください。
📸 スクショ③-2：認証コードのコピー ＆ 貼り付け ★最重要
上：ターミナルが Paste code here if prompted > で貼り付け待ちになります（ブラウザは自動で開きます）。下：ブラウザの「認証コード」画面で「コードをコピー」を押し、上のターミナルに貼り付けて Enter。
ターミナル：Paste code here if prompted で貼り付け待ち（ブラウザが開かない時のURLもここに表示） ブラウザ：認証コード画面。「コードをコピー」を押す

✅ 確認：ちゃんとサブスクで使えているか

入力欄に /status と打って Enter。プラン（Pro／Subscription）で利用中と表示されればバッチリです。

/status
💬もし「API」や「Credit」と表示されたり、後で「クレジットが足りません」と出たら——あなたのミスではありません。よくあることです。手を挙げてください。（ご自身で直す場合は /login と打ち直して、もう一度 Pro（サブスク）の方を選べばOK。）
/login

⚡ 仕上げ：今日のモデルを「Sonnet」にそろえる（使用量の節約）

入力欄に /model sonnet と打って Enter。

/model sonnet
👉AIには複数の“頭脳（モデル）”があります。今日はみんなで一斉に使うので、軽くて速い「Sonnet」にそろえます。使用量（トークン）の減りがゆっくりになり、2時間の最後まで気持ちよく使えます。
（Proプランでは通常この「Sonnet」が使われるので、念のため全員そろえます。Opus など上位モデルに切り替えると、契約プランによっては使用量の上限に早く達し、途中で使えなくなることがありますので、今日は Sonnet のままにしてください。）
✅もう一度 /status を打つと、モデルが Sonnet になっている。
📸 スクショ⑤：モデルがSonnetになった表示
モデル選択で「4. Sonnet ✓」が選ばれている状態（/model sonnet の後）。
Claude Code モデル選択：4. Sonnet が選択されている
STEP 5

はじめてのひとこと（ここで「動いた！」）

入力欄に、そのまま日本語で話しかけてみましょう（コマンドではありません）。

💬 そのままコピーして送ってOK
こんにちは。今日はあなたと一緒に、かんたんな業務アプリを1つ作ります。まずは軽く自己紹介してください。
👉もう準備は完了です。あとは“日本語でお願いするだけ”。試しに話しかけています。
✅Claudeから返事が返ってくる。おめでとうございます！ これで環境はバッチリです。PART 2へ進みましょう。
📸 スクショ⑥：はじめての返事
呼びかけに Claude が返事をして、作りたいアプリを尋ねてきた画面。ここまで来れば環境構築は成功です。
Claude Code：はじめての呼びかけに返事が返ってきた画面
✨ Gemini CLI についてターミナルで動くAIエージェント「Gemini CLI」を、無料のAPIキーで動かします。以前あった「Googleログインだけの無料枠」は2026年6月18日に終了したため、今はGoogle AI Studio の無料APIキーを発行して使います。（無料枠の目安：1日あたり最大250回／Flash系モデル）
💡 はじめに知っておくと安心Gemini CLI は無料で手軽に試せますが、途中で固まったり、英語で聞き返してきたり、動作が少しムラになることがあります。これは故障ではなく“よくあること”です。詰まったら「終了して起動し直す」「軽いモデル（Flash／Flash-Lite）にそろえる」「日本語で答えてと打つ」——この3つでたいてい進めます（やり方は各STEPと「困ったときは」にあります）。うまくいかなければ、いつでも手を挙げてください。
STEP 0

ターミナル（命令の窓口）を開く

🪟 Windows

スタートボタンを押して powershell と入力 →「Windows PowerShell」を開く。

🍎 Mac

⌘（コマンド）＋ スペース を押して ターミナル と入力 → Enter。

✅黒い（または白い）画面が開いて、文字が打てる状態になっている。
📸 スクショ①：ターミナルの開き方
スタートメニューで「powershell」を検索した状態（Windows）／Mac は Spotlight で「ターミナル」を検索した状態。
Windows: スタートメニューで powershell を検索した状態
STEP 1

Node.js が入っているか確認する

ターミナルで下を実行します。

node -v
✅v20.0.0 以上が表示されればOK → STEP 2 へ。
⚠️「コマンドが見つかりません」などが出たら、Node.js が未インストールです。巻末の「補足：Node.js のインストール」を見るか、手を挙げてください。
STEP 2

Gemini CLI をインストールする

npm install -g @google/gemini-cli
⚠️Windows（PowerShell）で「npm.ps1 を読み込むことができません」PSSecurityException というエラーが出たら、PowerShell がスクリプトの実行を既定で禁止しているためです（npm や Node.js の不具合ではありません）。下を一度だけ実行して許可します（管理者権限は不要）。途中で確認されたら Y → Enter。
Set-ExecutionPolicy -Scope CurrentUser -ExecutionPolicy RemoteSigned
💡そのあと、もう一度 npm install -g @google/gemini-cli を実行してください。設定を変えたくない場合は、代わりに npm.cmd install -g @google/gemini-cli（npm を npm.cmd に）でもインストールできます。

インストールできたか確認：

gemini --version
✅バージョン番号（例：0.49.0）が表示されれば成功です。
💡グローバルインストールがうまくいかない場合は、毎回 npx @google/gemini-cli で起動する方法もあります（インストール不要）。
STEP 3

無料の API キーを取得する

  • ブラウザで Google AI Studio を開く 👉 https://aistudio.google.com/apikey
  • 用意した個人 Google アカウントでログイン
  • 「Create API key（APIキーを作成）」をクリック
  • キーの名前（Key name）を聞かれたら、あとで自分が分かりやすい好きな名前でOK（例：workshop など、任意の値でかまいません）。空欄のまま進めても大丈夫です。
  • プロジェクトの選択（「Search Google Cloud projects」や、すでに用意されたプロジェクトの一覧）が出たら、表示されている（インポート済みの）プロジェクトをそのまま選ぶだけでOKです。候補が出てこないときは 「Create API key in new project（新しいプロジェクトで作成）」 を選べば、自動でプロジェクトが用意されます。
  • 表示されたキー文字列をコピー（AIza… で始まる長い文字列）
💡名前やプロジェクトは、深く考えなくて大丈夫。キーの名前は自分用のメモのようなもので任意の値でOK、プロジェクトは表示されたものをそのまま選べば動きます。ここで作るのは「無料で Gemini を使うための鍵」だけです。迷ったら手を挙げてください。
🔒このキーはパスワードと同じ扱いです。他人に見せない・チャットや画面共有に映さないよう注意。
📸 スクショ：Google AI Studio の APIキー画面
「API キー」画面。右上の「API キーを作成」からキーを発行します（表示された／インポート済みのプロジェクトを選べばOK）。まだキーが無いときは「API キーが見つからない場合」と表示されます。
Google AI StudioのAPIキー画面
STEP 4

API キーを環境変数に設定する

🔒 入力したキーはこのページ内だけで処理され、どこにも送信されません。貼り付けると下のコマンドに自動で埋め込まれます（前後の空白は自動で除去）。画面には伏せて表示され、「コピー」は本物のキー入りをコピーします。画面共有・スクショには映さないでください。

🪟 Windows（PowerShell）

今のウィンドウだけで使う（お手軽・ワークショップ向け）：

$env:GEMINI_API_KEY = "ここにコピーしたキーを貼る"

次回以降も自動で使えるようにする（恒久設定）：

setx GEMINI_API_KEY "ここにコピーしたキーを貼る"
⚠️setx で設定した場合は、一度 PowerShell を閉じて開き直すと反映されます。
🍎 Mac（ターミナル）

今のウィンドウだけで使う：

export GEMINI_API_KEY="ここにコピーしたキーを貼る"

次回以降も使えるようにする（zsh の場合）：

echo 'export GEMINI_API_KEY="ここにコピーしたキーを貼る"' >> ~/.zshrc
source ~/.zshrc
👉上の入力欄にキーを貼れば、下のコマンドに自動で入ります。手で置き換える場合は "ここにコピーしたキーを貼る" の部分を、STEP 3でコピーした自分のキー（AIza…）に差し替えてから実行してください。前後の空白や改行が入らないよう注意。
STEP 5

今日の「作業部屋」をデスクトップに作る（起動前に必ず）

AIにファイルを作らせる前に、安全な作業用フォルダを用意します。下を1行ずつ打って Enter（3回くり返します）。

🪟 Windows（PowerShell）
cd ([Environment]::GetFolderPath('Desktop'))
mkdir myapp
cd myapp
🪟1行目は「デスクトップの“本当の場所”へ移動」する命令です（OneDriveを使っていてもOK）。もしエラーが出たら、代わりに cd $HOME\OneDrive\Desktop を試してください。直らなければ手を挙げて。
🍎 Mac（ターミナル）
cd ~/Desktop
mkdir myapp
cd myapp
⚠️ ここは必ず守ってくださいターミナルを開いた直後は、Windowsのシステム用フォルダ（System32 など）や Cドライブ直下にいることがあります。その場所のままAIにファイルを作らせると、「アクセスが拒否されました」という権限エラーが出たり、パソコンに悪い影響が出たりします。必ず上の手順で「デスクトップの myapp」に移動してから、次のSTEP 6でAIを起動してください。画面の場所の表示に myapp と見えていればOKです。
STEP 6

起動して動作確認（ここで「動いた！」）

myapp フォルダに入っていることを確認したら、下のコマンドで起動します（軽くて無料枠が多いモデルを最初から指定して起動します）。

gemini -m "gemini-2.5-flash"
👉認証方法を聞かれたら 「Gemini API Key（API キー）」 を選択します。
⚡ 大事：モデルを Flash にそろえますGemini CLI は初期設定だと重いモデル（Pro）を使おうとしますが、無料枠のProは1分あたり数回・1日100回ほどとすぐ上限に達し、途中で「RESOURCE_EXHAUSTED／429」で止まりやすくなります。上のように -m "gemini-2.5-flash" を付けて起動すると、軽くて無料枠の多い Flash（1日250回）で最後まで気持ちよく使えます。
（起動後にモデルを切り替えたいときは、入力欄で /model と打つとモデルを選べます。もし Flash でも上限に達したら gemini -m "gemini-2.5-flash-lite" で起動すると、さらに枠の広い Flash-Lite（1日1000回・毎分15回／軽量ぶん巧さは少し下がる）が使えます。）

起動したら、対話プロンプトに日本語でこう入力してみましょう：

💬 そのままコピーして送ってOK
このフォルダにあるファイルを一覧で教えて
✅エージェントが応答すればセットアップ完了！ 🎉 PART 2へ進みましょう。
📸 スクショ⑥：Gemini CLI が起動した画面
gemini を起動し、認証（Gemini API Key）が完了して入力待ちになった状態（「Authenticated with gemini-api-key」と表示）。ここまで来ればセットアップは成功です。
Gemini CLIが起動して認証完了した画面

PART 2　自分の業務アプリを作ってみる（メイン）

ここからが本番。むずかしいことはしません。5つのステップを、順番に進めていくだけです。今日は「プランモード」を使って、いきなり作らせず計画を確認してから作ります。

下の「コピーして使える文」を参考に、自分の言葉に変えてClaudeGeminiに送ってください。

①

まず「作りたいもの」を一言で決める

自分の仕事で「これが面倒だな」と思うことを、ひとことで書いてみましょう。迷ったら、下の例から1つ選んでOK。

  • 顧客管理：お客さんの名前・電話・メモを登録して、あとから検索できる画面がほしい
  • かんたん見積：商品と数量を選ぶと、合計金額が出る画面がほしい
  • 日報：日付と「今日やったこと」を書いて、一覧で見返せる画面がほしい
  • 予約管理：日付・時間・名前で予約を登録して、一覧で見られる画面がほしい
  • 在庫チェック：商品名と在庫数を登録して、少なくなったら色が変わる画面がほしい

✏️ あなたの一言：

②

「プランモード」で作戦を立ててもらう（いきなり作らせない）

🧭プランモードとは、AIがいきなり作り始めず、「どう作るか」の計画だけを先に見せてくれる安全な仕組みです。今日はこれを使います。プランモード中は、AIが勝手にファイルを変更したり作ったりしません。まず計画を見て、納得してから作れるので安心です。
🤖 Claude Code でプランモードに入る

キーボードの Shift ＋ Tab を押すと、モードが順番に切り替わります。プランモードになるまで数回押してください。

通常モード → 自動編集（accept edits）→ プランモード（plan mode）。画面下の表示がプランモードに変わればOK。戻したいときは、もう一度 Shift ＋ Tab。

✨ Gemini CLI でプランモードに入る

Shift ＋ Tab を数回押すと、モードが順番に切り替わります（通常 → 自動編集 → プラン（plan））。画面下の表示がプランモードに変わればOK。

新しめのバージョンでは、入力欄に /plan と打っても入れます（このコマンドが使えないときは上の Shift ＋ Tab で切り替えてください）。

/plan

プランモード中は読み取り専用で、勝手に作りません。戻したいときは Shift ＋ Tab か Esc。

プランモードにしたら、作りたいものを伝えます。

💬 コピーして使える文
「（①で書いた一言）」を作りたいです。 まずどんな画面と機能で作るか、計画を箇条書きで提案してください。

AIが「こんな画面で、こんな機能で作りますね」という計画を出してくれます（この時点ではまだ作りません）。

③

計画を一緒に読む（いる・いらないを自分で決める）

ここが今日いちばん大事なところです。AIの提案をそのまま受け入れず、「いる機能・いらない機能」を自分で決めます。

💬 コピーして使える文（例）
だいたい良いです。ただ「〇〇」は今回いらないので外してください。 代わりに「△△」を足してください。

プランモード中なので、納得できるまで何度でも計画を直してもらえます。まだ実際には作られないので、安心して直しましょう。

🌟これが「自分で作れる人」の一歩です。AIは“やってくれる人”ではなく、“相談する相手”。決めるのはあなたです。
④

計画を承認して、作ってもらう（「動いた！」の瞬間）

計画に納得したら、承認して実行に移します。プランモードを抜けて、AIが実際に作り始めます。

🤖 Claude Code で承認する

計画が出ると選択肢が表示されます。矢印キーで 「Approve（承認して進める）」 と書かれた項目を選んで Enter。すると計画どおりに作り始めます。

✨ Gemini CLI で承認する

計画が出たら 「Yes（承認する）」 と書かれた項目を選んで Enter。すると作り始めます。

うまく選択肢が出ないときや、迷ったときは、下の文をそのまま送ってもOKです。

💬 コピーして使える文
その計画で作ってください。 作り終わったら、どうやって動かせばいいか、やさしく教えてください。

AIが作って、動かし方を教えてくれます。そのとおりにやって、画面に出たら大成功です。

💡ファイルの開き方に迷ったら：AIが作ったファイル（index.html など）は、デスクトップの myapp フォルダの中にあります。そのファイルをダブルクリックすれば、ブラウザで画面が開きます。（フォルダが分からなくなったら、AIに「このフォルダをエクスプローラーFinderで開いて」と頼んでもOK。）
⚠️もしエラー（赤い文字など）が出ても、あわてないで。それも普通のことです。
💬 エラーが出たときにコピーして使える文
こんなエラーが出ました： （エラーの文をそのまま貼り付ける） 直してください。
🌟エラー文をそのまま貼って「直して」と言えばいい——これを覚えるだけで、家でも自分で進められます。
⑤

1つだけ「育てる」

動いたら、ひとつだけ変えてみましょう（欲ばらないのがコツ）。

💬 コピーして使える文（例）
動きました！ 1つだけ追加したいです。「〇〇」できるようにしてください。
ボタンの色を青にして、文字をもう少し大きくしてください。
🌟自分の手で“育てられた”なら、もう大丈夫。家でいくらでも続けられます。

困ったときは

こんなときこうしてみる
「クレジットが足りません／Credit balance too low」と出たサブスクではなくAPI課金につながっています。/login と打ち直して「Pro（サブスク）」を選び直す。直らなければ手を挙げて。
「利用制限（Limit）に達しました」と出た短時間にたくさん話すと少しお休みに入ることがあります。あわてず手を挙げて（スタッフ端末で代わりに動かすなどフォローします）。
何か赤い文字（エラー）が出たそのままClaudeに貼って「直して」と言う。
プランモードから戻りたい／解除したいもう一度 Shift ＋ Tab を押すと通常モードに戻ります。
claude が「見つからない」と言われるターミナルを一度閉じて開き直す（STEP 2）。【Windows】それでも「認識されていません」と出るときは [Environment]::SetEnvironmentVariable("PATH", "$([Environment]::GetEnvironmentVariable('PATH','User'));$env:USERPROFILE\.local\bin", "User") を貼ってEnter → PowerShellを開き直す（詳しくはSTEP 2）。【Mac】それでも「not in your PATH」等が出るときは echo 'export PATH="$HOME/.local/bin:$PATH"' >> ~/.zshrc && source ~/.zshrc を貼ってEnter → 開き直す。
'claude' は認識されていません／is not in your PATHと出て起動しないインストールは成功しています。まず STEP 2（ターミナルを閉じて開き直す）を実行。それでも出るなら STEP 2 の PATH登録の1行を貼って Enter → もう一度開き直す。急ぐときは STEP 2 のフルパス起動で応急対応。
requires either Git for Windows or PowerShell／インストールが失敗（Installation failed）PowerShell 7 を入れる（aka.ms/powershell／PART 1「準備」参照）。Git は入れなくてOK。入れたらターミナルを開き直して STEP 1 を再実行。直らなければ手を挙げて。
画面が固まった・進まないあわてず手を挙げる。スタッフが見ます。
何を打てばいいか分からなくなった大丈夫。手を挙げてください。
症状対処
gemini: command not foundSTEP 2 のインストールをやり直す。ターミナルを開き直す。
API key not valid／認証エラーキーの貼り間違い。前後の空白や改行が入っていないか確認。
node: command not foundNode.js が未インストール → 巻末の補足へ。
RESOURCE_EXHAUSTED／429 エラーまずFlashで起動しているか確認を（gemini -m "gemini-2.5-flash" で起動し直す／入力欄で /model）。重いモデル（Pro）のままだと数回で上限に達します。Flashでも上限（1日250回・毎分10回）に届いたら、gemini -m "gemini-2.5-flash-lite" で起動し直すと、より枠の大きい Flash-Lite（1日1000回・毎分15回）に切り替えられます（軽量モデルのため回答の巧みさは少し下がりますが、体験には十分）。それでも届いたら、少し時間をおくか翌日に再挑戦。
キーを設定したのに認識されないターミナルを閉じて開き直す（環境変数の再読み込み）。
応答が返ってこない・固まった・ずっと考え込んで進まないGemini CLI では時々起こります（故障ではありません）。まず1〜2分待つ → それでも動かなければ Esc で一度中断、または Ctrl＋C で終了して gemini -m "gemini-2.5-flash" で起動し直す。重い作業で固まりがちなときは、より軽い gemini -m "gemini-2.5-flash-lite" に切り替えると安定します。それでも繰り返すなら手を挙げて。
英語で質問された・メッセージの意味が分からないあわてず、そのまま 「日本語で答えてください」 と打って送ればOK。Yes/No を聞かれているだけのことも多いので、迷ったら手を挙げて（スタッフが判断します）。
何か赤い文字（エラー）が出たそのままGeminiに貼って「直して」と言う。直らなければ手を挙げて。
プランモードから戻りたい／解除したいShift ＋ Tab、または Esc で戻れます。
🌟詰まるのは失敗ではありません。質問できることも、今日身につける大事なスキルです。

家に帰ったら（続きのやり方）

今日の体験は、ここで終わりではありません。おうちで続きができます。

  • デスクトップの 「myapp」フォルダ を開く（今日の作業部屋）
  • Windows：myappフォルダを開いた状態で、上のアドレスバーに powershell と打ってEnter → そのフォルダでPowerShellが開きます（パスを打つ必要なし）
  • Mac：ターミナルを開いて cd ~/Desktop/myapp と打つ
  • claude と打って Enter
  • gemini -m "gemini-2.5-flash" で起動（キーが認識されないときは STEP 4 をもう一度）
  • こう話しかける：
🪟 Windows でフォルダからターミナルを開く
powershell
🍎 Mac でフォルダに移動する
cd ~/Desktop/myapp
claude
gemini -m "gemini-2.5-flash"
💬 こう話しかければ、今日の続きから再開できます
前に作ったアプリの続きをやりたいです。

✏️ 家で次に試したいこと（1つメモしておきましょう）：

📘もっとAI開発に詳しくなりたい方へ：本格的なウェブ・スマホアプリ・ゲームづくりなど、「次の一歩」の準備をまとめた AI開発 便利ガイド（持ち帰り版） もご用意しました。何を・なぜ・どの順で準備すればいいかが一目でわかります。

補足：Node.js のインストール

🪟 Windows
  • https://nodejs.org/ を開く
  • 「LTS」版をダウンロードしてインストーラを実行
  • PowerShell を開き直して node -v で確認
🍎 Mac
  • 公式サイト https://nodejs.org/ から LTS版をインストール、または
  • Homebrew を使っている場合：brew install node
brew install node

もっとやってみたい方へ

「実際の仕事でちゃんと使えるところまで育てたい」「もっと色々作ってみたい」——そんな方に向けて、続きを一緒に進める場（内製化のお手伝い／フォロー講座）もご用意しています。

今日のアンケートに「次に作りたいもの」を書いていただければ、ご案内します。

最後に

今日のあなたは、「作ってもらう人」から「自分で作れる人」へ一歩踏み出しました。
その実感を、ぜひ家でも、明日の仕事でも、もう一度味わってください。

おつかれさまでした！ 🎉
📝 アンケートに回答する（約5分）

いただいた声は、次回の改善と続編の企画に活かします。