Vibe-Coding

這不是一篇「AI 工具清單」。這是一篇我如何把 Codex App 變成一人影視製作工作台的實作紀錄。 以前，一支高完成度影片背後通常不是一個人。 你需要導演、編劇、攝影、美術、剪輯、聲音設計、動態設計，最後還要有人負責標題、封面、短影音和發行。 但現在問題變得很奇怪：如果 AI 可以幫我研究、寫稿、分鏡、生成 B-roll、做旁白、做字幕、做動畫，甚至幫我拆短影音，那一個人能不能真的逼近一間小型製片廠？ 這就是我這支影片想測試的事。 我的結論不是「AI 可以一鍵拍完一支好片」。剛好相反。 真正可行的一人製片廠，不是全自動成片機，而是一套混合系統： AI 負責壓縮製作勞動 Codex App 負責建立可重複的工作流 Remotion 負責穩定控制動畫、字卡、圖表和字幕 人負責導演判斷、剪輯判斷、聲音判斷和最終取捨 一句話說完： AI 可以壓縮製作勞動，但不能壓縮導演判斷。 下面是我實際用 Codex App 建立「一人製片廠」的流程。 1. 先不要急著裝一堆 AI 工具 很多人開始做 AI 影片，第一反應是去研究最新工具：哪個模型畫質最好、哪個可以圖生影片、哪個可以做配音、哪個可以做字幕。 但我這次反過來。 我不是先問：「我要用哪些工具？」 我先問：「一支影片到底需要哪些判斷？」 因為影片不是一串素材。影片是一連串判斷： 題目值不值得拍？ 前 5 秒要用什麼衝突抓住觀眾？ 哪一段需要圖表？ 哪一段需要 B-roll？ 哪一顆鏡頭是建立世界觀？ 哪一顆鏡頭只是裝飾？ 哪裡要加速？ 哪裡要停下來？ 聲音在哪裡要有壓力？ 觀眾看完後記得哪一句話？ 所以我在 Codex App 裡建立的不是「工具箱」，而是「製作工作台」。 2. 建立專案資料夾：讓每一步都有地方沉澱 我先請 Codex App 建立一個 video essay 專案資料夾。 我用的指令大概是： 幫我建立一個 video essay 製作工作台。 題目是：我能不能用 AI 做出一間「一人製片廠」？ 請建立資料夾、prompt templates、研究文件、腳本文件、分鏡表、發行計畫。 接著我把專案整理成這樣： ...

很多人用 AI 寫程式還停留在「請它產生一段程式碼」，但把 Codex 放進 VS Code 後，流程會更接近真正的開發協作：看檔案、改檔案、跑測試、再根據錯誤修正。這支影片就是用實作方式測試它能不能真的協助做出 App。 影片連結：https://www.youtube.com/watch?v=tO2Qv9rtUck 和一般聊天機器人不同的地方 它可以理解專案檔案脈絡。 它能把需求拆成多個修改步驟。 它可以配合終端機輸出修正錯誤。 適合拿來做什麼 快速做原型。 重構既有小工具。 補 UI、文案、樣式與測試。 把教學影片內容整理成可下載資產。 使用建議 需求越具體，結果越穩。 每次改動後都要實際跑起來看。 不要一次要求它改太大範圍，分段比較容易控制。 小結 這篇先把影片內容整理成可搜尋、可回來查的文字筆記。後續如果我有補充更多實測資料、指令或範例，也會再把文章更新得更完整。

很多人想到動畫就會想到 After Effects，但如果你要做的是可重複產生的文字動畫、教學片段或社群影片模板，Remotion 這種用程式產生影片的方式會很適合。搭配 Antigravity，就可以用 AI 協助建立動畫元件。 影片連結：https://www.youtube.com/watch?v=8xQ3C0ZGskE 這種做法的優點 動畫可以變成程式碼，方便重複修改。 文字、顏色、時間軸可以參數化。 適合做系列影片的固定模板。 影片中提到的工具 Remotion：https://www.remotion.dev Antigravity：https://antigravity.google 適合用在哪裡 YouTube 開場動畫。 教學影片重點提示。 短影音字幕與打字效果。 產品功能展示。 小結 這篇先把影片內容整理成可搜尋、可回來查的文字筆記。後續如果我有補充更多實測資料、指令或範例，也會再把文章更新得更完整。

