gu-log SP-251 繁體中文翻譯版。原作:Thariq (@trq212)Know your unknownsEnglish
← html-effectiveness
部落格文章的配套範例

認識你的未知

地圖不等於實地——兩者之間的落差就是你的未知。這裡有十一個獨立的 .html artifact,幫你在實作前、實作中、實作後發掘那些未知。每一頁最上面是原始 prompt,下面是 Claude 產出的成品:貼上 prompt,你也能得到類似的頁面。

01

實作前

8 個範例

還沒寫任何程式碼的時候,是發現未知最便宜的階段。面對陌生領域時請 Claude 做一次盲點掃描;對「得看到才知道」的問題先做腦力激盪和原型;讓 Claude 就剩下的部分訪談你;當言語不夠用時,直接丟參考資料給它。

盲點掃描
Claude 掃描一個陌生的 auth 模組,回報你的未知未知——七張盲點卡片,每張都附可複製的 prompt 修正建議,最後組成一份更好的實作 prompt。
01-blindspot-pass.html
教我我的未知
互動式調色教學——詞彙階梯、即時前後對照畫面(附拉桿和預設)——把「讓影片好看一點」變成精準的專業 prompt。
02-color-grading-explainer.html
四種設計方向
同一個審核佇列,呈現成四種截然不同的樣貌——Ops 控制台、編輯台、看板、終端機——附「採用/跳過」按鈕,幫你寫好回覆。
03-design-directions.html
先做 Mock 再接線
Acme 影格標註工具列的可點擊拋棄式 Mock——三種可切換的擺放位置、A/B 問題、自動填好的回覆模板——在動真正的程式碼之前先玩過一遍。
04-toolbar-mock.html
腦力激盪介入方案
十種以程式碼為根據的流失防堵方案,從「今天下午就能上線」到「賭一整季」排列,附共鳴核取方塊幫你組出回覆。
05-churn-brainstorm.html
訪談
Claude 一次一個問題地訪談你關於一個模糊功能的細節,按架構影響範圍排序,然後交還一張決策表和一份現成可貼的實作 prompt。
06-interview.html
指著參考實作
一份語意對照圖,證明 Claude 理解了一份 Rust 參考實作——對應的程式碼片段、陷阱筆記、邊界案例表——然後再移植成 TypeScript。
07-reference-port.html
可調整的計劃
一份按「最可能調整」排序而非執行順序排序的實作計劃——標記出來的 schema 選擇附可切換的替代方案、有註解的型別介面、機械式工作收在底部折疊。
08-implementation-plan.html
02

實作中

1 個範例

不管事前規劃得多周全,未知仍潛伏在實地。讓 Claude 記錄一份運行日誌,記下每一處程式碼迫使計劃偏離的地方,這樣下一次嘗試會更聰明。

03

實作後

2 個範例

上線意味著別人會繼承你的未知。一份提案文件預先回答審核者準備問的反對意見;一份測驗確保你在 merge 之前真的理解改了什麼。