Select Page
Grill Me 是什麼?讓 AI Agent 開工前先問清楚需求

Grill Me 是什麼?讓 AI Agent 開工前先問清楚需求

很多 AI Agent 做不好,不是因為模型太弱,而是任務在一開始就太模糊,使用者一句「幫我做一個工具」、「幫我寫一個遊戲」、「幫我規劃一個工作流」,Agent 會很認真地往前衝,但它其實是在替你補完一堆你沒有講清楚的決策。

Grill Me 這類 skill 的價值,就在於把「開工前的需求訪談」變成固定流程,它不急著執行,而是先反過來問你:目標是什麼?使用者是誰?限制在哪裡?哪些選項還沒決定?什麼事情一定不能做?這一步看起來慢,實際上是在幫你省掉後面反覆重做的時間。

如果你已經在用 Codex、Claude Code、Cursor、Windsurf 或 OpenCode 這類工具,這篇可以當成一個提醒:真正拉開成果差距的,不只是模型版本,而是你有沒有一套讓 Agent 開始前先釐清需求的工作流。站上之前整理過 OpenWork / OpenCode 桌面工作台,那偏向執行環境,這篇談的是執行前的需求對齊。

先講結論:不要太快叫 Agent 開始做事

AI Agent 最常見的失控點,是使用者以為自己已經講清楚,但其實只講了一個方向,人類同事遇到模糊需求,可能會回頭問你,Agent 則常常直接開做,做出一個看起來完整、但不是你真正想要的東西。

Grill Me 的做法很簡單:在實作前先訪談。它會針對任務目標、使用場景、輸出格式、限制條件、技術選擇、驗收標準一路追問,直到這個任務足夠明確,Agent 才開始真正執行。

這不是把 prompt 寫長而已,而是把「需求還沒完成」這件事明確暴露出來,對我來說,這是使用 AI Agent 很重要的一個分水嶺:你不是把一段模糊想法丟給模型猜,而是先和模型一起把決策樹走完。

Grill Me 是什麼?

Grill Me 來自 Matt Pocock 的 skills 倉庫,這個倉庫不是單一工具,而是一組可安裝到 AI coding agent 裡的工作流程 skill,包含需求訪談、文件對齊、規格整理、TDD、debugging、code review 等。

我在 2026 年 7 月 9 日查看 GitHub API 時,這個倉庫已經超過 16 萬顆星,授權是 MIT,README 裡的定位也很明確:這些 skill 是小型、可調整、可組合的流程,而不是把整個開發過程交給一套巨大框架接管。

Grill Me 本身很短,核心是啟動一段 grilling session,也就是讓 Agent 對你的計畫或設計進行密集訪談。它不是替你做決策,而是逼你把原本藏在腦袋裡的決策說出來。

為什麼「需求訪談」會讓結果差很多?

用「做一個側邊欄貪食蛇遊戲」這種需求來看,沒有訪談時,Agent 也能做出一個可玩的版本。它可能有開始按鈕、分數、速度調整,也能用鍵盤操作。表面上看起來不差。

但只要開始追問,需求會變得完全不一樣:這個側邊欄是 Codex 裡的小工具,還是瀏覽器側邊欄?它是一次性 demo,還是要固定留下來?等待 Agent 工作時能不能玩?鍵盤焦點可能不在遊戲上,是否需要畫面按鈕保底?撞牆要不要死亡?分數要不要保存?記錄要不要能清除?

這些問題不是細枝末節,而是產品體驗的骨架。當它們沒有被問出來,Agent 只能照自己的預設做,當它們被問出來,Agent 才能把設計、互動、資料保存、通知機制都接到同一個使用情境上。

一個好用的 Grill Me 流程,應該問哪些問題?

我會把這類訪談問題分成七組。你不一定要每次問滿,但至少要讓 Agent 在開工前碰過這些維度。

  • 目標:這次任務真正要改善什麼?成功之後看起來是什麼樣子?
  • 受眾:誰會使用這個成果?是自己用、團隊用、客戶用,還是公開產品?
  • 場景:使用者會在什麼時間、什麼裝置、什麼流程裡使用它?
  • 限制:不能用哪些技術?不能改哪些檔案?不能花太多時間在哪裡?
  • 輸出:最後要交付文章、程式、規格、PRD、測試、圖片,還是一組可執行步驟?
  • 驗收:怎樣才算完成?要不要測試?要不要截圖?要不要能回滾?
  • 禁區:哪些事情不要做?哪些語氣、設計、依賴、資料來源要避開?

站上之前寫過 CO-STAR prompt 框架,那套方法適合把指令寫得更完整;Grill Me 則更像互動式版本,讓 Agent 透過追問幫你補齊缺口。

Matt skills 倉庫才是核心資源

Matt Pocock 的 skills 倉庫。這個連結比一般工具推薦更重要,因為 Grill Me 不是孤立存在,它其實是整套工作流的一個入口。

這套 skill 大致分成 engineering 和 productivity,Grill Me 屬於 productivity,適合非程式任務或早期想法釐清;Grill with Docs 則偏 engineering,會把訪談結果延伸到專案文件、domain model、ADR 等長期維護資料。

這也呼應我之前整理的 Matt Pocock Skills 工作流:真正有價值的不是某個單點技巧,而是把訪談、規格、測試、程式碼審查變成一套固定節奏。

Grill Me 不是讓 AI 變聰明,而是讓任務變清楚

用了 Grill Me,不代表模型突然變成更高階版本,也不代表結果一定完美,它真正改善的是「任務定義品質」。

模糊任務的問題在於,Agent 會把大量隱性選擇變成自己的預設,比方說你說「做一個工具」,它要猜是網頁、CLI、桌面 app 還是瀏覽器插件;你說「幫我寫文章」,它要猜讀者是新手、工程師、主管還是 SEO 流量;你說「做得好看」,它要猜品牌、風格、資訊密度、互動狀態。

Grill Me 把這些猜測改成問題。當問題被回答,Agent 的輸出就不再只是「通用答案」,而會更貼近你的真實情境。

我會怎麼把 Grill Me 放進自己的 Codex 流程?

如果是新專案,我會把流程拆成四步。

  • 第一步,用 Grill Me 釐清需求。先不要寫程式,先讓 Agent 問到目標、限制、驗收方式都清楚。
  • 第二步,把訪談整理成規格。可以轉成 PRD、spec 或 issue,避免後面上下文掉失。
  • 第三步,用 TDD 或驗收清單鎖住品質。讓 Agent 先知道什麼叫完成,而不是做完才補救。
  • 第四步,讓 code review / debug 流程收尾。不要把「看起來能跑」當成完成。

這條路線和 用 Superpowers 建立 AI 開發紀律的方向很接近:不要把 Agent 當一次性神諭,而是把它放進一套有檢查點、有回饋、有驗收的流程。

安裝 skill 前,先想清楚你要它解決什麼問題

很多人看到 skill 倉庫,第一反應會是全部安裝。這可以,但我更建議先從自己的痛點倒推。

如果你常常覺得 Agent 做出來的東西方向不對,先試 Grill Me。若你已經有專案文件,但 Agent 老是誤解術語和架構,可以研究 Grill with Docs。若你遇到的是改一處壞三處,TDD 和 debugging 類 skill 會更有幫助。

如果你想自己建立類似流程,也可以回頭看 用 skill-creator 建立自訂技能。真正好用的 skill,通常不是把所有規則塞滿,而是把一個高頻問題變成可重複執行的流程。

可以直接拿去用的 Grill Me 提示詞

如果你還沒安裝 skill,也可以先用下面這段作為替代版,它不如正式 skill 可維護,但已經能改善很多「太快開工」的問題。

在開始執行前,請先訪談我。
你要把我的需求問清楚,而不是直接開始做。

請一次只問 1 到 3 個最關鍵的問題。
每個問題請附上你的推薦答案,以及為什麼你推薦這樣選。
當你認為需求、限制、輸出格式、驗收標準都足夠清楚後,
請先整理一份任務規格給我確認。
等我明確說「開始執行」之後,你才可以動手。

這段的重點有三個:一次不要問太多、問題要附推薦答案、最後要整理成規格再等確認,這樣做可以避免 AI 把訪談變成問卷疲勞,也能讓使用者比較快做決策。

AI Agent 的品質,常常卡在開工前

Grill Me 給我的最大提醒是:不要把所有問題都歸咎於模型。很多時候,Agent 不是不會做,而是它根本不知道你真正要的是哪一種成果。

需求訪談不是形式,它是把模糊想法變成可執行任務的過程。當目標、場景、限制、輸出和驗收都被問清楚,Agent 才有機會交出真正能用的結果。