前幾天我有分享過 Apple Intelligence 最新的「相片物件移除」功能，效果真的非常驚人。但是！要用這個功能門檻可不低，首先你的設備要支援 Apple Intelligence（通常要最新的 iPhone 15 Pro 或 M 系列電腦），而且必須在蘋果的相簿生態系裡操作。 這時候我就在想，難道沒有免費、跨平台，而且舊電腦也能用的替代方案嗎？🤔 當然有！今天這篇文章要帶大家重溫一個強大的開源專案 IOPaint（前身是 Lama Cleaner），更酷的是，我還挑戰了最近很紅的 Vibe Coding，直接叫 AI 幫我寫出一個精簡版的修圖工具 MagicErase。不管你是想用現成工具，還是想體驗 AI 寫程式的威力，這篇教學都不能錯過！ 方案一：功能強大的老牌王者 IOPaint 其實早在三年前，我就介紹過一個叫 Lama Cleaner 的專案，現在它改名叫 IOPaint。雖然作者在今年 8 月停止更新了，但這整個專案非常完整，功能包含移除物件、替換背景等等，效果完全不輸付費軟體。 安裝步驟 (MacOS/Windows 通用) IOPaint 是一個 Python 專案，我們可以透過終端機來安裝。 準備環境：確認你的電腦已安裝 Python（建議使用 Conda 建立虛擬環境）。 下載專案： 前往 GitHub 複製 IOPaint 的網址，在終端機輸入： git clone [IOPaint的GitHub網址] 進入資料夾並安裝依賴： cd IOPaint pip install -r requirements.txt 啟動程式： 輸入啟動指令（這會自動下載需要的 AI 模型）： iopaint start --model=lama --device=cpu --port=8080 開始修圖： 開啟瀏覽器，進入顯示的 Localhost 網址，你就會看到操作介面啦！ 只要把照片丟進去，用筆刷塗抹你想消除的路人或雜物，AI 就會自動幫你補好背景，超級神奇！✨ ...

各位觀眾朋友大家好，這裡是程式猿 AFA。 這篇文章整理我在影片裡的完整流程：用 Vibe Coding（氛圍編碼） 生成一個 Hugo 靜態個人網站，部署到 GitHub Pages，並且在你已經購買網域的前提下，把 Cloudflare 網域 掛到 GitHub Pages，讓網站可以用「自己的網域」直接開啟。之後我也會把影片裡可能遺漏、或需要補強的部分，持續整理放在網站上。 你會用到什麼 Google Antigravity AI 編輯器（目前以 macOS 為主） Hugo（本機端預覽用） GitHub Repo（用來放網站原始碼與 GitHub Pages） Cloudflare（你若要使用自訂網域） 1) Antigravity 先設定成繁體中文（介面 + 生成內容） 為了讓操作與產出更順手，我會先做兩個設定： A. 介面繁體中文 到 Extensions（延伸模組） 搜尋並安裝 Chinese Language（或相近名稱的中文語言套件） 安裝後介面會切成繁體中文/中文介面（依套件而定） B. Agent 回答與檔案內容使用繁體中文 在 Agent 右側「三個點」 點 客製化（Customize） 新增一個條件（例如：「請一律用繁體中文回覆並生成檔案」） 之後它的回答、以及生成的檔案內容就會以繁體中文為主 2) 用 Vibe Coding 生成 Hugo 網站專案 在下載位置建立一個資料夾（例如：Blog） 在 Antigravity 裡 Open Folder 打開 Blog 模型你可以選： Gemini 最新模型 Claude 最新模型 提示詞重點包含： 部落格名稱（例如：appfromape's blog） 使用 Hugo 靜態網站 目標部署到 GitHub Pages 風格要接近 Apple 備忘錄（簡潔、留白、閱讀感） 需要 .gitignore（避免把不該上傳的檔案推到 GitHub） 3) 本機端預覽網站（macOS / Windows） 生成完成後，我會先在本機看一下網站目前長相是否滿意。 ...

