用 Cursor 接前端案：從報價到交付的完整 SOP | AI 賺錢
接案最耗時的不是寫 code，是溝通、估時、改稿。一個前端案子，開發本體可能只佔你 40% 的時間，剩下 60% 全花在「確認需求」、「等客戶回覆」、「第三輪改稿」上。我用 Cursor 把開發速度拉高之後，反而更清楚意識到這件事——所以這篇文章不只講怎麼用 Cursor 寫程式，而是把整個接案 SOP 從頭到尾整理出來，包含報價、開發、交付、改稿、定價邏輯。
報價：用 AI 快速拆解需求、估工時
客戶的需求通常是這樣來的：「我需要一個電商網站，功能跟 XXX 差不多，你報個價？」
這句話裡面有多少資訊？幾乎沒有。但你不能就這樣拒絕對方，也不能瞎猜一個數字。報價失準是接案死亡螺旋的起點——報低了做到崩潰，報高了直接失案。
我現在的做法是把「需求拆解」這件事交給 AI 先跑一遍：
第一步：把客戶說的話丟進 Cursor，要求它生成需求拆解清單。
prompt 大概長這樣：
你是一個有經驗的前端開發者。客戶需求如下：
「[貼上客戶原話]」
請把這個需求拆解成具體的功能項目清單，每個項目標注：
1. 是否需要後端 API
2. 大致工時（小時）
3. 風險點（哪些地方可能需求不清楚）
Cursor 跑出來的清單通常會有你沒想到的點。比如「電商網站」這個需求，它可能會拆出：首頁輪播、商品列表（含分類篩選）、商品詳情頁、購物車、結帳流程、會員登入、訂單查詢、後台商品管理……每個項目都有工時範圍。
第二步：你過一遍這份清單，把「需求不清楚」的項目圈出來。
這些圈起來的地方，就是你在報價前要去問客戶的問題。例如：「結帳流程需要串金流嗎？用哪家？」、「後台商品管理是要自己手刻還是用現成的 CMS？」
第三步：把確認好的清單加總工時，乘上你的時薪，加上 20-30% 緩衝。
這樣的報價有憑有據，客戶問「為什麼這個價格」，你可以直接把清單寄給他。這份清單同時也是後來範疇管控（scope management） 的依據——客戶突然加需求，你就拿這份清單出來說「這個不在原始範圍內，需要另外報價」。
這個流程從以前的「估到眼花一兩小時」，縮短到大概 15-20 分鐘就能生出一份可以寄出的報價草稿。
開發：用 Cursor 把交付速度拉高
需求確認完，進入開發。這裡我分三個場景來說 Cursor 的具體用法。
① 元件生成：讓 Cursor 依照你的設計稿或風格生
大部分前端案子不是從零建一套 design system，而是「客戶有一個現有網站或設計稿，你要照著做」。
這裡最有效的做法：先把一個現有元件的程式碼餵給 Cursor 當範例，再叫它生新元件。
這是現有的 ProductCard 元件（[貼上程式碼]）。
請依照同樣的風格和命名慣例，幫我生成一個 ReviewCard 元件，欄位如下：
- 評論者名稱
- 星等（1-5，用星星圖示呈現）
- 評論內容
- 日期
這樣生出來的元件，命名風格、prop 結構、CSS class 的寫法都會跟現有程式碼一致。不給範例就叫它生，大概率會跑出一個「風格正確但規格對不上」的東西，review 成本反而高。
元件生成這件事，我現在的體感大概是快 3-4 倍。 一個中型元件以前要 40-60 分鐘，現在大概 15-20 分鐘（含我自己 review 和調整的時間）。
② 依既有風格改：最常見的「把這個頁面改成這樣」
客戶最常說的需求不是「做一個新功能」，而是「把這個頁面改成這樣」。這種情況的 Cursor 用法：
- 在 Cursor 裡用
@把要改的檔案全部加進 context。 - 貼上設計稿截圖或說明。
- 用 Agent 模式讓它直接做修改，你站在旁邊 review。
我通常不叫它一次把整個頁面改完，而是一個區塊一個區塊來。每做完一個區塊就跑 npm run dev 看看畫面，確認沒問題再繼續。這樣的節奏錯誤比較容易抓，也不會一次 diff 幾百行看得眼花。
③ 快速迭代：把客戶的 Figma 或截圖直接丟給它
如果客戶有 Figma 稿或截圖，Cursor 現在可以直接把圖片拖進 chat。我的做法：
- 截一張設計稿的局部。
- 問：「這個 section 我要用 React + Tailwind 實作，請幫我寫初版。」
- 它跑出初版之後，對照設計稿調細節。
這個步驟不會一次給你完美的成果，但能把「從空白頁面到有個可以調整的基礎」這段時間從 30 分鐘壓到 5-8 分鐘。後面的調整才是真正需要你眼力和判斷的部分。
交付與改稿：怎麼用 AI 縮短來回
改稿是讓很多接案工程師崩潰的地方。不是因為改稿本身難，而是不知道改到什麼時候算完、每次改完又有新意見。
有幾件事可以系統化：
① 交付時附上「功能對照表」
每次交付，我都會用 Cursor 幫我生一份 markdown 格式的功能對照表，列出這次交付的內容跟需求清單的對應關係。格式很簡單：
| 需求項目 | 狀態 | 備註 |
|-----------------|-------|--------------------------|
| 商品列表頁 | ✅ 完成 | 含分類篩選功能 |
| 結帳流程 | ✅ 完成 | 串接綠界金流 |
| 後台商品管理 | ✅ 完成 | 支援圖片上傳 |
| 訂單查詢（會員） | ✅ 完成 | 顯示最近 30 筆訂單 |
這份表格有兩個好處：一是讓客戶清楚看到你交付了什麼（減少「這個有做嗎？」的問題），二是如果客戶提出的修改超出範圍，你可以指著表格說「這個在原始需求裡是 X，你說的是 Y，需要另外報價」。
② 改稿限制輪數，寫進合約
這是很多工程師不敢做但應該做的事：在合約裡明確寫幾輪改稿。我現在的標準是「交付後提供兩輪修改，每輪修改需在 7 天內回覆」。
超出兩輪的修改，按功能點另外報價。大部分正式的客戶都可以接受這個條件，因為他們也不想無止盡地來回。
③ 用 AI 起草回覆，維持溝通品質
改稿溝通很耗精力。每次都要想「怎麼說清楚但又不得罪客戶」。我現在的做法是：把客戶的意見和我的回覆草稿丟給 Cursor，叫它幫我潤飾成專業但不失溫度的語氣。
實際效果是：溝通品質變穩定，我自己也不用花腦力在「怎麼措辭」這件事上，可以把注意力放在解決問題本身。
④ 自動生成基本文件
交付的時候，客戶有時候會要求「交一份使用說明」。我現在的做法：
- 在 Cursor 裡把主要功能的使用流程用幾句話描述給它。
- 叫它生成一份 markdown 格式的使用說明。
- 我過一遍確認沒有遺漏或錯誤，直接出貨。
寫基本文件以前要花 1-2 小時，現在大概 15-20 分鐘，包含我 review 的時間。
定價心法：別把時間賣便宜
說到這裡要講一件很多工程師用了 AI 之後反而做錯的事：效率提升了，但報價也跟著降。
這個邏輯是錯的。
按功能交付計費，而不是按小時。
客戶付費是為了得到「可以上線的購物車功能」，不是為了「你在鍵盤上打字的 30 小時」。當你用 Cursor 把 30 小時壓縮成 15 小時，「可以上線的購物車功能」的價值沒有改變——你的時薪實際上翻倍了。
但如果你是按小時計費，你省下的 15 小時就直接變成你的損失。
所以報價的正確框架是：
- 這個功能對客戶的業務價值是多少？
- 市場上同等級的交付，行情在哪裡？
- 你的報價不低於這個行情，但也不因為「你用 AI 比較快」而打折。
具體數字上：我自己的經驗是，用 Cursor 把交付速度提升之後，我的接案時薪（換算回來）大概從 NT$1,500-2,000/hr 提升到 NT$3,000-4,000/hr，但客戶付的總價沒有明顯變化，因為報的是功能價，不是工時價。
另一個值得考慮的模式：月費維護合約。
做完一個案子之後，可以提案給客戶「每個月 NT$X,000，包含 Y 小時的維護和小修改」。有了 Cursor，同樣的維護工作你花的時間大幅縮短，但收的費用一樣。這是讓接案收入從「一次性」變成「每月穩定」的方式之一。
如果你還沒有穩定的接案客戶，或者正在想怎麼接到第一個 AI 相關的案子，可以看這篇：沒有客戶怎麼接第一個案子：從零到一的實際做法。
另外，市面上也有一些「AI 接案」的套路需要留意，這篇有更完整的分析：AI 接單套路分析：哪些是真機會、哪些是陷阱。
總結
用 Cursor 接前端案，效率提升是真的，但「快」只是其中一個好處。更重要的是：
- 報價：AI 幫你拆解需求、估工時，讓你的報價有憑有據，同時建立範疇管控的依據。
- 開發：元件生成快 3-4 倍，依風格改版更直覺，設計稿轉程式碼的時間大幅縮短。
- 交付與改稿：功能對照表讓客戶清楚你做了什麼、改稿輪數寫進合約控制範疇、AI 起草溝通回覆節省精力。
- 定價：效率提升不等於降價，要改成按功能計費，把省下的時間轉化成更高的實際時薪。
這套 SOP 不是一次就能跑順的，要根據你的客戶類型和案子性質微調。但核心邏輯就是：把重複性的工作（估時、生元件、寫文件、溝通措辭）交給 AI，把你自己的時間留給需要判斷和溝通的地方。
如果你想進一步了解怎麼把這套流程轉化成穩定的 AI 賺錢模式，可以訂閱電子報，我把目前整理的 AI 賺錢工具地圖 放在那裡，免費取用：訂閱電子報。