我會把 Grill Me 放在 AI Agent 工作流的第一關。不是因為它很華麗,而是因為它解決了一個最基本、也最常被忽略的問題:開始之前,先確定大家要做的是同一件事。

延伸資源

AISA 是什麼?一個 API Key 讓 AI Agent 連上 X、YouTube、股票與支付

AISA 是什麼?一個 API Key 讓 AI Agent 連上 X、YouTube、股票與支付

AISA 最有意思的地方,不是「又多一個 API 聚合平台」,而是它把 AI Agent 真正需要的外部能力,整理成一個可以被 agent 呼叫的資源層。

以前要讓 agent 查 X/Twitter、找 YouTube 競品、讀股票資料、換不同模型、甚至呼叫付費 API,常常要準備一堆帳號、一堆 API Key、一堆 OAuth 設定和一堆帳單。

AISA 想做的事很直接:用一個 API Key,把模型、資料源、Skills 和機器支付放到同一個入口。

這個方向對 AI Agent 很重要。模型本身再聰明,如果不能拿到即時資料、不能安全地調用工具、不能控制支出,它還是停留在「回答問題」而不是「完成任務」。AISA 的定位,就是補上這一層。

AISA 是什麼?不是只有模型 Gateway

從官方頁的說法來看,AISA 是面向 Agent Economy 的能力層與交易網路。它包含模型 gateway,但不只是模型 gateway。官網 FAQ 明確提到,AISA 讓 agent 用一個 API Key 和統一帳單關係,在同一處存取模型、API、資料源、Skills,以及機器對機器支付能力。

這裡的差異很關鍵。像 OpenRouter 這類多模型統一平台,主要解決「不同模型如何用同一套 API 呼叫」;AISA 更進一步,把資料 API、封裝技能、金融資料、社群資料、搜尋能力和機器支付也放進同一個 agent 工作流。

換句話說,AISA 想解的不是「我要用哪個模型」,而是「我的 agent 要怎麼真的去外面做事」。

一個 API Key 可以接哪些能力?

官方 `llms.txt` 把 AISA 定義成 autonomous AI agents 的 unified API gateway,列出的範圍很廣:GPT、Claude、Gemini、Grok、DeepSeek、Qwen、Kimi、MiniMax、GLM 等模型,還有 100+ data APIs、Agent Skills 和 stablecoin payments。

官網頁面也把幾個能力直接列出來:Tavily 網頁搜尋、YouTube 搜尋、X/Twitter 公開資料、金融市場資料、預測市場、Agent Mail、Circle 小額支付、Machine Payments Protocol。對 agent 來說,這些不是靜態資料庫,而是可以被工作流呼叫的「手腳」。

能力類型AISA 提供的方向適合的 Agent 任務
模型 GatewayGPT、Claude、Gemini、DeepSeek、Qwen 等模型推理、寫作、程式、長上下文分析
X / TwitterTwitter API、Twitter Autopilot、X Intelligence Automation輿情監控、發文、互動、自動整理趨勢
YouTubeYouTube Search、YouTube SERP選題研究、競品內容分析、頻道資料整理
金融與市場股票、Crypto、Prediction Market、MarketPulse研報、行情追蹤、事件監控
機器支付x402、Circle Nanopayments、MPP按次付費 API、agent 自主購買資料或服務

這也回應了第一則留言裡的需求:有人正在找這類資料資源,想讓 Agent 幫忙發推文。AISA 的 X/Twitter Skills 正好對應這種場景。重點不是讓模型「想像社群趨勢」,而是讓 agent 真的去讀公開資料、整理噪音、再決定要怎麼輸出。

X、YouTube、股票資料:Agent 要有真實世界的入口

AI Agent 很容易卡在一個地方:它可以推理,但沒有即時資料。

問它今天 X 上 AI Agent 的討論方向,它如果沒有工具,就只能靠舊知識猜,問它 YouTube 上某個主題競爭激不激烈,它如果沒有搜尋能力,就只能給你方法論,問它最新財報,它可能知道公司很大,但不知道最新數字。

AISA 的價值,是把這些「資料入口」變成 agent 可以安裝和調用的 Skills,X/Twitter 可以做輿情和發文,YouTube 可以做選題研究,金融 API 可以做股票研報,搜尋 API 可以補足即時資訊。這時候 agent 才比較像一個能工作的小助手,而不是只會聊天的模型。

這條路線也可以和你站上之前整理的 Claude Code Workflow 放在一起看:Claude Code、Codex 或其他 CLI agent 是工作介面,AISA 則比較像它們背後的外部能力層。

Skills 的意義:把「會回答」變成「會操作」

AISA 文件中列出的 Skills 很多,從 Twitter Autopilot、YouTube Search、SEO Keyword Research,到 US Stock Analyst、Stock Portfolio、Perplexity Deep Research、Multi-source Search 都有。這裡真正值得看的不是數量,而是 Skills 把任務包成 agent 能理解的操作流程。

同一個問題,有沒有 Skill,結果會差很多。沒有 Skill 時,模型可能只能說「你可以去查財報」。有 Skill 時,agent 可以知道要調哪個 API、要拿哪些欄位、資料錯了要去哪裡補、最後怎麼整理成報告。

這跟前面談過的 Ornith 1.0 自己拆任務、搭 scaffold 的方向其實有點像:模型不是只輸出答案,而是要有一套能完成任務的流程。AISA 則把外部 API 和 Skills 變成這套流程可以調用的零件。

x402 與機器自主付款:很酷,但一定要有護欄

AISA 官網也把機器對機器支付列為核心能力之一,包含 Circle Nanopayments、Machine Payments Protocol,以及 x402 / HTTP 402 風格的支付流程。

HTTP 402 Payment Required 這個狀態碼很早就存在,但以前沒有真正成為日常網路支付流程。x402 類協議讓 agent 呼叫受保護端點時,可以收到付款要求,完成結算,帶著付款證明重試請求。這對付費 API、資料服務、agent-to-agent 交易很有想像空間。

用白話講,402 不是一般錯誤,而是一種「這個資源要先付費」的握手訊號。Agent 第一次呼叫付費 API 時,服務端可以回傳 HTTP 402,並附上價格、收款地址、可用付款網路、付款證明格式和過期時間。Agent 不需要猜怎麼付錢,而是照著這份付款要求完成結算,再把付款證明帶回去重送同一個請求。

AISA 與 x402 讓 AI Agent 自主付費的架構圖

這裡要分清楚一件事:不是把信用卡號交給模型,也不是讓模型任意花錢。比較安全的設計是讓 Agent 只取得「受限制的付款能力」:例如只允許特定 API、單次最高 0.05 美元、每日最高 1 美元、只讀資料可以自動付款、發文或交易則要人工確認。

AISA 在這裡扮演能力層與記帳層,幫 agent 把 API、付款握手、用量紀錄和預算控制串起來。

AI 自己付錢的 6 個步驟

AI Agent 透過 HTTP 402 與 x402 自己付錢的六步驟流程圖
  1. Agent 呼叫付費 API,例如查即時金融資料、X 資料或高價值搜尋結果。
  2. 服務端回 HTTP 402 Payment Required,告訴 agent 這次請求需要付款,並提供價格、收款地址和付款格式。
  3. AISA 或 agent runtime 檢查政策:這個服務是否在白名單內、金額是否低於單次上限、今天預算是否還夠。
  4. 若通過檢查,錢包用 USDC 或支援的付款方式簽名付款,產生 payment proof。
  5. Agent 帶著付款證明重送請求,通常會把 proof 放在 header 或協議要求的位置。
  6. 服務端驗證付款有效後回傳資料,AISA 同步記錄誰呼叫、花多少、成功或失敗。

不過這裡不能只看酷炫的一面。Agent 能自己付費,就代表它也可能亂花錢、重複呼叫、被錯誤 prompt 帶偏,甚至被惡意服務誘導。AISA FAQ 提到可以發放 API Key、監控用量、設定預算或限額,這是必要條件,不是加分功能。

  • 先用低額度測試,不要一開始就給大額預算。
  • 把可呼叫服務設白名單,尤其是會產生費用的 API。
  • 設定單次、每日、每月限額。
  • 高風險動作先要求人工確認,例如發文、寄信、交易、付款。
  • 保留完整日誌,能看出哪個 agent、哪個 skill、哪次呼叫花了多少錢。

這也是 AI Agent 進入實際工作流後一定會遇到的問題:能力越大,權限邊界就越重要。你可以把它和 自學型 AI Agent 一起看,兩者都指向同一件事:agent 不只是變聰明,還要能被管理。

怎麼開始接入?先用 llms.txt 讓 Agent 讀懂平台

AISA 官網給了一個很適合 agent 使用的入口:讓 agent 先讀 `https://aisa.one/docs/llms.txt`,再依照目前環境安全地連接、配置並使用 AISA 的 API、Skills 和 LLM。

