iT邦幫忙

2026 iThome 鐵人賽

DAY 2
0
Vibe Coding

一個 Vibe Coding 專案從原型到有人在用系列 第 2

叫 AI 做事,一句話和一張工作單差在哪?

  • 分享至 

  • xImage
  •  

你叫 AI 改一個小地方,換個圖示、改一行字。它回報「完成,檢查全部通過」。你打開一看,整塊畫面被重做了,你沒叫它動的地方全變了。

我在 usage 上就遇過一次。

一句話會發生什麼事

先說 usage 長什麼樣:它是 Mac 選單列上的小工具,點開會跳出一個面板,顯示幾家 AI 工具今天用了多少。面板分成好幾格,其中一格叫「專案用量」,標題前面有一個小小的資料夾圖示 🗂。

5 月 21 日晚上,我覺得那個圖示很醜,想換掉。我貼了面板截圖,打了一句:

這個專案用量 讓 codex 重新設計一個適配的放進去

Codex 是另一個專門寫程式的 AI,我想讓它來畫新圖示。

我腦中想的是「那個圖示」。但這句話也可以讀成「專案用量這一整格」,「重新設計一個」也可以是「做一個新畫面」。

放回畫面上看,這句話指得出兩個地方:

https://ithelp.ithome.com.tw/upload/images/20260916/20183178pHHRQlA2zq.png

AI 選了虛線框那個。五分鐘後,它做出一個跟整個面板一樣大的新畫面,還回報檢查全部通過。

我要的,只是橘圈裡那一個小圖示。

工作單的三格

這種事,只靠「講清楚一點」很難避免,因為你不會知道自己哪句話有兩種讀法。比較穩的做法是,每次都照同樣的格子寫:

改哪裡:
哪裡不准動:
做完怎麼算對:
  • 改哪裡:指得出位置。哪個畫面、哪一塊,最好連「現在長什麼樣」都寫上。
  • 哪裡不准動:把 AI 可能順手改到的地方先圈起來。
  • 做完怎麼算對:寫一個你看得到、可以打勾的結果,而不是「做得好看一點」。

我那次,三格其實都寫了

尷尬的是,那次交給 Codex 的工作單,三格都有。整理成白話是這樣:

改哪裡:新增一個獨立的「專案用量」畫面
哪裡不准動:六個原本的程式檔,包括原本那個面板
做完怎麼算對:新檔案存在、排版不破、檢查沒有錯誤

後面兩格寫得很完整,Codex 也全部照做,每一項都過了。

問題在第一格。第一格寫錯,後面兩格照樣會過:不准動的地方它確實沒動,檢查也確實全過,因為它從頭到尾在做另一件事。這時候後面兩格,是在替一個錯的東西把關。

發現做錯之後,第二張工作單長這樣(原本寫的是檔名和第幾行,這裡換成白話):

改哪裡:「專案用量」標題前面那個 🗂 圖示
哪裡不准動:這個圖示以外的所有內容
做完怎麼算對:只動到這個圖示,新圖示放進原本的小格子、不超出去

這一張,一次就做對。當晚跟著 v0.5.0 上線。

https://ithelp.ithome.com.tw/upload/images/20260916/20183178qKtbJL3GYI.png

同一格,只有橘圈裡的圖示換了。

第一格要寫到「指得出來」

兩張比一比,差別不是字數,是第一格能不能讓人指著畫面說「就是這裡」。

回頭看那張圖。我一開始那句話裡的「專案用量」,在圖上可以指橘圈,也可以指整個虛線框;第一張工作單接著把它寫死成虛線框。第二張寫的「專案用量標題前面那個 🗂 圖示」,在圖上只指得到橘圈。

所以檢查第一格的方法很簡單:寫完,打開畫面,照字面指一次。指得出第二個地方,就再寫具體一點,直到只剩一個。

你不用會看程式。寫出它在哪一塊、現在長什麼樣、只動它,就夠了。

不確定有沒有寫對,就叫 AI 先講一遍

那天把誤會解開的關鍵,是 AI 先把位置講出來。

我說「換那個符號而已」,又來回講了一次之後,它沒有馬上動手,先回我一句:指出是檔案裡哪一行的那個 🗂,問我要換成什麼。

我一看就知道,這次它指的跟我想的是同一個地方。

所以第一格寫完,如果你沒把握,可以先叫 AI 別動手,把它要改的地方講給你聽。它講的跟你想的是同一個地方,再讓它做。

今天可以帶走的

下次叫 AI 改東西,照這三格寫:

改哪裡:(指得出來的位置,最好附上現在長什麼樣)
哪裡不准動:
做完怎麼算對:(看得到、可以打勾的結果)

先別動手,告訴我你要改的是哪裡。

送出前,對著畫面把第一格照字面指一次,確定只指得到一個地方。最後那句,是再替第一格上一道保險。

明天講第二格「哪裡不准動」:寫得太緊,會發生什麼事。

參考資料

  • Anthropic,〈Be clear, direct, and detailed〉(講怎麼把指示寫清楚):https://docs.claude.com/en/docs/build-with-claude/prompt-engineering/be-clear-and-direct
  • Anthropic,〈Claude Code: Best practices for agentic coding〉(「Scope the task」一節,講指定檔案與範圍):https://www.anthropic.com/engineering/claude-code-best-practices
  • OpenAI,Codex prompting 指南:https://developers.openai.com/codex/prompting
  • usage 專案:https://github.com/aqua5230/usage
  • 新圖示上線的那次改動(commit 5889b3c):https://github.com/aqua5230/usage/commit/5889b3c

上一篇
用 AI 做出來的東西,敢交給別人用嗎?
下一篇
叫 AI「其他都不准動」,為什麼反而做不出來?
系列文
一個 Vibe Coding 專案從原型到有人在用6
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言