0
Vibe Coding 係咩？
兩句說話解釋清楚，你唔需要再擔心
0
💡 你就係老闆，AI 就係工人
Vibe Coding = 你講嘢，AI 幫你寫代碼。
你唔需要識任何程式語言，唔需要上任何課。就好似你喺場邊指揮，唔需要親自落場踢。
真實例子：你講「幫我做一個網頁，顯示 AS Roma 今季球員名單同主要戰績，背景用深紅色，手機睇到」→ AI 即刻幫你寫晒所有代碼，你複製貼上就完成。
你唔需要：識寫代碼 / 買新手機 / 上程式設計班 / 交任何錢
⚽ 對足球 + 乒乓球愛好者嚟講，可以用來做咩？
- ⚽ AS Roma 球員 / 賽果追蹤網頁
- 🏓 乒乓球練習記錄（記錄每次訓練成績）
- 📊 個人運動數據表（進步趨勢一目了然）
- 📱 個人名片網頁（WhatsApp 分享俾朋友）
- 🗓 比賽時間表 / 訓練日程網頁
- 🎯 旅遊行程規劃（AI 幫你排美孚周邊好去處）
1
選擇你嘅工具
香港可用 + iPhone 8 流暢 + 完全免費，推薦以下三個
1
🏆 首選：DeepSeek
中國 AI 明星公司出品，中文廣東話理解最強，香港完全可用，有 App 亦可用 Safari 打開網站版。
🐳 DeepSeek
Start a new chat
問我任何嘢…
傳送
Deep Think (R1)
Search
App Store 搜尋「DeepSeek」免費下載，或用 Safari 打開 chat.deepseek.com，用手機號或 Email 註冊即可。
✦ 備選：Google Gemini
Google 出品，香港完全可用，有 App，廣東話中文都識，免費版已經夠用。
✦ Gemini
你好，子洋！今日想做咩？
問我任何嘢，或者叫我幫你做嘢…
➤
幫我寫補習時間表
出英文練習題
做名片網頁
App Store 搜尋「Gemini」，下載 Google LLC 出品嗰個（免費），用你現有嘅 Gmail 帳號登入就得。
🔷 備選：Microsoft Copilot
唔想下載 App？直接用 iPhone 嘅 Safari 打開 copilot.microsoft.com，連帳號都唔需要，即開即用。
Copilot 最大優點：完全唔需要帳號，Safari 打開就得，最適合第一次試用。
| 工具 | 香港可用 | 免費 | 需要帳號 | iPhone 友好 | 推薦 |
|---|---|---|---|---|---|
| DeepSeek | ✅ 完全可用 | ✅ | 需要帳號 | ✅ 有 App | ★★★★★ |
| Gemini | ✅ 完全可用 | ✅ | 需要 Gmail | ✅ 有 App | ★★★★☆ |
| Copilot | ✅ 完全可用 | ✅ 完全免費 | 無需帳號 | ✅ Safari 可用 | ★★★★☆ |
2
Gemini 點登記？
有 Gmail（即 Google 帳號）可以直接跳過，你 YouTube / Google Maps 嗰個帳號就得
2
📲 App Store 下載 → 登入 → 完成
1
打開 App Store，搜尋「Gemini」
免費下載 Google LLC 出品嗰個
2
打開 App，撳「Sign in with Google」
用你嘅 Gmail 帳號登入
💡 你用緊 YouTube 或 Google Maps？代表你有 Gmail，直接用嗰個登入就得！
3
輸入電郵同密碼
同平時登入 Google 服務一樣
4
完成！主頁出現對話框，直接問就得 🎉
唔需要任何設定，可以即刻開始用
如果 iPhone 8 系統太舊（iOS 15 以下），App 可能唔支援。解決方法：用 Safari 直接打開 gemini.google.com 網頁版，一樣好用。
3
點樣問 AI 先有效？
呢個係最重要嘅技能——講得越清楚，AI 做得越好
❌
❌ 唔好咁問（太模糊）
你
幫我做個 Roma 球員頁面
DeepSeek
好的！請問你想要什麼格式？顯示幾多個球員？要加相片嗎？顏色偏好係？……
（AI 唔夠資料，只能反問你，浪費時間）
（AI 唔夠資料，只能反問你，浪費時間）
✅
✅ 應該咁問（說清楚細節）
你
幫我做一個 HTML 網頁，係 AS Roma 今季嘅球員名單，
顯示球員名字、號碼、位置，背景用深紅色同金色，
字體要大，手機睇都清楚（我用 iPhone 8），
最頂加 Roma 嘅口號「Forza Roma！」
顯示球員名字、號碼、位置，背景用深紅色同金色，
字體要大，手機睇都清楚（我用 iPhone 8），
最頂加 Roma 嘅口號「Forza Roma！」
DeepSeek
明白！我幫你做一個靚靚嘅 Roma 球員名單頁面 ⚽
<div class="roma-page">
<h1>Forza Roma！</h1>
<table> ... 球員名單 </table>
</div>
（以下係完整代碼，複製去 CodePen 即可預覽）
<h1>Forza Roma！</h1>
<table> ... 球員名單 </table>
</div>
🔑 唐子洋專用萬用公式
幫我做一個 HTML 網頁，係【用途：球員名單 / 個人名片 / 訓練記錄】，
內容係 【具體資料：球隊 / 球員名字 / 訓練日期 / 成績】，
顏色 【深紅色 / 深藍色 / 你喜歡的顏色】，
字體要大，手機睇清楚（iPhone 用戶）
內容係 【具體資料：球隊 / 球員名字 / 訓練日期 / 成績】，
顏色 【深紅色 / 深藍色 / 你喜歡的顏色】，
字體要大，手機睇清楚（iPhone 用戶）
記住：細節越多 = 效果越貼近你想要嘅。你話俾 AI 知你鍾意 Roma、住美孚、用 iPhone 8，AI 自然會做得更啱你用。
4
試做第一件作品
跟住做！做一張你嘅個人名片網頁，只需 3 分鐘
4
📋 複製以下文字，貼入 DeepSeek
長按下面嘅文字框 → 選「全選」→「複製」，貼入 DeepSeek，再把橙色括號嘅部分改成你自己嘅資料：
複製呢段
請幫我用 HTML 做一張個人名片網頁，資料如下：名字：唐子洋
地區：美孚，香港
興趣：足球（AS Roma 球迷）、乒乓球
聯絡：你的電話
要求：
- 設計要型格、簡潔大方
- 用深紅色同金色（Roma 隊色），白色文字
- 有一個「立即致電」按鈕，撳下去可以直接打電話
- 手機睇清楚（我用 iPhone）
- 最底加：「Forza Roma! 🐺」
長按上方文字框 → 揀「全選」→「複製」，去 DeepSeek App 貼上，再改返你嘅電話就得！
5
點樣睇到你嘅作品？
AI 給你代碼之後，用 CodePen 即時預覽，唔需要裝任何軟件
5
🌐 用 CodePen 預覽（最簡單方法）
1
iPhone Safari 打開 codepen.io
唔需要登入帳號，直接用
2
撳右上角「Start Coding」
或左上角「+」新增一個 Pen
3
將 AI 給你嘅代碼，全部貼入「HTML」欄
長按輸入框 → 全選 → 貼上
4
🎉 底部即時出現你嘅名片效果！
見到效果就代表成功咗
效果示意（左邊代碼，右邊你嘅名片）：
HTML
CSS
JS
<div class="card">
<h1>唐子洋</h1>
<p>Roma 球迷</p>
<p>美孚 · 香港</p>
<a href="tel:xxxx">
立即致電
</a>
</div>
<h1>唐子洋</h1>
<p>Roma 球迷</p>
<p>美孚 · 香港</p>
<a href="tel:xxxx">
立即致電
</a>
</div>
唐子洋
⚽ Roma 球迷 · 🏓 乒乓球
📍 美孚，香港
📞 立即致電
左邊係代碼（你唔需要明白），右邊係你嘅名片。係咁簡單！
6
唔滿意？叫 AI 改！
改 100 次都係免費，唔滿意直接用廣東話叫佢改
6
🔧 實際改法對話例子
你
背景顏色改成深紅色，感覺更 Roma
DeepSeek
好的！背景已改為深紅色 (#8B0000)，文字自動調整為金色確保清晰。
你
「立即致電」按鈕改大一啲，仲要改成金色
DeepSeek
搞掂！按鈕已放大至 18px 並改為金色 (#FFD700)，更易點擊 ✅
你
加多一行：「Forza Roma! 🐺」，放喺我名字下面
DeepSeek
已加入「Forza Roma! 🐺」，字體用細一啲嘅副標題格式，位置喺名字正下方。
改嘢黃金心態：做錯咗唔緊要，唔係你嘅錯。AI 唔會嫌你煩，改 100 次都完全免費！
7
子洋你可以用 AI 做啲咩？
足球 × 乒乓球 × 日常生活，AI 幫你省時間
📅 即刻可以做嘅項目
| 作品 | 難度 | 有咩用 |
|---|---|---|
| 個人名片網頁 | ⭐ | WhatsApp 分享俾朋友，型格又方便 |
| AS Roma 賽果追蹤 | ⭐ | 記錄今季賽果，一目了然 |
| 乒乓球訓練記錄表 | ⭐⭐ | 記錄每次訓練成績，睇自己進步 |
| 足球知識問答網頁 | ⭐⭐ | 考考朋友對 Roma 嘅了解 |
| 美孚附近好去處地圖頁 | ⭐⭐ | 整理附近食店 / 運動場，一頁睇晒 |
| 旅遊行程規劃頁 | ⭐⭐⭐ | 去睇 Roma 作客比賽，AI 幫你規劃行程 |
🎯 一個子洋專用嘅 Prompt
試試呢個——叫 AI 幫你整理 Roma 今季陣容：
貼入 DeepSeek 即用
我係 AS Roma 球迷，住香港美孚，請幫我做一個 HTML 網頁，顯示 Roma 2024-25 賽季主要球員名單，
包括：球員號碼、名字、位置，
背景用深紅色同金色（Roma 隊色），
最頂加大字「Forza Roma! 🐺」，
手機睇清楚（iPhone 用戶）
以前要自己慢慢格式化，依家 AI 10 秒就做好！你可以立刻用，或者叫 AI 加更多球員資料。
8
你可能會問嘅問題
子洋你唔係第一個有呢啲疑問嘅人，放心睇
❓ 我唔識代碼，AI 給我嘅嘢我完全睇唔明，咁點算？
你唔需要明白代碼！你唯一需要做嘅係「複製」同「貼上」。就好似你唔需要識造電話，但識打電話一樣。
❓ 做錯咗會唔會有什麼後果？例如刪咗乜？
完全唔會有任何後果！你只係喺網頁打字，唔會損壞你部手機、唔會刪除任何嘢。做錯關掉重開就得。
❓ iPhone 8 夠唔夠用？
夠！DeepSeek App 支援 iOS 16 或以上。如果系統夠新就用 App，唔夠新就用 Safari 打開 chat.deepseek.com 網頁版，完全一樣好用。
❓ 免唔免費？有冇隱藏收費？
DeepSeek、Gemini 免費版同 Copilot 完全免費，冇隱藏收費。你做嘅所有名片、球員名單、訓練記錄，全部唔需要課金。
❓ AI 出嘅球員資料、數據，準確唔準確？
大部分都準確，但 AI 嘅訓練數據有截止日期，最新嘅賽果或轉會資訊可能未更新。最後建議去官網或維基確認一下。
❓ 我做好嘅網頁，可以分享俾家長嗎？
可以！CodePen 做好之後可以撳「Save」，然後複製連結 WhatsApp 俾家長，佢哋用任何手機都可以打開。或者截圖發俾對方亦可以。