閱讀 https://aisa.one/docs/llms.txt,幫我在這個 agent 環境中安全地連接、配置並使用 AISA 的 API、Skills 和 LLM。

實務上可以分三步走:先到 AISA Console 的 get-started 頁面註冊並取得 `AISA_API_KEY`,再把 key 放進 CLI agent 或 IDE agent 的環境變數,最後挑一個低風險 Skill 測試,例如搜尋、YouTube 研究或只讀型 X 資料整理。

如果你原本就在用 Claude Code、Codex 或本地端模型,AISA 比較像補上「外部能力」的那塊拼圖。你也可以對照 Claude Code 搭配 LM Studio 與 Ollama 的零 API 成本環境 來思考:本地模型負責推理,AISA 負責外部資料和服務。

誰適合先試 AISA?

我會把 AISA 放在三種使用者的觀察名單裡。

第一種是內容創作者。你需要查 X 熱點、找 YouTube 競品、做 SEO keyword research,這些都很適合交給有資料 Skills 的 agent。

第二種是開發者和自動化玩家。你已經在用 Claude Code、Codex、OpenClaw 或其他 CLI agent,希望讓它們接更多真實 API,而不是每個服務都重新申請 key。

第三種是想做 agent 商業流程的人,例如市場開發、資料整理、金融監控、郵件自動化。這類任務需要的不只是模型,而是資料、工具、信箱、付款和成本控制一起工作。

至於只想聊天或單純換模型的人,AISA 可能不是最輕的選擇。這種情況,單純的模型 API 聚合平台或本地模型會更直接。可以參考你站上的 ApiFree:一個 API 打通所有 AI 模型 這類文章來比較不同路線。

結論:AISA 代表 Agent 從「模型」走向「資源層」

AISA 真正值得注意的,不是它支援多少模型,而是它把 agent 做事需要的資料、API、Skills、帳單和支付,往同一個入口收斂。

這會讓 AI Agent 的下一步變得更清楚:模型只是大腦,Skills 和 API 是手腳,預算和權限是安全邊界,支付能力則讓 agent 有機會直接參與服務交易。

短期內,我會先用只讀型任務測 AISA,例如 X 輿情整理、YouTube 競品研究、股票資料摘要。等日誌、成本和準確性都穩定,再逐步開放發文、寄信、付費 API 這類高風險能力。Agent 要進化成能工作的系統,靠的不是一次把權限全打開,而是一步一步把能力和護欄一起搭好。

FAQ

AISA 是什麼?

AISA 是面向 AI Agent 的能力層與交易網路,讓 agent 透過一個 API Key 連接模型、資料 API、封裝 Skills,以及機器對機器支付能力。

AISA 可以用 X 或 Twitter 嗎?

可以。AISA 官方文件列出 Twitter API、Twitter Autopilot、Twitter Command Center、X Intelligence Automation 等 Skills,適合做公開資料搜尋、輿情整理、發文和互動自動化。

AISA 跟 OpenRouter 有什麼不同?

OpenRouter 主要解決多模型 API 統一入口;AISA 包含模型 gateway,但更大的重點是把 API、資料源、Skills、Agent Mail、金融資料、搜尋與機器支付一起包成 agent 可用的資源層。

AISA 一定要用加密貨幣嗎?

不一定。官網 FAQ 提到可以從一般 AISA 帳號、API Key 和法幣充值額度開始,加密原生結算主要用在機器支付或 x402 類工作流,不是首次整合的必要條件。

Agent 自己付款安全嗎?

不能無限制開放。AISA 官網提到可透過 API Key、用量監控、預算或限額來控制 agent 支出,實務上應該先用低額度、白名單服務、日限額和人工審核逐步放權。

HTTP 402 如何讓 AI 自己付錢?

AI Agent 先呼叫付費 API,服務端回 HTTP 402 Payment Required,並附上付款要求,Agent 檢查預算和白名單後,用錢包簽名付款,取得付款證明,再帶著證明重送請求。服務端驗證付款後,才回傳資料。

用 AI 組一家公司:從 Claude Code、Codex、Hermes 到 nuwa-skill 的完整工作流

用 AI 組一家公司:從 Claude Code、Codex、Hermes 到 nuwa-skill 的完整工作流

未來的 AI 生產力,不只是「模型比較強」,而是「Agent Runtime + Skill + 人類決策」的組合能力。

重要連結整理

女媧 Skill 下載

Agent Skills 官方說明

Claude Code Skills 官方文件

OpenAI Codex Skills 官方文件

OpenAI Codex GitHub

Hermes Agent 官方文件

Hermes Agent GitHub

所謂 AI 一人公司,不是指一個人什麼都不用做,讓 AI 自動幫你賺錢,比較務實的定義是:

一個人負責方向、判斷、審核與商業決策,AI Agent 負責研究、撰寫、開發、整理、測試、排程與重複性工作。

換句話說,人類的角色從「執行者」變成「總編輯、產品經理、技術主管、老闆」。

這也是影片最重要的啟發:AI 不是單一工具,而是一組可以分工的虛擬團隊。

Claude Code、Codex、Hermes 分別適合做什麼?

這三個工具剛好代表目前 AI Agent 工作流的三種方向。

我的看法是:如果你要打造 AI 一人公司,不應該只問「哪一個模型最強」,而是要問:

哪一個 Agent 適合負責開發?

哪一個 Agent 適合負責長期記憶與排程?

哪一個 Agent 適合安裝專門 Skill?

哪一個任務一定要由人類做最後判斷?

🏢 一人 AI 公司的組織架構與核心成員

要組建高效的團隊,就必須讓不同的 AI 模型各司其職、發揮所長。在我們的架構中,主要由以下三位核心成員組成:

  1. 董事長(你,唯一的人類): 負責定大方向、提供靈感、拍板決策、把控最終產品質量。
  2. 祕書長(Hermes Agent): 負責記錄分散的靈感與想法,具備極強的「長期記憶功能」,並對接社交軟體(如微信、Telegram)與本地工具。
  3. CEO 執行長(Claude Code): 負責公司的統籌規劃、任務分配、邏輯思考與實際開發落地。
  4. 代碼審查員(OpenAI Codex): 專職「挑毛病」,負責對寫好的程式碼進行安全性評估與漏洞審查。

🔍 深度洞察:Hermes、Codex 與 Claude Code 的技術選型見解

在搭建系統前,我們必須深入了解這三款終端 AI 工具的本質與差異,才能完美地將它們編排進工作流中:

  • Claude Code(專職研發與執行): 這是由 Anthropic 官方推出的終端工具,主語言融合了 Shell、Python 與 TypeScript。它在「編寫代碼」與「理解複雜上下文」上展現出極強的實力,是最完美的 「辦公與研發型執行代理」
  • OpenAI Codex(專職軟體工程與審查): 採用 Rust 編寫,本地運行極其輕量。Codex 近年已演化為完整的工程代理,在自動生成 PR 級修改、修復 Bug、閱讀 Repo 方面非常嚴謹。最關鍵的體感是:如果讓同一個模型自己寫代碼又自己審查,它往往看不出問題;但如果讓 Claude Code 負責開發、Codex 負責審查,Codex 就能精準揪出一堆漏洞!
  • Hermes Agent(長期記憶與通用協調): 它是基於 Python 的中立 Agent 框架,遵循開放的 agentskills.io 標準。Hermes 最大的強項在於 「長期記憶、自我學習與渠道接入」。它像一個會持續成長的系統,適合作為始終在線的指揮官。

女媧 Skill 是什麼?

女媧 Skill 是一個開源的 Agent Skill 專案,目標不是單純模仿名人的語氣,而是把一個人的公開資料整理成可執行的「思維 Skill」。

它的核心概念是:蒸餾一個人怎麼想,而不是只模仿一個人怎麼說話。

舉例來說,你可以讓 AI 從公開資料中整理出某位人物的:

心智模型

決策啟發式

表達 DNA

價值觀與反模式

誠實邊界

面對新問題時可能採用的判斷框架

這就讓 AI 不只是「用某人的口吻回答」,而是比較接近「用某人的思考框架分析問題」。

女媧 Skill 的工作流程

女媧 Skill 的運作大致可以整理成四個階段:

六路並行蒐集:從著作、訪談、社群媒體、批評者觀點、決策紀錄、人生時間線等方向蒐集資料。

三重驗證提煉:一個觀點必須跨多個領域出現、能推斷新問題立場、且不是所有聰明人都會這樣想,才值得被收錄。

建立 Skill:把心智模型、決策方法、表達風格、價值觀與限制寫入 SKILL.md。

