MWC 線上課程
AI 網站架設課程
做品牌官網， 為什麼要先找設計師、 再找工程師？
以前做官網，要先請人排版面、畫設計稿，再請工程師切版、找主機、接資料庫。這堂課把中間交給 AI：NotebookLM 讀懂你的品牌、排出官網結構，ChatGPT 畫成設計稿，Codex 照著設計稿做成網頁，連可以登入改字、換圖的後台一起做。
招生準備中 · 課程價格 NT$3,000 · 開課日即將公布
課程規格
報名前你會想知道的， 先寫在這裡
8 個單元，從品牌資料一路做到網站。
- 課程內容
- 8 個單元，每個單元一支螢幕操作錄影
- 怎麼上課
- 看操作錄影，每一步點哪裡、貼什麼、AI 回什麼都看得到。不用自己寫程式
- 在哪裡看
- MWC 會員網站，用你的 MWC 會員帳號登入觀看
- 課程價格
- NT$3,000
- 開課時間
- 即將公布，開放報名時會通知你
- 你要準備
- 一台電腦、一個放好品牌資料的 NotebookLM 筆記本、ChatGPT 帳號（Codex 免費額度可能不夠做完一個網站）
- 上完你會有
- 一份官網結構規劃書、一張官網設計稿、一個有前台和登入後台的網站
為什麼需要這堂課
自己做官網， 通常卡在三個地方
- 不知道一頁要放什麼
主視覺、標題、按鈕、每一區要寫什麼，想了一個晚上，還是一張白紙。
- 叫 AI 畫，畫出來誰家都能用
直接叫 GPT 畫官網，圖很好看，內容卻很空。把品牌名字換掉，隔壁那家也能用。
- 有了設計稿，還是做不成網站
還要找人切版、找主機、接資料庫。網站做好了，改一個字也要回頭找工程師。
這堂課把三關接成一條：每一關交給一個 AI 工具，你負責把品牌講清楚。
- 起點
你的品牌資料
- 01 · NotebookLM
讀懂你的品牌，排出一頁式官網結構
- 02 · ChatGPT
把結構畫成一整頁設計稿
- 03 · Codex
照設計稿做成網頁，連後台一起做
這堂課在做的事
四件你不用再 自己動手的事
- 01不用自己排網頁結構
講一句話，NotebookLM 照你的品牌資料排出主視覺、標題、副標題、行動按鈕，還有每一區該放的文字。
- 02不用自己畫設計稿
結構貼進 ChatGPT，它畫成一整頁官網設計圖，不用另外請人排版面。
- 03不用自己切版寫程式
設計稿交給 Codex，貼一段指令，它照圖做成網頁。你不用寫一行程式碼，做壞了就叫它修。
- 04不用自己找資料庫、架後台
同一段指令裡請它順便做後台。以後改文案、換產品、加顧客評價，登入後台自己改。
差別在哪
同一個品牌官網， 兩種做法
- 叫 GPT 直接畫官網，內容很空，換個品牌名也能用先讓 NotebookLM 讀你的品牌資料，畫出來每一區都是你的內容
- 把心智圖丟給它，它只看到幾個標題丟文字結構，GPT 看得懂每一區要放什麼
- 設計稿很好看，一排卻放了五張卡片，做成網頁很容易跑版生圖時就照網頁的格線排，畫出來的圖做得成網頁
- 拿到設計稿，還要找人切版、找主機、接資料庫設計稿交給 Codex，一段指令它自己一步步做下去
- 網站做好了，改一個字也要找工程師有自己的登入後台，文案、產品、評價自己改
完整課表
8 個單元， 每個單元做完一樣東西
課前準備：一個放好品牌資料的 NotebookLM 筆記本。這堂不教怎麼建，直接從建好的筆記本開始。每一堂都是螢幕操作錄影。
- 01一句話，排出一頁式官網結構
NotebookLM 讀你的品牌資料，排出主視覺、標題、行動按鈕和每一區的文字，存成一份規劃書。
學員交付物：一份官網結構規劃書 - 02把結構畫成設計稿
結構貼進 ChatGPT 的圖像功能，畫成一整頁官網。貼之前哪些字要先刪掉，這一堂講清楚。
學員交付物：第一版官網設計稿 - 03看懂網頁背後的格線
為什麼設計稿不要一排放五張卡片。看懂格線，一眼就知道這張圖做不做得成網頁。
學員交付物：一張欄位對照表 - 04多加一句話，版面照網頁排
讓設計稿照網頁格線排、內容變簡約，之後交給 AI 做成網頁才不會跑版。
學員交付物：修正版設計稿 - 05裝好 Codex，把設計稿交出去
Mac 和 Windows 都能裝。建立新網站，附上你的設計稿。
學員交付物：一台可以開工的電腦 - 06一段指令：切版、後台、發布
照圖切版、同步做可登入修改的後台、發布到雲端，一段指令講完。
學員交付物：一段可以重複使用的切版指令 - 07看 Codex 一步步做完
前台、後台、預覽，它自己往下推。哪裡不好看，直接叫它修。
學員交付物：一個有前台和登入後台的網站 - 08想把程式碼留在自己電腦
裝好 VS Code 和兩個必裝套件，開好你的網站資料夾，之後要改隨時都能改。
學員交付物：一個設定好的 VS Code 工作資料夾
你會帶走什麼
報名開通後， 這些都是你的
- 01NotebookLM 結構指令
一句話，照貼就能用。
- 02ChatGPT 生圖指令
基本版、修正版各一份，修正版畫出來的圖做得成網頁。
- 03網頁格線對照表
滿版、左文右圖、三欄、四欄、不平均的兩欄，各佔幾欄。
- 04設計稿檢查清單
送去做成網頁之前，版面、欄數、內容量、選單逐項對一遍。
- 05Codex 切版指令
照圖切版、做後台、發布雲端，一段貼完。
- 06VS Code 必裝套件清單
哪兩個一定要裝，怎麼找到正確的那一個。
先確認再報名
這堂課適合誰，又不適合誰
適合
- 有自己的品牌，想做官網，但不知道一頁要放什麼
- 叫 GPT 畫過網頁，覺得畫出來很空，跟自己的品牌沒關係
- 手上有設計稿，卡在找不到人、也不會自己切版
- 網站做好之後，想自己改字、換圖，不想每次都找工程師
- 已經用 NotebookLM 整理過品牌資料，想接著往下用
不適合
- 還沒有任何品牌資料的人：這堂從建好的 NotebookLM 筆記本開始，不教怎麼建
- 只有手機的人：Codex 和 VS Code 都要裝在電腦上
- 想學自己寫程式碼的人：這堂教你怎麼下指令讓 AI 寫，不教程式語法
- 不打算用 ChatGPT 和 Codex 的人：畫設計稿和做網站這兩步都用它們
常見問題
報名前 你可能會想問的
可以，但內容會很空泛。這堂課的順序是先讓 NotebookLM 分析你的品牌、排出結構文字，再拿結構去生圖。這樣畫出來的是你的品牌，不是一個誰都能用的模板。
AI 網站架設課程
先把品牌講清楚， 剩下的交給 AI 做
你上次想做官網，是卡在不知道放什麼、畫不出設計稿，還是找不到人做？課程價格 NT$3,000，開課日即將公布。先留下你的名字，開放報名時第一時間通知你。
我想報名，開課通知我- 8個單元
- 6項學習資源
- 3個 AI 工具