鐵人檔案
Vibe Coding 對我而言，不只是利用 AI 寫程式，而是讓設計想法更接近「真的做出來」的機會。身為設計背景程式底子薄弱的學習者，我將從過去熟悉的作品與設計流程出發，嘗試使用 Vibe Coding 重新製作、延伸，甚至挑戰過去需要工程師協助才能完成的互動作品。系列文章將記錄從構想到實作的過程，包括與 AI 協作的方法、程式修改、Bug 排查、失敗與意外，以及在一次次實作後對 Vibe Coding 的理解與反思。透過這段從設計走向開發的過程，探索 AI 是否真的能成為設計師與程式之間的橋樑。
前幾天已經把《時間就是金錢》的主畫面和番茄鐘分別做出來，但當時兩個頁面還是各自獨立的。所以今天沒有繼續往後做新的功能，而是先把前面的進度補完：把主畫面和番茄鐘真...
昨天最後成功把主畫面和番茄鐘接起來了，不過昨天的文章裡，有一段我沒有講。 它其實沒有改得那麼順利。 沒有一次就改成功 功能最後雖然有成功，但中間還是遇到了問題。...
昨天才剛遇到 Cline 在修改程式時不斷失敗，最後甚至差點把原本的檔案重新建立。雖然最後成功救回來了，但也讓我突然想到一個問題： 這幾天 AI 幫我寫了這麼多...
前面把主畫面、TODAY'S GOALS 和番茄鐘慢慢接起來之後，目前已經可以從新增任務一路進入番茄鐘，完成一次基本的專注流程。做到這裡，其實還少了一個很重要的...
昨天終於把番茄鐘和進度條接起來，完整完成一次番茄鐘後，進度就會增加 10%。原本以為進度條做到這裡就差不多了，但實際測試之後，又發現一個小問題： 進度條雖然會增...
昨天把進度條和百分比處理完後，今天沒有馬上繼續做累積到 100% 後的抽卡功能，而是先回頭處理主畫面一個已經注意一陣子的問題。TODAY'S GOALS 現在可...
前幾天把進度條功能完成後，現在每完整完成一次番茄鐘，進度就會增加 10%。接下來就要處理《時間就是金錢》原本很重要的一個功能： 累積到 100% 之後的抽卡。...
昨天先把累積到 100% 之後的抽卡流程整理好，今天就準備開始把它真的做出來。 原本《時間就是金錢》已經做過一批梗圖卡和生活挑戰卡，加起來大約有 50 張。不過...
所以……我要怎麼把卡片關掉？ 也就是卡片抽出來了、進度也成功歸 0%，但畫面會一直停留在抽到的卡片上。原本唯一的解決方法居然是——重新整理網頁。所以後來又補上點...
既然卡都可以抽了，那是不是可以開始做抽卡收藏？ 原本想把主畫面上的 ☆ 拿來做收藏，讓使用者可以看到自己曾經抽過哪些卡片。但真的準備往下做的時候，才發現好像不能...