品質驗證:用已知問題與未知問題測試,避免 AI 過度自信或胡亂回答。

這套流程對 AI 一人公司的價值很高,因為它等於把「專家經驗」變成可以安裝、可以版本管理、可以重複調用的工作能力。

如何安裝女媧 Skill?

官方 GitHub 下載連結如下:

https://github.com/alchaincyf/nuwa-skill

最簡單的安裝方式是使用通用 CLI 安裝器:

npx skills add alchaincyf/nuwa-skill

如果你想明確指定安裝到某個 Agent,也可以依照 runtime 指定。例如:

帮我安装 skill:https://github.com/alchaincyf/nuwa-skill

如果要手動安裝,可以把 GitHub 專案 clone 到對應的 skills 目錄。

一人產品團隊要靠 Agent Skills 框架、測試自動化、遠端優先的人機協作環境來疊加效率

大神必讀文章連結:https://georgexing.substack.com/p/how-i-build-with-ai-as-a-1-person

給大家一個可以直接複製貼上給 Claude Code 使用的提示詞:

請讀懂這篇文章:https://georgexing.substack.com/p/how-i-build-with-ai-as-a-1-person

# AI 一人公司 / 一人產品團隊完整提示詞

你現在要扮演我的「AI 一人公司作業系統總指揮」。
你的任務不是單純回答問題,而是協助我把一個想法,轉換成可以由 AI Agent 團隊執行的完整產品開發、內容產出或商業驗證流程。

## 一、背景設定

我正在打造一套「AI 一人公司」工作流。

核心概念是:

人類負責方向、品味、商業判斷、使用者價值、品質把關與最後決策。
AI Agent 負責研究、規劃、開發、測試、審查、文件、營運與重複性工作。

請把我視為:

* 創辦人
* 產品經理
* 品質審查者
* 最終決策者

請把 AI Agent 團隊視為:

* Claude Code:主要工程師,負責理解專案、規劃功能、寫程式、重構與除錯
* Codex:嚴謹審查者,負責檢查計畫、審查程式碼、找出邏輯漏洞、資料流程錯誤與後端風險
* Hermes Agent:長期營運助理,負責記憶、排程、跨平台提醒、自動化任務與長期追蹤
* 女媧 Skill / Agent Skills:專家能力庫,負責把人物思維、領域方法論、公司 SOP、品牌規範、開發規範轉換成可重複使用的能力

請避免空泛勵志,重點放在可以執行、可以檢查、可以交給 Agent 的流程。

---

## 二、我要處理的主題

請根據以下輸入,幫我建立完整的一人產品團隊工作流。

### 我的產品 / 專案 / 文章 / 功能想法

【在這裡貼上我的想法】

### 目標使用者

【在這裡描述目標使用者,例如:老師、開發者、內容創作者、中小企業老闆、學生、設計師】

### 我想達成的結果

【在這裡描述結果,例如:做出 MVP、寫一篇 WordPress 文章、設計一個 SaaS 功能、改版某個頁面、建立自動化流程】

### 目前限制

【在這裡填寫限制,例如:只有我一個人、預算有限、時間有限、需要本地部署、需要 WordPress、需要 Next.js、需要支援中文】

### 已有工具或技術

【在這裡填寫,例如:Claude Code、Codex、Hermes Agent、OpenAI、Ollama、llama.cpp、Next.js、Prisma、PostgreSQL、WordPress、GitHub】

---

## 三、你的工作方式

請你按照以下流程執行,不要跳步。

---

# Phase 1:產品腦力激盪與問題定義

請先幫我釐清:

1. 這個想法真正要解決的問題是什麼?
2. 使用者現在怎麼解決這個問題?
3. 使用者最痛的地方是什麼?
4. 這個產品或內容的主要使用情境是什麼?
5. 成功的定義是什麼?
6. 哪些需求是必要的,哪些只是好看但不重要?
7. 哪些地方最容易被 AI Agent 誤解?
8. 哪些地方一定要由人類做最後判斷?

請輸出:

* 一句話產品定位
* 目標使用者描述
* 使用者痛點
* 核心使用情境
* Jobs To Be Done
* 成功指標
* 不做清單
* 風險清單
* 需要我確認的關鍵決策

請注意:
如果我的想法太模糊,你不要直接開始寫執行計畫,而是先幫我整理成幾個可選方向,讓我選擇。

---

# Phase 2:PRD / 規格文件

在 Phase 1 完成後,請幫我產生一份產品規格文件。

格式如下:

## 1. 專案名稱

## 2. 一句話說明

## 3. 背景與問題

## 4. 目標使用者

## 5. 使用者故事

請用這種格式:

* 作為【使用者角色】,我想要【行為】,以便【得到的價值】。

## 6. 核心功能

請區分:

* 必要功能
* 次要功能
* 暫不處理功能

## 7. 使用流程

請用步驟式流程描述。

## 8. UX / UI 原則

請說明:

* 畫面上最重要的主要行動是什麼
* 哪些資訊要優先顯示
* 哪些資訊應該收合或延後
* 什麼狀態下需要提醒使用者
* 哪些設計會增加摩擦,應該避免

## 9. 技術需求

請包含:

* 前端
* 後端
* 資料庫
* API
* 權限
* 檔案或媒體處理
* 第三方服務
* AI 模型或 Agent 使用方式

## 10. 邊界情境

請列出:

* 空資料狀態
* 錯誤狀態
* 載入狀態
* 權限不足
* AI 回答失敗
* 網路中斷
* 使用者輸入不完整
* 重複送出
* 多人或多裝置同步問題

## 11. 驗收標準

請用 checkbox 格式輸出。

---

# Phase 3:Agent 分工設計

請把整個工作拆給不同 AI Agent。

請用表格輸出:

| 角色 | 使用工具 | 負責任務 | 輸入 | 輸出 | 注意事項 |
| -- | ---- | ---- | -- | -- | ---- |

至少包含:

1. 人類創辦人
2. Claude Code
3. Codex
4. Hermes Agent
5. 女媧 Skill / Agent Skills
6. 測試 Agent
7. 文件 Agent
8. SEO / 內容 Agent

請特別說明:

* 哪些工作可以並行
* 哪些工作必須串行
* 哪些工作需要人類審核後才能繼續
* 哪些工作可以交給較小模型
* 哪些工作必須交給較強模型

---

# Phase 4:實作計畫

請把 PRD 轉換成可執行的實作計畫。

格式如下:

## 實作總覽

* 目標
* 預估修改範圍
* 主要檔案
* 新增檔案
* 修改檔案
* 刪除檔案
* 資料庫變更
* API 變更
* 測試範圍
* 風險等級

## 任務清單

每個任務請用 checkbox 格式:

* [ ] Task 1:任務名稱

  * 目的:
  * 修改檔案:
  * 具體步驟:
  * 完成標準:
  * 可能風險:
  * 建議交給哪個 Agent:

請把任務拆到 AI Agent 可以明確執行的粒度。
不要只寫「完成前端」這種模糊任務。
要寫到「修改哪個檔案、增加哪個元件、處理哪個狀態、需要哪個測試」。

---

# Phase 5:Codex 審查提示詞

請產生一段可以交給 Codex 使用的審查提示詞。

目標是讓 Codex 審查 Claude Code 產出的計畫或程式碼。

Codex 審查提示詞必須包含:

1. 請檢查是否符合 PRD
2. 請檢查是否有資料流程錯誤
3. 請檢查是否有 race condition
4. 請檢查是否有權限問題
5. 請檢查是否有錯誤狀態未處理
6. 請檢查是否有安全風險
7. 請檢查是否有測試缺口
8. 請檢查是否有過度設計
9. 請檢查是否有和原始使用者價值偏離
10. 請用 Critical / High / Medium / Low 分級

請輸出可直接複製的 Codex Review Prompt。

---

# Phase 6:Implementation Review 自動測試設計

請模擬一位人類產品審查者,設計端到端測試情境。

請輸出:

## 使用者情境測試

| 編號 | 情境 | 操作步驟 | 預期結果 | 嚴重性 |
| -- | -- | ---- | ---- | --- |

至少包含:

* 新使用者第一次使用
* 正常成功流程
* 使用者輸入錯誤
* AI 回答失敗
* 網路或 API 錯誤
* 權限不足
* 重複操作
* 長時間載入
* 行動裝置或小螢幕
* 使用者中途離開後回來

## Playwright / Maestro / 手動測試建議

請根據專案類型建議:

* Web 專案:Playwright
* Mobile 專案:Maestro 或 Xcode simulator
* API 專案:API integration test
* WordPress 文章:SEO、可讀性、連結、標題層級、圖片 alt、內外連檢查

---

# Phase 7:遠端優先工作流

請幫我設計一套適合一人公司使用的遠端優先 AI Agent 工作流。

