Vibe Coding Camp｜千日文理教育

不會寫程式，
也能做出
自己的遊戲

用 AI 工具在兩天內完成一款遊戲、一支 Reel、一個真實上線的作品集網站。帶著連結離開，不需要任何程式基礎。

📅 2天 4堂課 💻 線上進行 🎓 適合在校學生 ✨ 使用 2種以上 AI 工具 🌐 成品真實上線

立即報名 →

結業時，三個真實成品

🎮

AI 製作的遊戲

用兩種以上的 AI 工具製作，有公開連結、可以分享給任何人玩

🎬

遊戲 Reel 影片

30–60 秒的遊戲展示影片，剪輯完成可直接發 Instagram / TikTok

🌐

作品集網站

包含遊戲連結、Reel 影片、遊戲介紹的個人作品頁面，真實部署上線

這是學生在兩天內做出的遊戲

🚀

太空射擊遊戲

Space Shooter

五個完整關卡、粒子爆炸特效、炸彈清場技能、第三關解鎖三叉彈。支援手機觸控，使用 Claude + Cursor 製作。

▶ 立即試玩

🎯

第一人稱射擊 FPS

Neural Strike

第一人稱視角、波次制敵人、WASD 移動加滑鼠瞄準、換彈機制，完整的沉浸式 FPS 戰鬥體驗。

▶ 立即試玩

兩天，四堂課

DAY 1 遊戲 × 影片

堂 1・上午

AI 工具全覽＋遊戲製作實戰

工具設置、Prompt 技巧、用第一種 AI 生成遊戲雛形

堂 2・下午

第二種 AI ＋遊戲完成＋ Reel 製作

發布遊戲取得連結、錄影剪輯教學、完成 Reel demo

DAY 2 網站 × 上線

堂 3・上午

Vibe Coding 網站製作

用自然語言讓 AI 寫網站、嵌入遊戲連結與影片

堂 4・下午

文案＋美化＋部署上線＋ Demo 展示

AI 輔助寫介紹文、網站美化、Netlify 部署、成果發表

課程會用到的 AI 工具

OpenAI Codex

遊戲製作 — AI 工具 #1

Claude

遊戲強化＋網站 Vibe Coding

Cursor

AI 程式碼即時編輯環境

Gemini 1.5 Pro

圖像理解＋輔助設計發想

詳細教學流程

每堂課你會做什麼

DAY 1・堂 1 AI 工具全覽＋遊戲製作實戰（約 2.5 小時）

15 min開場與 Vibe Coding 概念
什麼是 vibe coding？AI 輔助創作的思維與正確期待
20 min工具環境設置
帳號申請、介面導覽、確保每個人都準備好
30 minPrompt 技巧核心課
怎麼跟 AI 說清楚你要什麼，壞 prompt vs 好 prompt 對比示範
60 min遊戲製作實作
用第一種 AI 工具從零生成遊戲雛形，老師示範後學生跟做
15 minQ&A ＋課後作業
想好自己遊戲的主題，截圖存好雛形

DAY 1・堂 2 第二種 AI ＋完成遊戲＋ Reel 製作（約 3 小時）

15 min複習與學生展示
每人分享昨天的遊戲雛形進度
40 minAI 工具 #2 介紹與操作
第二種工具的特性、如何與第一種搭配使用強化遊戲
45 min遊戲完成與發布
測試調整、用 AI 修 bug、取得遊戲公開連結
20 min錄影教學
螢幕錄影工具設定、掌握鏡頭節奏技巧
40 minReel 剪輯實作
CapCut 操作或 AI 影片工具，剪出 30–60 秒的 demo 影片

DAY 2・堂 3 Vibe Coding 網站製作（約 2.5 小時）

15 min網站結構說明
介紹最終作品集頁面的三區塊：遊戲連結、Reel 影片、遊戲介紹
20 min從模板開始
發放起始模板，不從空白開始，降低挫折感
60 minVibe Coding 實作
用自然語言指令讓 AI 改版面、嵌入遊戲連結與 Reel 影片
20 min常見問題排除
看不懂程式碼也能修的方法：請 AI 解釋 → 再請 AI 修
15 min老師巡堂協助
個人進度調整，處理卡關問題

DAY 2・堂 4 文案＋美化＋上線＋ Demo 展示（約 3 小時）

30 minText Wall 撰寫
用 AI 輔助生成遊戲介紹，學生只需填入關鍵字即可產出完整文案
40 min網站美化
顏色、字體、排版調整，讓網站有個人風格
30 minNetlify 部署上線
一鍵部署流程教學，取得個人網站的真實公開連結
30 min最終調整時間
自由優化，老師協助收尾所有未完成的部分
30 minDemo 展示發表
每人 2–3 分鐘展示遊戲＋網站，互相給予回饋，拍照留念

不會寫程式， 也能做出 自己的遊戲