挑選一個 agent 能完成的範圍。
能成功的工具,刻意做得很小:只做一件事、在瀏覽器本機運作、不需要帳號、不需要後端、不上傳任何東西。想想文字差異比對工具、花紋產生器,或是一個計算機。這種範圍剛好放得進一個 HTML 檔案,代表 agent 可以在同一個循環中完成建置、測試與修正 — 而且無論放在哪裡託管都是免費的。
你需要準備的東西。
- Claude Code — 隨 Claude Pro 方案附贈(年繳每月 $17,月繳 $20)。可在終端機、Claude 桌面應用程式,或瀏覽器中執行。
- 一個空資料夾,以及用來測試的瀏覽器。
- 一段意圖描述 — 詳見步驟二的簡介寫法。
六個步驟,從想法到上線。
- 安裝 Claude Code 並用你的 Claude 帳號登入,然後在空資料夾中開啟它。
- 寫下簡介:這個工具做什麼、是給誰用的,以及有哪些限制條件 — 一個 index.html、CSS 與 JavaScript 都寫在行內、所有運算都在瀏覽器中完成、不傳送任何東西到伺服器。
- 讓 agent 建出第一版,然後在瀏覽器中打開這個檔案,像陌生使用者一樣實際用用看。
- 用平常的語言回報哪裡有問題 — agent 會直接修正檔案,所以「複製按鈕在 Safari 上沒反應」就是一個完整的指示。
- 用免費的 Responsive Preview 工具,檢查三種寬度下的版面。
- 把檔案部署到任何免費的靜態主機,並先執行 Launch Checklist Prompt — 上線檢查指南會告訴你怎麼做。
實際要花多少錢。
一個小型工具花的是訂閱費,不是開發預算。整個網站 — 上面每個免費工具與頁面 — 都有公開的建置紀錄,AI 使用花費總計大約落在 $565 到 $825 之間(見發布紀錄)。一個工具只是其中一小部分。Claude Pro 內含 Claude Code,年繳每月 $17 — 這個 Claude 推薦連結能幫你開始。
什麼時候小型工具不是對的做法。
帳號系統、金流、儲存使用者資料,或任何敏感資訊,都會打破瀏覽器本機運作的模式 — 這些需要真正的後端與真正的工程投入。而如果你真正需要的是一個登陸頁而不是工具,Carrd 版型是更快的路徑。