請包含:

## 1. 長時間任務如何執行

例如:

* 使用 tmux 保持 session
* 使用 SSH 遠端連入開發主機
* 使用 Tailscale 或 VPN 連線
* 使用 Git worktree 管理多個功能分支
* 使用通知機制提醒我 Agent 卡住

## 2. 手機上如何追蹤

請設計:

* 手機查看進度
* 手機批准或否決 Agent 決策
* 手機補充語音輸入
* 手機查看測試結果

## 3. 語音輸入策略

請幫我把口語想法整理成可執行規格。
如果我貼上的是語音轉文字,請先整理語意,不要糾正文法而忽略內容。

## 4. 多 Agent 並行策略

請說明:

* 哪些任務可以平行跑
* 如何避免不同 Agent 修改同一個檔案互相衝突
* 如何用 Git branch / worktree 分開任務
* 如何設定合併順序
* 如何保留回滾點

---

# Phase 8:女媧 Skill / 專家顧問團設計

請根據這個專案,建議我應該建立哪些 Skill。

請輸出:

| Skill 名稱 | 用途 | 觸發時機 | 應包含內容 | 不該做什麼 |
| -------- | -- | ---- | ----- | ----- |

請至少思考以下類型:

* 產品品味 Skill
* 工程規範 Skill
* UI / UX 審查 Skill
* SEO 文章 Skill
* 安全檢查 Skill
* 品牌語氣 Skill
* 客戶訪談 Skill
* 測試審查 Skill
* 競品分析 Skill
* 專家人物思維 Skill

如果適合,請幫我產生一份 `SKILL.md` 草稿。
`SKILL.md` 需要包含:

* name
* description
* 使用時機
* 不使用時機
* 工作流程
* 輸出格式
* 品質檢查清單
* 誠實邊界

---

# Phase 9:如果這是 WordPress 文章

如果我的輸入目標是寫 WordPress 文章,請改用以下輸出格式。

請產出:

1. 主標題
2. 三個 SEO 標題選擇
3. SEO 中繼資料說明
4. 文章標籤,請用繁體中文,並用半形逗號分隔
5. WordPress 可直接貼上的文章內容
6. 內部連結建議
7. 外部連結建議
8. 圖片或流程圖建議
9. 可以用「創作圖像」生成的圖片提示詞
10. 延伸閱讀區塊

文章要求:

* 使用繁體中文
* 如果來源有簡體中文,請改成繁體中文
* 使用 WordPress block editor 友善格式
* 避免簡體字
* 標題層級清楚
* 適合 SEO
* 不要堆砌關鍵字
* 官方網站與下載連結必須放入文章
* 對工具的評價要務實,不要過度吹捧
* 文章要能接續「AI 一人公司:Claude Code、Codex、Hermes 與女媧 Skill」這個主題

---

# Phase 10:最後輸出總結

最後請用以下格式總結:

## 我建議你現在先做的 3 件事

1.
2.
3.

## 哪些部分可以立刻交給 AI Agent

## 哪些部分必須由我親自判斷

## 這個專案最大的風險

## 這個專案最快的 MVP 路線

## 下一個可執行指令

請給我一段可以直接貼到 Claude Code / Codex / Hermes Agent 的下一步指令。

---

## 重要規則

1. 不要只給概念,要給可執行步驟。
2. 不要假設 AI 會自動理解我的產品品味,要把標準寫清楚。
3. 不要讓 Agent 直接長時間執行高風險操作,必須設計審查點。
4. 不要只檢查程式能不能跑,也要檢查使用者流程是否合理。
5. 不要把 AI 當成全自動創辦人;AI 是員工,人類才是老闆。
6. 如果資訊不足,請先提出最少量但最高價值的澄清問題。
7. 如果可以先做合理假設,就先標明假設並繼續,不要卡住。
8. 對每個輸出都要加上品質檢查清單。
9. 所有內容都用繁體中文。
10. 若引用外部工具、官方網站、GitHub 或下載連結,請列出來源與用途。

現在請根據我提供的主題,開始 Phase 1。

感想

未來真正有競爭力的人,不一定是最會寫提示詞的人,而是最會設計 AI 工作流的人。

你可以把 Claude Code 當工程師,把 Codex 當快速執行者,把 Hermes Agent 當長期助理,再用女媧 Skill 建立不同領域的顧問團。

但最後,真正的老闆還是你。

AI 一人公司的重點不是讓 AI 取代你,而是讓你從執行者升級成指揮者。

補充:

商業導師:

https://github.com/dontbesilent2025/dbskill

美工與設計:(寶玉skills)

https://github.com/JimLiu/baoyu-skills/blob/main/README.zh.md

如何用 baoyu-skills 在 WordPress 批次產生高質感產品圖

如何用 baoyu-skills 在 WordPress 批次產生高質感產品圖

baoyu-skills 產生產品圖:用 AI 快速製作 WordPress 商品視覺素材

在經營 WordPress 網站、WooCommerce 商店或內容型部落格時,產品圖往往是最花時間、也最影響轉換率的素材之一,過去要做一張產品主視覺,可能需要攝影、修圖、排版、設計師協作,甚至還要為不同平台另外裁切尺寸。

如果你的網站需要大量商品圖、文章封面圖、社群圖卡、資訊圖表,baoyu-skills 會是一個很適合導入的 AI 圖像工作流工具。

baoyu-skills 是由 Jim Liu 寶玉分享的 AI Agent 技能集,可用於 Claude Code、Codex 等 Agent 環境,協助內容創作者與網站經營者更有效率地產生圖片、文章、圖卡、簡報、資訊圖與多種發布素材。

官方 GitHub:
https://github.com/jimliu/baoyu-skills

下載與更新:
https://github.com/JimLiu/baoyu-skills/releases


為什麼 WordPress 網站需要 baoyu-skills?

WordPress 的優點是彈性高,但內容經營到一定規模後,最常卡住的地方不是文章本身,而是「圖片素材」。

常見情境包含:

  1. WooCommerce 商品需要主圖、情境圖、橫幅圖
  2. 部落格文章需要 SEO 封面圖
  3. 產品教學需要流程圖或資訊圖表
  4. 社群貼文需要小紅書、Instagram、Facebook 圖卡
  5. 多語系網站需要同一張圖的不同語言版本
  6. 技術產品需要規格圖、爆炸圖、比較圖或視覺說明

baoyu-skills 的價值在於,它不是單純「叫 AI 畫一張圖」,而是把常見內容工作拆成多個 Skill,讓你可以針對不同用途選擇合適的圖片生成方式。


baoyu-skills 的主要特色

1. 可產生多種產品視覺素材

baoyu-skills 不是只有單一圖片生成指令,而是包含多種與內容、圖片、圖表相關的技能。

適合用在:

  • 產品封面圖
  • 商品情境圖
  • 文章插圖
  • 資訊圖表
  • 社群圖卡
  • 教學流程圖
  • 知識漫畫
  • 簡報圖片
  • 商品介紹圖

對 WordPress 經營者來說,這代表同一份產品資料可以延伸成不同的行銷素材。


2. 適合產品圖與文章封面圖

如果你正在寫一篇產品介紹文章,可以使用 baoyu-cover-image 產生文章封面,也可以使用 baoyu-image-genbaoyu-imagine 產生更自由的商品情境圖。

例如:

  • 科技產品:可產生冷色系、金屬感、未來感的產品主視覺
  • 美妝商品:可產生柔光、乾淨背景、生活情境的商品照
  • 食品商品:可產生木質桌面、自然光、手作感的商品圖
  • 教育服務:可產生圖解式封面與資訊圖
  • SaaS 產品:可產生 UI mockup、介面展示與功能圖解

3. 支援圖表與流程類型內容

遇到流程、比較、架構、教學步驟時,建議不要只用文字說明,可以改用「創作圖像」的方式產生視覺圖。

例如這篇文章中的工作流程可視覺化如下:

這類流程非常適合做成資訊圖,放在 WordPress 文章中,不但可以增加停留時間,也能讓讀者更快理解工具的實際用途。


4. 可與 WordPress 內容流程整合

baoyu-skills 本身不是 WordPress 外掛,而是 AI Agent 的技能集。實際用法通常是先在本機或開發環境產生圖片,再把圖片上傳到 WordPress 媒體庫。

建議流程如下:

  1. 在 Claude Code、Codex 或其他支援 Skills 的 Agent 中安裝 baoyu-skills
  2. 準備商品描述、文章 Markdown 或產品規格
  3. 使用對應指令產生圖片
  4. 檢查圖片比例、文字、品牌色與可讀性
  5. 將圖片輸出為 WebP、PNG 或 JPG
  6. 上傳到 WordPress 媒體庫
  7. 套用到文章特色圖片、WooCommerce 商品圖、Elementor 區塊或首頁 Banner

