Appearance
スクール概要
講座のゴール
2日で、動くアプリを完成させ、公開する
最低限できるようになること
AI開発環境を作る
Webページを作る
データベース付きのWebアプリを作る
要件定義（作りたいものを的確に伝える）をAIと一緒に進められる
オリジナルアプリを作って「世界に公開」する
運用のための、セキュリティと法律を理解する
TECHCAMPとの差別化
- 全員が完走できる設計
- TAのサポートで、できない人をゼロにする
- Skillを使いこなして、UIUXのいいものを出す
- アウトプットのちょっとした品質で差別化
- LPの成果物の見栄えも良くなる
AIを"使う"だけでなく、AIを使って"作って形にする" AIに作らせるための設計・指示・検証・公開の一連の流れを体験し、再現できる状態
基本思想
- プログラミングは理解しなくてOK
- 時間が限られるので詰め込みすぎない
- 全員が完成まで走り切らせる運営、遅い人を置き去りにしない（TAのサポート）
- 小さな成功体験を積ませる（見える成果）
- 成功＝「理解」ではなく **"画面が変わる / 動く / URLで見せられる"**で定義
- Skillsで UI/UXを磨き込み
技術選定
開発環境
- ClaudeCode
- GitHub
- ターミナル (DesktopアプリやWebに変わるかも)
言語・フレームワーク
- Typescript
- React (Next.js)
デプロイとDB (アカウント分散を避け、課金や管理もシンプルにする。)
- Vercel
- Vercel Postgres
必要なアカウント作成
- Claude Pro
- GitHub
- Vercel
カリキュラム
DAY1：AIとの「共同開発」を体験する日
| 時間 | セッション | 内容 | ゴール |
|---|---|---|---|
| 10:00〜10:30 | オリエンテーション | 2日間の流れと完成イメージを共有 | 2日間の流れと完成イメージが理解できている |
| 10:30〜11:30 | 環境構築 | GitHub、ClaudeCodeセットアップ、ターミナル基本操作 | ClaudeCodeでAIに指示が出せる状態 |
| 11:30〜13:00 | Webサイト作成&公開 | 「自己紹介ページを作って」と指示→生成→ブラウザで確認→Vercelにデプロイ | 🎉 自分のWebサイトがURLで世界に公開されている |
| 13:00〜14:00 | 休憩 | - | - |
| 14:00〜15:30 | Webアプリの土台作り | AIに「ToDoアプリを作って」と指示→プロジェクト生成→ブラウザで確認 | AIへの指示でアプリの土台ができている |
| 15:30〜17:00 | データを保存できるアプリへ | Vercel Postgres設定、ToDoの追加・表示・編集・削除ができるようにする | ToDoを追加→表示→編集→削除できる |
| 17:00〜18:00 | デプロイ | サンプルアプリをVercelにデプロイ | 🎉 データが保存されるアプリがURLで公開されている |
| 18:00〜19:00 | Q&A | 本日の疑問を解消 | 疑問が解消されている |
| 19:00〜 | 宿題について | 明日作るオリジナルアプリのアイディア出し | 明日作るアプリのイメージを考えてくる |
DAY2：「アイディア」を「完成品」にする日
| 時間 | セッション | 内容 | ゴール |
|---|---|---|---|
| 10:00〜11:00 | 要件定義の方法 | AIと一緒に「作りたいもの」を整理する方法を学ぶ | 「何を作るか」を言語化できる |
| 11:00〜12:00 | セキュリティ・法律 | 機密情報の取り扱い、利用規約、個人情報プラポリ | やっていいこと・ダメなことが分かる |
| 12:00〜13:00 | AIへの指示の出し方 | うまくいかない時の対処法、効率的な指示の出し方 | 困った時にどうすればいいか分かる |
| 13:00〜14:00 | 休憩 | - | - |
| 14:00〜15:00 | アプリ内容・構成決め | 各自のオリジナルアプリの内容を決める、講師がフィードバック | 🎉 要件定義、機能リストが確定している |
| 15:00〜19:00 | アプリ開発の実践 | 各自のアイディアをAIと一緒に開発。林・コーチが巡回し、個別にQ&A・修正をサポート | 🎉 オリジナルアプリがVercelで動いている |
| 19:00〜19:30 | 成果発表 | 完成したアプリをみんなの前で発表、URLをシェア | 自分のアプリURLを人に見せられる |
| 19:30〜20:30 | クロージング | 振り返り、1ヶ月チャットサポートの案内、アップセル | 🎉 2日間の成果物が手元にある |
サポート体制
- コーチが巡回し、個別にQ&A・修正をサポート
- 「わからない」を放置しない（10分以上詰まったらすぐ質問）
- 全員が完走できる運営
追加カリキュラム（早く終わった人向け）
基本カリキュラムが終わった人は、以下から好きなものに挑戦できます。
DAY1用：Webサイト・サンプルアプリが終わった人
| レベル | テーマ | 内容 | 成果物 |
|---|---|---|---|
| ⭐ | Webサイトのデザインを変える | 「ダークモードにして」「色を青系にして」等、見た目を変更 | 自分好みのデザインのWebサイト |
| ⭐ | Webサイトにページを追加 | 「趣味のページを追加して」と指示して複数ページに | 複数ページのWebサイト |
| ⭐ | サンプルアプリのUI改善 | Skillsを使ってToDoアプリの見た目をプロっぽく | 見た目がレベルアップしたアプリ |
| ⭐⭐ | サンプルアプリに機能追加 | 「検索機能をつけて」「期限を設定できるようにして」等 | 機能が増えたToDoアプリ |
DAY2用：オリジナルアプリが終わった人
| レベル | テーマ | 内容 | 成果物 |
|---|---|---|---|
| ⭐ | UI/UXを磨く | Skillsを使ってデザインをプロっぽく改善する | 見た目がレベルアップしたアプリ |
| ⭐ | 機能を追加する | 「検索機能をつけて」「並び替えできるようにして」等 | 機能が増えたアプリ |
| ⭐⭐ | 画像を使う | 「画像をアップロードできるようにして」と指示 | 画像が扱えるアプリ |
| ⭐⭐ | 認証をつける | ログイン機能をつけて、ユーザーごとにデータを分ける | ログインできるアプリ |
| ⭐⭐⭐ | 別のアプリを作る | 習ったことを活かして、2つ目のアプリを作ってみる | 2つ目のオリジナルアプリ |
DAY2用：別アプリでに挑戦する例
| レベル | ジャンル | 説明 |
|---|---|---|
| ⭐⭐ | AI連携 | ChatGPTなどAPIを使ったエージェントアプリ |
| ⭐⭐ | ブラウザ拡張 | Chrome拡張機能 |
| ⭐⭐ | GAS | Googleサービスの自動化（スプレッドシート、Gmail等） |
| ⭐⭐ | Bot | LINE Bot、Slack Bot、Discord Bot等 |
| ⭐⭐ | ゲーム | 簡単なブラウザゲーム、2Dゲーム等 |
| ⭐⭐⭐ | スマホアプリ | iOS/Android向けアプリ（Flutter, ReactNative） |
| ⭐⭐⭐ | デスクトップアプリ | Windows/Mac向けアプリ（Electron） |