prototypelisted
Install: claude install-skill shumingyang-opencode/mattpocock-skills-zh-tw
# 原型
一個原型是**回答問題的一次性程式碼**。問題決定了它的形狀。
## 選擇分支
判斷正在回答的是哪個問題——從使用者的提示、周邊程式碼,或在場時直接詢問使用者:
- **「這個邏輯 / 狀態模型合理嗎?」** → [LOGIC.md](LOGIC.md)。建立單一可分享的 HTML 檔案——自由遊玩按鈕加上分頁式引導示範——把狀態機器推向那些在紙上難以推演的案例,讓非開發者也能操作。
- **「這個東西應該長什麼樣子?」** → [UI.md](UI.md)。在單一路由上產生數個截然不同的 UI 變體,可透過 URL 搜尋參數與浮動底欄切換。
兩個分支產出的產物差異很大——選錯分支會浪費整個原型。如果問題真的模稜兩可、又聯絡不上使用者,預設選擇較符合周邊程式碼的分支(後端模組 → 邏輯;頁面或元件 → UI),並在原型頂端寫明這個假設。
## 兩種分支皆適用的規則
1. **從第一天就是一次性,並清楚標示。** 把原型程式碼放在實際使用處附近(在它要服務的模組或頁面旁邊),讓上下文一目了然——但要命名得讓隨意瀏覽的人一看就知道是原型,不是正式程式。對於一次性的 UI 路由,遵循專案既有的路由慣例;不要發明新的頂層結構。
2. **執行成本趨近於零。** UI 原型從專案任務執行器的單一指令開始——`pnpm <name>`、`python <path>`、`bun <path>` 等。邏輯示範是使用者雙擊即可開啟的單一 HTML 檔案。無論哪種方式,啟動它都不需要思考。
3. **預設不持久化。** 狀態存在記憶體中。持久化是原型在_檢驗_的事情,不是它應該依賴的東西。如果問題明確涉及資料庫,就使用一個命名清楚標示「PROTOTYPE——請清除我」的臨時資料庫或本機檔案。
4. **跳過打磨。** 不寫測試,不做超出讓原型_可執行_所需以外的錯誤處理,不做抽象化。重點是快速學到東西。
5. **呈現狀態。** 每次動作之後(邏輯)或每次切換變體時(UI),印出或渲染完整的相關狀態,讓使用者看到改變了什麼。
6. **完成時留存。** 把任何經驗證的決策折疊回正式程式碼,然後把原型本身當成**主要來源**留存:提交到一條一次性分支、不放進 main,並在實作 issue 上留下指向該分支的上下文指標。答案也要留存——結論以及它定案的問題——寫進 issue 或一次 commit。main 分支只保留經過驗證的決策。