新網站上線了。用 AI 重做花了一週，中間改了好幾次方向。下面是影片版，也可以繼續往下看文字版。
Play video先交代一下背景：我做了七年產品經理，其實不太會寫程式碼。但過去三年，我一直在用 AI 做各種專案，這個網站就是其中之一。
舊網站的問題
舊版已經上線一年多了。我當時挺喜歡，但有幾處越來越讓我彆扭：
- 首屏。 背景特效看膩了，我想把自己放進設計裡，讓它更有個性。
- 專案展示。 有專案牆也有精選區，但想了解詳情還是得點進去，載入效果也不太好看。
- 服務介紹。 列的是我的技能，可沒有技術背景的客戶看完，可能還是不清楚我到底能幫他做什麼。
- 缺的功能。 我還想加部落格和郵件訂閱。
所以計劃是：先定視覺，再重做專案和服務，最後加新功能。
找到視覺方向
我先收集參考：網站、圖片、版式，看到喜歡的就存下來。其中一個想嘗試的方向是寫實的人物。卡通風格的 3D 人物已經很多網站在用了，我想看看 AI 還能做出什麼。
我試了幾個概念：卡通 3D 版的我、坐在水裡的我、只有人物沒有場景的版本，還有一張被幾面鏡子環繞的俯拍。鏡子那張作為靜圖很有意思，但一動起來，那麼多倒影很難保持人物一致，只好放棄。
最後選中的是一個真實的人站在雲上——一個現實裡不可能存在的場景。
讓一張靜圖動起來
我把概念圖發給 Claude，一起把畫面拆成幾層：最後面是流動的雲，中間是 JACK MIAO 的名字，前面是我，最上層是導航和文字。
人物部分，計劃生成我向上、下、左、右看的綠幕片段，根據滑鼠位置切換，看起來就像我在跟著你的游標轉頭。綠幕方便把人物摳出來，夾在其他圖層之間。
我還想在離開首屏時加一個過渡：像是你穿過雲層，從雲的下方鑽出來。一開始用 Blender 做 3D 雲，調了好幾輪還是離概念圖很遠。與其繼續折騰、去買更高端的付費雲場景，我決定改用影片。
Claude 幫我理出需要哪些素材，並以原始概念圖的提示詞為基礎寫了影片提示詞。我透過 API 把 Claude 接上 Higgsfield，先生成測試片段，方向確定後再出 4K 成片。之後還有大量來回：修畫面瑕疵、放進頁面、檢查、重新生成。
專案區：在天空中下墜
這一塊嘗試的次數最多。白色背景加旋轉圓柱上的專案、藍天背景、流動的雲……都不滿意。
轉折點是我在 Pinterest 上看到的一張圖：一個人以跳傘姿勢懸在畫框正中間。這給了我一條故事線——頁面最上面我站在雲上，往下捲動穿過雲層，到了專案區，一個人正從天空中墜落。
流程還是一樣：和 Claude 打磨提示詞，在 Higgsfield 生成素材，再放進頁面裡調整。專案也砍掉了很多，只留一小部分精選。
原計劃裡有一項沒做成：本來想去掉專案詳情頁，最後還是留下了。頁面上的專案少了，但想細看仍然可以點進去。
服務區：直接說清楚
目標很簡單：讓人一眼看懂我能幫什麼忙。網站別處的動效已經夠多了，所以這裡就用文字把服務老老實實寫清楚。
為了把故事接下去，我用 Higgsfield 生成了一個掛著氣球的我，讓它沿著路徑在文字後面來回飄。文字負責講清楚，人物負責把這一段和前後連起來。
部落格、訂閱，以及最後一次改方向
和那些視覺實驗比，部落格和郵件訂閱順利多了，Claude 很快就做好了——你現在看的就是成果。
頁尾是我最後一次改方向的地方。最初想做一個飄在空中的鍵盤按鍵，點擊後開啟專案諮詢表單。用程式碼做，質感不對；讓 Claude 在 Blender 裡建模，近了一些，但還是差點意思。
最後我換成一個更好實現的東西：一扇飄在天上的窗，透過它能看到我在工作。 整條線也就此閉合：站在雲上，穿過天空墜落，掛著氣球飄過，最後是一扇望進我工作的窗。
幕後還有一些改動：升級了防機器人驗證、更新了 API 介面、換了部署方式。這些在頁面上看不到，就留到以後再說。
我的收穫
有些想法一路走到了最後，有些沒有。Blender 雲、旋轉專案牆、鍵盤按鍵，每個都試了好幾輪。有時候換的是實現方式，有時候換的是想法本身。
這其實就是整個過程的核心：先把想法做到能看見的程度，看看實際效果，再決定繼續還是換方向。AI 讓這個循環快到一週內能跑很多遍。
從頂部開始滑一遍看看吧。如果想看我接下來做什麼，歡迎在下面訂閱。
