1 / 12

ワークショップ 第5部

AIコーディング事例紹介
＋まとめ

今日作ったシステムは"入口"です。
その先にどんな景色が広がっているか、のぞいてみましょう。

所要時間：45分
右矢印キー または 画面右をタップで開始
この部でやること

残り30分でお話しすること

ここまでで「AIに頼んでコードを動かす」体験はひと通り完了しました。
最後に、この延長線にある世界とうまくいくコツをお持ち帰りいただきます。

1

AIコーディングの事例紹介

実際にAIで作って運用している4つのシステムをご紹介します

2

AIにコードを書かせるコツ

今日の体験を振り返りながら、うまくいくポイントを整理します

3

まとめ・質疑応答

「AIでここまでできる」の全体像と、皆さんの質問にお答えします

はじめに

今日作ったものは、実は"入口"です

たった3つのプロンプトで、ニュース収集 → AI解説 → LINE配信 → 毎朝自動実行までつながるシステムが完成しました。
同じ延長線上で、もっと複雑なことも作れます。

今日 体験したこと

プロンプト1〜3で
シンプルな業務自動化を作った

この先にある世界

AIタスク管理／カスタマーサポート／
自動記事生成／サイト診断…

これから紹介する事例は、すべてAIと対話しながら作ったものです。
今日の「プロンプト → コード → 動かす」の延長にあります。

事例 1

AIと二人三脚で回すタスク管理

「頭をストレージから解放する」をコンセプトに、Web UIとAIを組み合わせた個人用のGTDシステムです。

タスク管理システムのアーキテクチャ図
  • PC・スマホ・タブレットどこからでも、カンバン／ガント／カレンダーで操作
  • 自然言語で「〇〇追加して」「今日の優先順位を考えて」とAIに依頼できる
  • タスクの分解・見積・週次レビューをAIが提案、最終判断は人間
  • 月額コスト0円で運用（Vercel Hobby ＋ Neon Free ＋ サブスク内AI）
事例 2

お問い合わせ回答の下書き自動化

お客様からの問い合わせに対して、AIが調査・下書き・品質チェックまで一気にやってくれます。担当者は「OK」と言うだけ。

お問い合わせ回答作成システムのプロセス図
  • コード・DB・エラーログ・決済情報を横断調査して下書きを作成
  • 正確性・表現・機密情報漏れなど8項目を自己チェック＆自動修正
  • 承認すればナレッジ化まで自動。チーム全員に即座に共有される
  • 最終判断は必ず人間。本番データの変更は一切しない設計
事例 3

マルチチャネル情報発信の自動化

今日のワークショップの"本気版"。ニュースを集めて記事化し、WordPress・Facebook・X・Instagramへ同時配信します。

情報発信自動化パイプラインの構成図
  • 曜日ごとのテーマで自動生成（月：生成AI／水：マーケ／金：DX）
  • 記事本文・アイキャッチ画像・SNS投稿文・リール動画まで全部AI
  • 最終チェックは人間。投稿するかは人が判断する"半自動"設計
  • Claude CLI × PowerShell × Python で構築
事例 4

AIが"お客様"になってサイトを診断

AIペルソナがECサイトを訪問・クリック・スクロールして、「なぜ買わずに離脱したか」を教えてくれる次世代のユーザーテストツールです。

ECいんぷるのサービス概要図
  • 属性・価値観・予算を持ったAIペルソナが実際にブラウザを操作
  • 「見て・考えて・動く」を繰り返し、離脱理由や"心のつぶやき"まで記録
  • 実際の人を集めずに、速く・安く・繰り返し検証できる
  • ChatGPT・Gemini・Claude・Grokを役割ごとに使い分けて品質を担保

サービスサイト：https://ec.impru.app

4つの事例に共通すること

どれも「AIに丸投げ」では作れません

見た目は派手でも、中身は小さな機能の積み重ねです。
そして、作る前に「何を作りたいか」を自分の言葉で整理する工程があります。

ここからが本題

どうやって「言葉だけ」で、こういうシステムをAIに作らせるのか？

その答えが、次にお話しする 「設計図」という考え方 です。
今日皆さんが体験した「プロンプト1→2→3」も、実はこの考え方の入り口だったんです。

AIにコードを書かせるコツ

「設計図」を描いてから始める

AIにコードを書かせるのは、大工さんに家を建ててもらうのに似ています。
「家を作って」とだけ伝えると、AIは立派な2階建てを建ててくれる——でも、あなたが本当に欲しかったのは平屋だった。
こんな"ミスマッチ"が、Vibe Codingでは普通に起こります。

設計図のメタファー図解

平屋か2階建てか・部屋の数・リビングの広さ・キッチンの位置・こだわりたい素材——
これを建て始める前に言葉にしておけば、AIはあなたが本当に住みたかった家を建ててくれます。

実践のコツ

覚えておきたい4つのこと

どれも特別な技術ではありません。AIと一緒に設計図を描く、その感覚がすべてです。

1

「丸投げ」から脱却する

「アプリを作って」ではAIも迷います。何を・どんな機能で作りたいのかを自分の言葉にする。

2

小さい単位で頼む

1回のお願い＝1つの機能（＝1つの部屋）。動いたのを確認してから次へ。今日のステップ1→2→3がまさにこれ。

3

AIを"相談役"にする

設計図自体もAIと一緒に作れます。「何を盛り込むと良い？」「抜けている視点は？」と聞いてみる。

4

こだわりを言葉にする

「平屋がいい」「ここは無垢材で」のように、譲れない部分を最初に伝えておくと想定通りの仕上がりに。

つまり…

今日の体験こそ、"設計図"そのもの

ワークショップで皆さんが踏んだ3つのステップは、コツ①〜④のミニ版でした。
この感覚のまま、自分の業務でも使えます。

STEP 1
タイトルだけ取る　← 小さい単位で頼む（コツ②）
STEP 2
AIに解説させる　← 会話を重ねて積み上げる（コツ②＋③）
STEP 3
LINEに送信する　← 動作確認してから次へ（コツ②）
STEP 4
毎朝自動で動かす　← 最後に"完成した家"が建ち上がる
次の一歩：自分の業務で「AIに任せたい作業」を1つ選び、設計図を書いてみてください。分からなければAIに相談役になってもらえばOKです。
おわりに

ありがとうございました！

AIはもはや「特別な人」が使うものではありません。
自分のやりたいことを言葉にできる人が使えるツールになりました。

今日の「LINEにニュースが届く」は、ほんの小さな成功体験です。
でも、ここから始まる景色は、きっと皆さんの想像を超えて広がります。

このあと
質疑応答タイム

今日のワークショップで気になったこと、自分の業務でどう活かせそうか、何でもどうぞ！