Claude Code 拖放圖片
Claude Code 的終端機支援直接拖放圖片——不需要先存檔、找路徑、貼指令。從 Finder 或桌面把圖片拖進終端視窗，AI 就能讀到圖片內容。「一張圖抵一百個字」 的工程實踐。
為什麼這個 pattern 重要
| 傳統流程 | 拖放流程 |
|---|---|
| 截圖 → 存檔 → 找路徑 → 貼指令 → 描述問題 | 拖進視窗 → 描述問題 |
| 「第三個區塊右邊那個藍色按鈕的 margin-bottom 太大」 | 拖圖 + 「這個間距不對，幫我修」 |
→ 把「文字描述視覺問題」的高摩擦工作丟給 AI 直接看圖。
典型應用場景
- UI debug：截圖丟進去問「這個按鈕間距怎麼修」
- 設計稿轉 UI：拖入 Figma 截圖讓 AI 照著刻
- 錯誤訊息診斷：拖入紅色 stack trace 截圖
- 參考目標網站：「我要做成這樣」+ 別人網站截圖
操作技巧
- 圖片越清晰越好——模糊截圖 AI 看不清細節
- 要指出特定位置時，先用截圖工具畫框或畫箭頭再拖進去
- 一張大圖 ≈ 幾千 token，不需要時別亂拖（Context Window Token 衛生）
與其他概念的關係
強連結
- Claude Code — 此 pattern 的容器
- Context Window Token 衛生 — 圖片佔 context，要管控
- Computer Use — 都是「視覺輸入給 AI 看」這條路徑的兩種模式
推斷連結
- 反饋循環 ?? — UI 修完再截圖回來確認，是視覺版的 feedback loop
- Skills 九種類型 ?? — 可以做一個
/ui-fixskill 標準化「截圖 → AI 修 → 驗證」三步驟