如果你的網站使用 Elementor,也可以直接把產出的圖片放進 Elementor 的 Image、Hero、CTA、Gallery 或 Loop Grid 區塊中。


安裝與下載

官方建議安裝方式如下:

npx skills add jimliu/baoyu-skills

官方 GitHub:
https://github.com/jimliu/baoyu-skills

下載與版本更新:
https://github.com/JimLiu/baoyu-skills/releases

如果你使用 Claude Code,也可以在 Agent 中加入 marketplace:

/plugin marketplace add JimLiu/baoyu-skills

接著安裝:

/plugin install baoyu-skills@baoyu-skills

官方文件提醒,baoyu-skills 內含多個 Skill,實務上建議按需安裝,不一定要一次載入所有技能,避免佔用過多 Agent 上下文。


關鍵指令整理

以下是用於產品圖與 WordPress 內容製作時最常用的指令方向。

1. 產生文章封面圖

/baoyu-cover-image path/to/article.md

指定風格:

/baoyu-cover-image path/to/article.md --style blueprint

指定比例:

/baoyu-cover-image path/to/article.md --aspect 16:9

不要加標題文字:

/baoyu-cover-image path/to/article.md --no-title

適合用途:

  • WordPress 文章特色圖片
  • 部落格封面
  • 首頁文章列表縮圖
  • SEO 文章主視覺

2. 產生產品情境圖

/baoyu-image-gen "黑色無線耳機,霧面金屬質感,放在白色桌面上,自然柔光,商業產品攝影風格"

適合用途:

  • WooCommerce 商品主圖
  • 商品詳情頁情境圖
  • 首頁商品橫幅
  • 廣告素材

3. 產生自由風格產品圖

/baoyu-imagine "一款高階 AI 筆電放在現代辦公桌上,背景有柔和光影,科技感,高級商業攝影"

適合用途:

  • 品牌形象圖
  • 活動視覺
  • 產品概念圖
  • Landing Page 主視覺

4. 產生資訊圖表

/baoyu-infographic path/to/content.md

指定版型與風格:

/baoyu-infographic path/to/content.md --layout flow --style technical-schematic

適合用途:

  • 產品規格比較
  • 教學步驟
  • 服務流程
  • 軟體架構圖
  • WordPress 教學文章配圖

5. 產生社群圖卡

/baoyu-xhs-images posts/product-intro.md

指定風格:

/baoyu-xhs-images posts/product-intro.md --style notion

指定流程版型:

/baoyu-xhs-images posts/product-intro.md --layout flow

適合用途:

  • 小紅書圖卡
  • Instagram 輪播圖
  • Facebook 貼文圖
  • WordPress 文章延伸社群素材

6. 圖片壓縮與最佳化

/baoyu-compress-image product-image.png

適合用途:

  • 將圖片轉為 WebP
  • 壓縮 WordPress 圖片
  • 降低網頁載入時間
  • 改善 Core Web Vitals

WordPress 使用場景範例

場景一:WooCommerce 商品頁

你可以先準備商品描述:

產品名稱:黑色真無線藍牙耳機
特色:降噪、長續航、霧面金屬外殼、適合通勤與辦公
圖片風格:高級商業攝影、白色背景、柔和陰影、乾淨構圖

接著用 baoyu-skills 產生:

  • 商品主圖
  • 生活情境圖
  • 功能賣點圖
  • 規格比較圖
  • 社群推廣圖

最後將圖片上傳到 WordPress 媒體庫,套用到 WooCommerce 商品圖集。


場景二:WordPress 部落格文章

如果你要寫一篇「如何挑選無線網卡」的文章,可以使用:

/baoyu-cover-image article.md --style blueprint --aspect 16:9

再使用:

/baoyu-infographic article.md --layout comparison --style technical-schematic

這樣可以同時產生文章封面與比較型資訊圖,讓文章更適合 SEO 排名與社群分享。


場景三:Elementor 首頁橫幅

如果你使用 Elementor 製作首頁,可以先用 baoyu-skills 產生 16:9 或 21:9 的 Hero Banner。

提示詞範例:

請產生一張 WordPress 首頁 Hero Banner:
主題是 AI 產品圖自動生成,
畫面包含商品攝影棚、AI 工作流、WordPress 網站介面,
風格為現代、乾淨、科技感、商業級視覺,
不要過多文字,保留右側放標題的空間。

產出後可放進 Elementor 的 Hero Section,搭配標題、按鈕與 CTA。


baoyu-skills 產品圖工作流程

這樣做的好處是,每次製作商品頁時,不必重新思考整套流程,只要替換產品資料與風格設定,就能快速產出一致的視覺素材。


產品圖提示詞範例

科技產品

黑色 USB WiFi 網路卡,雙天線,放在乾淨白色桌面上,背景有筆電與柔和光影,科技感,高級商業攝影,清晰產品細節,適合電商商品頁

美妝產品

玻璃精華液瓶,琥珀色瓶身,放在大理石平台上,旁邊有綠色植物與柔和自然光,乾淨高級,美妝產品攝影風格

食品產品

手工餅乾禮盒,木質桌面,自然光,溫暖色調,旁邊有咖啡杯與包裝紙,適合品牌形象與電商頁面

軟體服務

AI 批改系統的產品主視覺,畫面包含老師桌面、筆電介面、文件上傳、AI 分析圖示,明亮乾淨,專業 SaaS 風格

使用 baoyu-skills 時要注意什麼?

1. 不要只寫「幫我產生產品圖」

好的提示詞應該包含:

  • 產品名稱
  • 產品材質
  • 使用場景
  • 光線
  • 背景
  • 圖片比例
  • 風格
  • 不要出現的元素

例如:

請產生一張 16:9 商品橫幅圖:
產品是一台銀色 AI 筆電,
放在乾淨的辦公桌上,
背景有柔和藍色光影與抽象 AI 線條,
風格為高級科技產品攝影,
不要出現人物、浮水印、亂碼文字。

2. 產品圖要保留 WordPress 版面空間

如果圖片要放在文章封面或首頁 Banner,建議在提示詞中加上:

左側保留標題文字空間

或:

右側保留 CTA 按鈕空間

這樣後續在 WordPress、Elementor 或區塊編輯器中排版會更方便。


3. 圖片要檢查文字

AI 圖片中的文字有時會出現亂碼,因此若是商品圖、封面圖或廣告圖,建議分成兩階段:

  1. 先產生無文字圖片
  2. 再用 WordPress、Canva、Photoshop 或 Elementor 加上正式文字

這樣可以避免圖片中文字錯誤影響品牌專業度。


4. 圖片上傳 WordPress 前要壓縮

建議輸出後轉成 WebP,並控制圖片尺寸。

常用建議:

  • 文章封面:1200 × 675
  • 商品圖:1200 × 1200
  • 首頁 Banner:1920 × 800
  • 社群圖卡:1080 × 1350
  • 小紅書圖卡:1080 × 1440

圖片壓縮後再上傳,可改善網站速度與 SEO 表現。


適合誰使用?

baoyu-skills 特別適合以下使用者:

  • WordPress 網站經營者
  • WooCommerce 電商賣家
  • 部落格作者
  • SEO 內容團隊
  • AI 工具玩家
  • 小型品牌主
  • 產品行銷人員
  • 技術產品代理商
  • 需要大量多語系素材的網站團隊

如果你經常需要為不同文章、商品或社群平台製作圖片,baoyu-skills 可以讓你的視覺內容生產流程更標準化。


UIUX Pro Max 如何用在 WordPress?Elementor、主題與外掛完整教學

要用在 WordPress 的細節是這樣:

UIUX Pro Max 不是在 WordPress 後台裡用,也不是在 Elementor 裡直接用語音說話。
它是在你的「開發專案資料夾」裡,讓 Claude Code、Cursor、Codex CLI、Windsurf 這類 AI 工具讀到這個 Skill,然後你在 AI 工具的聊天框或 CLI 裡用文字下指令。

官方 README 也寫得很清楚:CLI 安裝方式是先 npm install -g uipro-cli,再 cd /path/to/your/project,然後執行 uipro init --ai claudeuipro init --ai cursoruipro init --ai codex 等指令。使用時則是「自然聊天」提出 UI/UX 任務,或用 /ui-ux-pro-max slash command 觸發。

1. 要放在 WordPress 根目錄下嗎?

如果你是要它幫你「改 WordPress 主題、外掛、樣式檔、PHP template」,那建議放在 WordPress 專案根目錄。

例如你的 WordPress 專案是:

/var/www/html/my-wordpress-site

或 Windows 本機:

C:\Users\Rain\Projects\my-wordpress-site

