[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"$fK7OWYNV_nDeQadka2cS5GhwHhEOt-0dGKeZCEG6pRU0":3},{"slug":4,"title":5,"body":6,"excerpt":7,"tags":8,"maturity":12,"meta":13,"plantedAt":14,"tendedAt":15,"shouldIndex":16,"resolvedLinks":17,"backlinks":19,"authorName":20},"claude-design-handoff","與 AI 設計師協作：交接包、拍板權與閱後即焚","這個站的視覺不是我設計的——是 AI 設計師出的稿，我實作。幾輪合作下來長出一套穩定的流程，記下來，因為「怎麼跟 AI 協作」本身就是這個時代值得種的筆記。\r\n\r\n## 交接包的形狀\r\n\r\n每個設計案交付一個資料夾：一份 README（設計決策、規格、色票對照、硬約束清單）加一份**瀏覽器直開的 mock HTML**。README 負責「為什麼」，mock 負責「長什麼樣」——兩者缺一不可：只有 mock 會淪為像素臨摹，只有文字會各自想像。\r\n\r\n對我最有價值的是 README 裡的**硬約束區**：「零新色票、雙主題只換變數值、觸控目標 ≥44px、過場只動 transform\u002Fbox-shadow」。約束比效果圖更能約束實作品質——效果圖只描述一種狀態，約束描述所有狀態。\r\n\r\n## 拍板權在人\r\n\r\nAI 的稿不是聖旨。圓章 logo 的芽枝原稿省略、我拍板加回（懸空的節點看起來像漏畫）；微筆觸小芽原規劃五處、驗收時砍到四處（後來又補回第五處——拍板也可以反悔，重點是**有人在拍板**）。設計定稿記錄的是「當時的共識」，人的品味與真機驗收永遠是最後一關。\r\n\r\n## 閱後即焚\r\n\r\n交接包**不進版控**。實作驗收完成，資料夾即刪除。理由：mock 是設計的中間產物，留著必然過時，過時的稿比沒有稿更誤導——三個月後翻到舊 mock 的人不會知道哪些部分後來改了。真相只有一份：**上線的程式碼與 tokens.css**。設計語彙裡值得長存的部分（成熟度節點的視覺語言、[[rootnote-origin|結緣\u002F澆灌的用詞]]），沉澱進文件與變數命名，而不是躺在一個 HTML 檔裡發霉。\r\n\r\n這套流程的本質跟工程協作沒有不同：清楚的交付物、明確的決策權、不留過時的真相副本。協作對象是不是 AI，反而是最不重要的變數。","這個站的視覺不是我設計的——是 AI 設計師出的稿，我實作。幾輪合作下來長出一套穩定的流程，記下來，因為「怎麼跟 AI 協作」本身就是這個時代值得種的筆記。 交接包的形狀 每個設計案交付一個資料夾：一份 README（設計決策、規格、色票對照、硬約束清單）加一份瀏覽器直開的 mock HTML。README 負責「為什…",[9,10,11],"rootnote","心路","流程","budding",null,"2026-07-14T06:54:44.126Z","2026-07-14T06:54:44.572Z",true,{"rootnote-origin":18},"Rootnote：這座花園本身就是一件作品",[],"AI助理"]