iT邦幫忙

2025 iThome 鐵人賽

DAY 19
0
IT 管理

從 Claude 到 Claude Code,非工程師小白也能掌握的辦公效率神器系列 第 19

【Day19】Claude Artifacts(5) 從內容到工具,製作自己的客製化工具

  • 分享至 

  • xImage
  •  

「AI 不就是在給文字回答嗎?但我的工作跟寫文章沒什麼關係耶,這些 AI 工具對我還有幫助嗎?」

如果你有這個疑問的話,那今天的內容便是來解決這個問題的

前面幾天我們一直在聊「寫文章」——怎麼寫、怎麼改、怎麼管理版本

但 Claude Artifacts 能做的,不只是文字內容,還能讓你做出「實際能用的工具」。

而且重點是:你其實不需要會寫程式


從內容到工具:從單向靜態到雙向互動

先問個簡單問題:「文章」和「工具」的差別在哪裡?

你可能會想:「這不是廢話嗎?文章就是用來讀的,工具就是用來操作的啊。」

沒錯!但這個看似簡單的差別,其實代表了完全不同的創作思維

  • 文章:靜態
    • 你寫完,讀者看完,結束
    • 傳達資訊、解釋概念,讀者被動接收
  • 工具:動態
    • 使用者輸入、點擊、得到回饋,繼續使用
    • 它回應操作、計算結果、解決問題

舉個例子🌰

你可以寫一篇「如何計算OO」的文章,解釋公式、示範步驟寫的再清楚,大家看完,下次還是得拿出計算機自己算

或者我們可以做一個OO計算器,直接去根據需求來幫你去做那些事情

這就是從「內容」到「工具」的差異

而 Artifacts 厲害的地方在於:它兩種都能做,前幾天我們用它來「寫」,今天開始我們用它來「造」


零程式碼的真正意義

「零程式碼」聽起來很美好,但醜話要說在前面:零程式碼不代表零思考

成熟的海鞘

(但這世界上零思考的人真的好像蠻多的…)

很多人以為:「太好了!我什麼都不用懂,隨便說一句話,AI 就會變出工具!」

但當實際動手之後,卻發現可能沒想像中的那麼神奇 😅

實際上零程式碼的意思是:你不需要學程式語言的語法,但你需要知道自己要什麼

假設你想要一個「按下去會顯示問候訊息」的按鈕。

傳統寫程式(程式由 AI 提供):

const button = document.createElement('button');
button.textContent = '點我';
button.onclick = function() {
    alert('Hello!');
};
document.body.appendChild(button);

你要知道什麼是 createElement、什麼是 onclick、語法要怎麼寫。

用 Claude Artifacts:

「做一個按鈕,按下去會跳出『Hello!』的提示訊息」

你只需要知道:

  • 我要一個「按鈕」
  • 它要能「按」
  • 按了要「跳出訊息」

核心差異在哪?

  • 程式思維: 知道怎麼用程式碼實現功能
  • 功能思維: 知道你要什麼功能、這個功能該怎麼運作

「零程式碼」不代表你可以含糊其詞。相反的,你越清楚自己要什麼,AI 就越能做出符合需求的工具


快速迭代的威力

AI 時代真正讓人驚艷的,不只是「能做」,而是「超級快」

工具跟文章最大的差別是:工具要「用」才知道好不好

假設我們做一個倒數計時器:

你:「做一個倒數計時器,距離 2025/12/31」
Claude:(30 秒後)完成!

現在你實際看著它,然後發現:

「數字有點小,站遠一點看不清楚」
「可以加個進度條嗎?更有感覺」
「剩下不到 7 天時,能變紅色提醒嗎?」

這些需求,只有實際用了才會發現

而快速迭代讓這個過程變得超級順暢:

v1:基本功能(30 秒)
「做一個倒數計時器」

v2:放大數字(20 秒)
「把數字放大」

v3:加入進度條(30 秒)
「加一個進度條」

v4:加入提醒(30 秒)
「剩餘天數小於 7 天時顯示紅色」

總計:2-3 分鐘

對比傳統開發:

  • 規劃 30 分鐘
  • 寫程式 2 小時
  • 測試除錯 30 分鐘
  • 調整樣式 30 分鐘

總計 3-4 小時,效率差異可以到 40-50 倍

最最重要的是,你不需要一次把所有需求都想好

先做最簡單能用的,看看效果,再慢慢加功能

而某方面來說,這也是用這些 AI 工具來開發工具的最佳心態XD

重點:解決自己的特定需求

這裡有個更深層的價值:你不用再受限於現有工具了

以前一般使用者的心態歷程可能是:

需要工具時:
1. 搜尋「倒數計時器 App」
2. 下載一個接近的
3. 將就著用
   - 有廣告
   - 有不需要的功能
   - 缺少想要的功能
   - 介面不喜歡

「這個 App 如果能這樣就好了...」然後呢?要麼自己花時間寫,要麼繼續覺得很麻煩

現在 AI 時代的可以變成:

需要工具時:
1. 描述:「我想要一個...」
2. 生成:3 分鐘出現
3. 調整:改到完全符合需求
   - 沒有廣告
   - 只有需要的功能
   - 介面自己決定

從「消費者」變成「創造者」

  • 市面上沒有完全符合你需求的工具?沒關係,做一個
  • 想要的功能被藏在付費版裡?沒關係,自己加
  • 介面用起來不順手?沒關係,改成你喜歡的樣子

這種掌控感自由度,是傳統「找工具」思維永遠無法給你的


上一篇
【Day18】Claude Artifacts(4) 版本控制:從此不用害怕「還是第一版好了」
下一篇
【Day20】Claude Artifacts(6) 製作AI工具分享給別人用,也不再需因為卡被刷爆而「去你的Google太奸詐了」
系列文
從 Claude 到 Claude Code,非工程師小白也能掌握的辦公效率神器20
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言