今天這篇文章非常興奮，因為我們要來玩現在最流行的 「Vibe Coding」（氛圍編碼）！簡單來說，就是即便你不懂艱澀的程式碼，只要透過 AI 工具，用自然語言告訴它「你想要的感覺」，就能把網站做出來。 我們要使用的工具是 Google 推出的 AI 程式碼編輯器 —— Google Antigravity。我會教大家如何用它生成一個高質感的個人部落格，並且利用 GitHub Pages 免費架站，最後甚至掛上自己的專屬網域！ 為什麼選擇 Google Antigravity？ Google Antigravity 是一款強大的 AI 編輯器（介面與 VS Code 相似），它最厲害的地方在於可以直接理解我們的自然語言指令，幫我們寫 Code、生成檔案。 對於想要嘗試 Vibe Coding 的新手來說，你不需要從頭學 HTML 或 CSS，只需要負責「下指令」，剩下的交給 AI 搞定。這篇教學會示範如何用它搭配 Hugo（靜態網站產生器），做一個類似 Apple Notes 風格的簡約網站。 準備工作 在開始之前，請確保你準備好以下工具： Google Antigravity：請至 Google 官網下載安裝（目前主要支援 MacOS）。 GitHub 帳號：用來存放網站原始碼與免費代管。 基本環境：電腦需安裝 Git 與 Hugo（稍後會教大家怎麼裝）。 Step 1：下載與設定 Antigravity 下載安裝：前往 Google 官網下載 Antigravity 並安裝。 中文化設定： 打開 Antigravity，點選左側的「Extensions」（擴充套件）。 搜尋 “Chinese”，安裝繁體中文語言包，重啟後介面就會變成親切的中文了。 AI 繁中優化： 點選介面右上角的三個點（或 AI 設定），選擇 「Customize」（客製化）。 新增一個條件：「請使用繁體中文回答」。這樣之後 AI 幫你寫 Code 或解釋時，就不會滿口英文，溝通更順暢。 Step 2：Vibe Coding！一句話生成 Hugo 網站 這是最神奇的一步！我們不需要自己建立檔案，全靠 AI。 ...

對做開發的人來說，技術文章最好是放在自己掌控的地方，而不是完全寄託在 Medium 或社群平台。這篇文章會帶你一步步把 Hugo + PaperMod 部落格，部署到 GitHub Pages 上，達到： 架站成本 = 0（GitHub Pages 免費） 內容掌握度高（Markdown 寫作 + Git 版控） 版型清爽、有暗色模式、支援程式碼區塊（PaperMod 主題） 只要你已經有 GitHub 帳號、願意開一下終端機，大概 30–60 分鐘就能把自己的技術部落格跑起來。 一、為什麼是 Hugo + PaperMod + GitHub Pages？ Hugo：Go 寫的靜態網站產生器，生成速度快、部署簡單，只要丟一堆 HTML/CSS 到 GitHub Pages 就能跑。 PaperMod 主題：設計簡潔，預設就支援： 深 / 淺色模式切換 程式碼語法高亮 文章目錄、Tag、分類等技術 blog 需要的元素 GitHub Pages：不用自己維護伺服器，不用管 Nginx / Apache，只要 push 到指定 branch，就會自動幫你上線。 這組合非常適合： 想建立作品集 / 技術筆記 不想維運伺服器 本來就用 GitHub 管理專案 二、前置準備 你需要先準備好： GitHub 帳號（免費版就足夠） ...

這是我的第一篇文章，用 Hugo + GitHub Pages 架起來的個人網站。 之後會在這裡整理我的 YouTube 頻道、AI 工具筆記和 vibe coding 教學。