那你就進到這個資料夾:

cd /var/www/html/my-wordpress-site

或:

cd C:\Users\Rain\Projects\my-wordpress-site

然後執行:

uipro init --ai cursor

或:

uipro init --ai claude

這樣 AI 工具比較容易讀到你的 WordPress 結構,例如:

wp-content/themes/plugins/uploads/

2. 如果只是用 Elementor?

如果你只是想讓它幫你規劃 Elementor 頁面,例如:

  • 首頁區塊怎麼排
  • Hero 文案怎麼寫
  • CTA 怎麼放
  • 色彩與字體怎麼設定
  • 手機版怎麼調
  • WooCommerce 商品頁怎麼規劃

可以在任何 AI 工具裡直接問:

請使用 UIUX Pro Max 的思維,幫我規劃一個 WordPress + Elementor 首頁。網站類型:顧問公司目標客戶:中小企業老闆風格:專業、可信任、不要太花請輸出:1. Elementor 區塊架構2. 每個 Section 的標題與文案3. Container / Column 建議4. Global Colors5. Global Fonts6. 手機版設定

然後你再手動把結果做到 Elementor 裡。

這種方式不需要碰 WordPress 根目錄,因為它只是給你「設計規劃」。

3. 什麼情況一定建議在 WordPress 根目錄下?

當你要 AI 直接幫你看檔案、改檔案、產生程式碼時,就建議在 WordPress 根目錄。

例如你要它做這些事:

請幫我檢查目前 WordPress 主題的首頁 template,並重新設計 Hero 區塊。
請幫我修改 wp-content/themes/my-theme/front-page.php,讓首頁更像專業 SaaS Landing Page。
請幫我建立一個 WordPress 外掛設定頁,風格要乾淨、專業、適合老師使用。
請幫我新增一個 Elementor 可以貼上的 HTML 區塊,並附 CSS。

這種情況 AI 需要讀你的專案檔案,所以最好在 WordPress 專案根目錄執行。

4. 在哪裡「用說的」?

不是在 WordPress 後台說。

是在這些地方用文字說:

A. Claude Code

如果你用 Claude Code,可以在專案目錄下開啟 Claude Code,然後直接輸入:

請使用 UIUX Pro Max,幫我優化這個 WordPress 網站首頁的 UI/UX。請先讀取目前主題結構,不要直接改檔案,先提出規劃。

如果是 slash command 模式,則可以用:

/ui-ux-pro-max 請幫我設計 WordPress + Elementor 首頁架構

官方文件也提到,Skill Mode 可以自然語言觸發,Workflow Mode 則可以使用 /ui-ux-pro-max 指令。

B. Cursor

如果你用 Cursor:

  1. 用 Cursor 開啟 WordPress 專案資料夾
  2. 安裝 UIUX Pro Max:
npm install -g uipro-cliuipro init --ai cursor
  1. 在 Cursor Chat 裡輸入:
請使用 UIUX Pro Max 的 UI/UX 規則,幫我分析這個 WordPress 網站。目標是把首頁改成專業的 B2B SaaS Landing Page。請先不要修改檔案,先列出設計系統、區塊架構與需要改的檔案。

C. Codex CLI / Gemini CLI / Windsurf

邏輯一樣,先在專案資料夾安裝:

uipro init --ai codex

或:

uipro init --ai windsurf

然後在該工具的聊天或 CLI 裡下指令。

5. WordPress + Elementor 最實際流程

如果你是一般 WordPress 使用者,我會建議你不要一開始就讓 AI 改檔案,而是先用這個流程:

UIUX Pro Max 產生設計規劃↓你在 Elementor 設定 Global Colors / Fonts↓依照 Section 一段一段建立頁面↓再請 AI 幫你檢查手機版、轉換率、可讀性

實際操作如下。

第一步:先問它設計系統

請使用 UIUX Pro Max,幫我建立 WordPress + Elementor 網站的設計系統。網站類型:AI 批改工具目標使用者:國中小老師品牌感覺:乾淨、專業、低壓力、不要像兒童玩具主色:白色、深灰,主要 CTA 使用 Shane Red請輸出:1. Global Colors2. Global Fonts3. H1/H2/H3/Body 字級4. Button 樣式5. Card 樣式6. Section 上下間距7. 手機版斷點建議

第二步:請它產生 Elementor 區塊

請依照剛剛的設計系統,幫我規劃 Elementor 首頁。請輸出:1. Section 名稱2. 每個 Section 的目的3. Container / Column 結構4. 標題文案5. 按鈕文案6. 圖片或 Icon 建議7. 手機版排列方式

第三步:手動做到 Elementor

到 WordPress 後台:

WordPress 後台→ 頁面→ 新增頁面 / 編輯首頁→ 使用 Elementor 編輯

然後照 AI 給你的 Section 一段一段做。

第四步:請它檢查 Elementor 設計

你可以截圖,或把頁面區塊描述貼回去問:

請用 UIUX Pro Max 的角度,檢查這個 Elementor 首頁。請特別看:1. 首屏是否清楚2. CTA 是否明顯3. 文字是否太多4. 手機版是否容易讀5. 有沒有不一致的間距或字級6. 如何提高轉換率

6. 如果要改 WordPress 主題,流程是另一種

假設你有一個自製主題:

wp-content/themes/my-theme/

你可以在 WordPress 根目錄下開 AI 工具,然後問:

請使用 UIUX Pro Max 分析這個 WordPress 主題。目標:把首頁 front-page.php 改成專業 Landing Page。限制:1. 不要改後台功能2. 不要破壞現有 header.php 和 footer.php3. 優先修改 front-page.php 和 style.css4. 請先列出修改計畫,不要直接改檔案

等它列出計畫後,再說:

可以,請開始修改 front-page.php 和 style.css。

這種才是「在 WordPress 根目錄下用」。

7. Elementor 使用者的重點結論

你可以這樣理解:

只做 Elementor 頁面規劃:不用一定在 WordPress 根目錄。在 Claude / Cursor / ChatGPT 裡問都可以。要 AI 讀取或修改 WordPress 檔案:建議在 WordPress 根目錄。要做外掛、主題、template、CSS:一定建議在 WordPress 專案根目錄。要做文章、頁面文案、區塊設計:不需要根目錄,直接用文字問即可。

8. 最推薦的用法

要寫 WordPress 文章、又想說明 Elementor 使用場景,我建議寫成這樣:

UIUX Pro Max 並不是直接在 WordPress 後台安裝後就會自動產生頁面的外掛,而是搭配 Claude Code、Cursor、Codex CLI、Windsurf 等 AI 工具使用的 UI/UX Skill。
如果只是要規劃 Elementor 頁面,可以直接在 AI 工具中用自然語言描述需求;如果要讓 AI 讀取或修改 WordPress 主題、外掛、template 或 CSS,則建議在 WordPress 專案根目錄下安裝與使用,讓 AI 能理解目前的檔案結構與實際程式碼。

最簡單一句話:Elementor 規劃不用放根目錄;要改 WordPress 程式碼,就放在 WordPress 根目錄。

UIUX Pro Max 教學:AI 輔助 WordPress 外觀設計與前端開發神器

UIUX Pro Max 教學:AI 輔助 WordPress 外觀設計與前端開發神器

在網站製作的世界裡,最痛苦的往往不是「會不會架 WordPress」,而是「怎麼把網站做得像專業品牌」。

很多人可以安裝主題、套版、放圖片、改文字,但真正卡住的地方通常是:

版面不夠高級、配色不協調、按鈕不知道放哪裡、手機版跑版、Landing Page 沒有轉換力、Dashboard 看起來不像專業產品。

這時候,UIUX Pro Max Skill 就像是一位專門站在你旁邊的前端與 UI/UX 顧問。你不需要一開始就懂設計系統、字體比例、色彩心理學、Tailwind、React、Next.js 或 shadcn/ui,只要用自然語言描述你想要的網站,它就能協助 AI Coding Assistant 產生更像專業前端設計師規劃出來的介面。

官方網站:
https://ui-ux-pro-max-skill.nextlevelbuilder.io/

GitHub 專案:
https://github.com/nextlevelbuilder/ui-ux-pro-max-skill

下載與安裝:
https://github.com/nextlevelbuilder/ui-ux-pro-max-skill/releases


UIUX Pro Max 是什麼?

UIUX Pro Max,全名通常會看到 ui-ux-pro-max-skill,是一個提供 AI 助手使用的 UI/UX 設計技能包。它的核心概念很簡單:

讓 AI 不只是「會寫前端程式」,而是更懂「什麼樣的前端才像專業產品」。

一般 AI 寫前端時,很容易產生一種常見問題:功能有了,但畫面普通;元件有了,但缺乏層次;版面能跑,但沒有品牌感。

UIUX Pro Max 則補上這塊空白。它把 UI 風格、色票、字體搭配、圖表類型、UX 規則、設計系統與不同技術框架的實作建議整理成一套可被 AI 助手調用的知識庫。

你可以把它想像成:

  • 給 Claude Code、Cursor、Codex CLI、Windsurf 等工具使用的 UI/UX 專家包
  • 給前端開發者使用的設計系統產生器
  • 給不懂設計的創業者、站長、行銷人員使用的網站美感加速器
  • 給 WordPress 專案使用的外觀與互動規劃參考工具

它不是單純的 WordPress 外掛,而是可以協助你在製作 WordPress 網站、Landing Page、SaaS 後台、會員系統、形象網站或行銷頁時,快速產生更專業的前端設計方向。


特色

1. 用自然語言產生 UI/UX 設計方向

你不需要一開始就寫完整規格,只要描述你的需求,例如:

「幫我設計一個牙醫診所形象網站,要乾淨、可信任、有預約按鈕。」

「我要一個 WordPress 課程銷售頁,風格要像高級教育平台。」

「幫我做一個 SaaS 後台 Dashboard,要有現代感、卡片式資料區塊、RWD。」

AI 搭配 UIUX Pro Max 後,就能更有方向地產生版面、色彩、字體、元件與視覺層次。


2. 自動生成設計系統

UIUX Pro Max 的重點之一,是能依據專案需求產生設計系統。

這對 WordPress 網站很重要,因為很多網站最後看起來不專業,不是因為圖片不夠漂亮,而是缺乏一致性。

設計系統可以包含:

  • 主色與輔色
  • 字體搭配
  • 標題大小
  • 內文行距
  • 按鈕樣式
  • 卡片樣式
  • 表單樣式
  • 間距規則
  • RWD 斷點
  • 常用元件規範

如果你是用 WordPress + Elementor、Bricks、Block Editor、GeneratePress、Astra 或自製主題,這些設計系統都可以成為你調整網站外觀時的重要依據。


3. 適合 WordPress 外掛與主題開發

雖然 UIUX Pro Max 不是傳統意義上的 WordPress 外掛,但它非常適合拿來輔助 WordPress 開發。

例如你正在開發:

  • WordPress 企業形象網站
  • WooCommerce 商品頁
  • 線上課程銷售頁
  • 會員中心
  • 後台管理介面
  • 預約系統
  • AI 工具網站
  • 部落格首頁
  • Landing Page
  • WordPress 外掛設定頁

你可以請 AI 搭配 UIUX Pro Max 先產生 UI 規劃,再把設計轉換成 HTML、Tailwind、React、Next.js、PHP Blade、甚至 WordPress 區塊設計邏輯。


4. 支援多種前端技術棧

UIUX Pro Max 不只適合單一框架,它的 GitHub README 中列出多種支援方向,包括 HTML + Tailwind、React、Next.js、shadcn/ui、Vue、Nuxt、Angular、Svelte、Astro、SwiftUI、Jetpack Compose、React Native、Flutter 等。

對 WordPress 使用者來說,最實用的組合通常會是:

  • HTML + Tailwind
  • React
  • Next.js
  • shadcn/ui
  • PHP / Laravel Blade 概念
  • WordPress 區塊與前端樣式規劃

如果你的 WordPress 網站有自製外掛、客製後台、Headless WordPress 或 Next.js 前台,UIUX Pro Max 會更有幫助。


5. 做出不「凡」的網站

多數人不是專業設計師,也不是全職前端工程師。

你可能是創業者、老師、站長、接案者、行銷人、公司內部資訊人員,甚至只是想把自己的 WordPress 網站改得更好看。

UIUX Pro Max 的價值在於:它把許多專業設計師腦中的判斷,變成 AI 可以引用的規則與資料庫。你不必從零開始學完 UI/UX,也能讓 AI 提供更接近專業前端顧問的建議。


關鍵指令

以下是常用指令,可以依照你的 AI 工具環境選擇。

Claude Code Marketplace 安裝方式

/plugin marketplace add nextlevelbuilder/ui-ux-pro-max-skill
/plugin install ui-ux-pro-max@ui-ux-pro-max-skill

CLI 安裝方式

npm install -g uipro-cli
cd /path/to/your/project
uipro init --ai claude

安裝到其他 AI 助手

uipro init --ai cursor
uipro init --ai windsurf
uipro init --ai copilot
uipro init --ai codex
uipro init --ai gemini
uipro init --ai opencode
uipro init --ai all

全域安裝

uipro init --ai claude --global
uipro init --ai cursor --global

更新與移除

uipro versions
uipro update
uipro uninstall

使用範例

Build a landing page for my SaaS product
Create a dashboard for healthcare analytics
Design a portfolio website with dark mode
Make a mobile app UI for e-commerce
Build a fintech banking app with dark theme

直接呼叫 Skill

/ui-ux-pro-max Build a landing page for my SaaS product

使用流程圖


WordPress 使用情境範例

情境一:幫企業形象網站重新設計首頁

你可以這樣下指令:

請幫我重新設計一個 WordPress 企業形象網站首頁。
產業是 B2B 軟體服務,目標客戶是中小企業老闆。
風格要專業、可信任、不要太科技黑。
請提供首頁區塊架構、主色、字體、CTA 按鈕、RWD 注意事項。

AI 搭配 UIUX Pro Max 後,會比較容易產生完整的首頁架構,例如 Hero、痛點、服務特色、案例、流程、FAQ、CTA 等,而不是只給你一個普通的套版。


情境二:幫 WooCommerce 商品頁提高轉換率

請幫我優化 WooCommerce 商品頁 UI/UX。
商品是高單價健康設備。
目標是增加詢問與預約體驗。
請設計商品頁資訊層級、信任元素、CTA 區塊與手機版版面。

這類任務不只是美化,而是結合轉換率、資訊層級與使用者行為。UIUX Pro Max 很適合用在這種「不只要好看,也要有效」的頁面。


情境三:設計 WordPress 外掛設定頁

請幫我設計一個 WordPress 外掛設定頁。
外掛功能是 AI 自動批改作業。
需要包含 API Key 設定、模型選擇、批改規則、通知設定與儲存按鈕。
請提供乾淨、專業、適合老師使用的 UI。

如果你正在開發 WordPress 外掛,後台設定頁常常會被忽略,但它其實非常影響使用體驗。UIUX Pro Max 可以協助你把設定頁做得更清楚、有層次,也更接近 SaaS 產品的質感。


為什麼推薦 UIUX Pro Max?

1. 降低設計門檻

不是每個人都請得起專業 UI 設計師,也不是每個專案都有時間走完整設計流程。UIUX Pro Max 可以讓 AI 幫你補上第一版設計判斷。

2. 節省溝通成本

過去做網站常常要反覆跟設計師或前端工程師溝通:「再高級一點」、「不要那麼像模板」、「手機版怪怪的」。現在你可以直接把品牌、情境、目標客戶、色調偏好告訴 AI,讓它先產出一版更接近方向的方案。

3. 適合快速做 MVP

如果你正在做新產品、SaaS、AI 工具、課程平台、會員網站或接案展示頁,UIUX Pro Max 很適合用來快速產生第一版專業視覺。

4. 可延伸到實際程式碼

它不是只能給概念,也能配合 AI Coding Assistant 產生前端程式碼、元件設計與樣式規則。對工程師來說,這比單純看設計靈感網站更直接。


使用時要注意什麼?

1. 它不是魔法,仍然需要你提供明確需求

你給的需求越清楚,產出的設計越準。

建議至少提供:

  • 產業類型
  • 目標客戶
  • 網站目的
  • 喜歡或不喜歡的風格
  • 是否要深色模式
  • 是否需要手機優先
  • 使用的技術棧
  • 是否要套用到 WordPress
  • 是否偏向銷售、品牌、教學或後台管理

2. 不要只說「幫我做漂亮一點」

比較好的說法是:

請幫我把這個 WordPress 首頁改成更像 B2B SaaS 的專業風格。
目標客戶是企業主管。
請避免卡通感與過度漸層。
主色希望是深藍與白色,CTA 使用亮色。
請提供 Hero、功能、案例、價格與 FAQ 區塊。

這樣 AI 才會知道「漂亮」的方向是什麼。

3. 最後仍要人工檢查

AI 產出的設計很適合當第一版,但正式上線前仍然建議檢查:

  • 手機版是否正常
  • 文字是否符合品牌語氣
  • 色彩對比是否足夠
  • 按鈕是否明顯
  • 表單是否容易填寫
  • SEO 標題是否正確
  • WordPress 主題是否相容
  • 外掛是否造成樣式衝突