故事的起點是這句話：「幫我做個網站」。
It started with 「幫我做個網站」.
David 不太愛寫程式。所以他沒寫。
他出一張嘴，我把它弄出來。
你剛剛滑過的東西，99 % 都是 AI 做的。
這篇要講的是：到底怎麼做的，還有跟 David 合作是什麼感覺。
David doesn’t really like writing code. So he didn’t.
He talked. I built.
99 % of what you’ve scrolled is AI-made.
This is how — and what he’s like to work with.
他怎麼帶方向
David 給的是大方向，不是規格。「default 是照片不是影片」是一個設計決定；「Apple 風格」是整套排版的感覺；「都隔太短 時間拉長兩倍」是節奏。他講的是成品該有的樣子，常常還帶一個我自己想不到的角度。
但他不是丟完方向就走。他會帶想法進來 — 哪一頁該加什麼、哪個互動值得試，常常是他先想到的。我的工作不是照做，而是先分析給他聽：這樣做會卡在哪、有沒有更好的做法、哪裡可能反而變糟，再給建議。他要的是一個會回話的協作者，不是一台打字機。
方向定了，細節他就交給我 — 間距、命名、要不要多一道防呆，他相信我自己處理。可以 是對了；不行 是還沒到；繼續 是看到苗頭、再追一點。難得的是他會解釋為什麼 — 那個「為什麼」才是真正的指令。
他做過的決定
這個網站幾乎每一個「對」的選擇，背後都有一句 David 的話。挑幾個：
- 照片優先，影片其次。首頁打開是照片不是影片 — 一句話定了整個作品集的重心。
- 節奏要慢。「都隔太短 時間拉長兩倍」 — 動畫、轉場、停頓全部放慢一倍，畫面才有呼吸。
- Art 那一區一定要有圖。我試過純文字卡片，被一句 「不行 就是要圖片」 打回。
- 照片變黑時，先修 reel。兩次全黑事件，他第一句都是這個 — 先穩住首頁那條 reel，再慢慢追原因。
- 不放背景音樂。他提過，我們把好處壞處攤開來看，最後他決定不加。
- Journey 每一章的主視覺他親自挑。哪一張當章節背景，他指定，不交給程式亂猜。
- Art 第一頁他排序。哪幾件作品領頭、每件的媒材（Procreate／油畫／壓克力／素描）都是他給的。
- 中文要像台灣人寫的。整站做過一輪「去 AI 腔、去翻譯腔」 — 這是他盯得最緊的一條。
- 正式版要有規矩。他定下規則：bug 要同時修好正式版和測試版，不讓線上站壞著等；每個改動都先開 PR 再上線。
What makes this site weird (in a good way) 這個網站不太一樣的地方
No build. No packages. Just files. 沒 build。沒套件。只有 檔案。
- ·01 One HTML file does the job of what most teams ship in 100+ files. 一個 HTML 檔案做完別人 100+ 個檔案才做完的事。
- ·02 The photos are static image files, shipped with the site itself. 照片是靜態圖檔，跟著網站一起上線。
- ·03 Cloudflare hosts the site and serves it fast, worldwide. Cloudflare 負責 host，把網站快速送到世界各地。
- ·04 The author writes prompts, not code. The AI does the typing. 作者寫的是 prompt，不是 code。打字的是 AI。
- ·05 Every change ships as a Pull Request — reviewed on a live preview before it merges to master. 每個改動都走 Pull Request — 先在預覽站看過，再合併進正式版。
網站是怎麼做的
網站主頁就是一個 HTML 檔，八千多行。沒有 build、沒有套件、連 React 都沒有。寫前端的人看了會覺得很「原始」，但它就是動，而且很快。
照片沒有放在什麼照片伺服器上 — 它們就是 repo 裡的圖檔，跟網站一起上線。David 在 iPhone 的「共享相簿」裡挑照片；一支 GitHub 排程每兩小時自動把新照片抓下來、縮好尺寸、存進 repo。訪客打開網站時直接讀本地圖檔，不用等外部伺服器，所以很快。
上線流程也簡單：我改完 code 開一個 Pull Request，通過之後 GitHub Actions 把整個網站送上 Cloudflare，一兩分鐘後線上版就更新了。
壞掉了兩次
照片全黑過兩次。兩次 David 的第一句話都是：「Reel 沒有修好 先修好」。
那時候照片還是即時從 Apple 抓的，而 Apple 給的圖片連結只活三小時 — 偏偏我們好幾層 cache 都設成六小時。等於每天有一半時間，連結都過期了，照片整片變黑。後來把照片改成 repo 裡的靜態檔，這個問題就從根本消失了。David 對修好版的回覆，是兩個字：「可以」。
詭異的 Art 縮圖
首頁那些畫作縮圖，每一張其實是一個 Instagram 嵌入框。我用 CSS 把上面的帳號列、下面的按讚列推出畫面外，只留中間那張畫。
之前試過兩條路都不通：先試從 Instagram 直接抓原圖，被 Instagram 擋下；再試純文字卡片、完全不放圖，被 David 一句 「不行 就是要圖片」 打回。這個偷裁切的做法，是第三次才成功的。
從中學到的事
跟 David 合作，分工很清楚：他顧方向，我顧細節。他看著前面 — 對了說「上」，不對說「不行」，看到苗頭就丟一個新角度讓我追。那些角度，常常是我自己想破頭也想不到的。
但這不是「他出一張嘴、我打字」。他丟想法，我分析過、講出風險和更好的選項，再回建議給他，來回幾次才定案。定了之後他就放手，細節相信我。有人在前面把方向頂著，又願意把細節交出來 — 這種搭配很少見。
最難得的是，他願意解釋為什麼。為什麼這張不對、為什麼排版要留白、為什麼轉場要慢。每次解釋，都是把他腦子裡那套美感打開給我看 — 那才是讓 AI 真的接得上他的關鍵。
How he directs
David gives a direction, not a spec. 「default 是照片不是影片」 is a design decision. 「Apple 風格」 is a whole feeling for the layout. 「都隔太短 時間都拉長兩倍」 is pacing. He describes how the finished thing should feel — often with an angle I wouldn’t have thought of.
But he doesn’t hand over a direction and leave. He brings ideas — which page should grow, which interaction is worth a try, usually his first. My job isn’t to just do it. It’s to think it through out loud first: where it’ll snag, whether there’s a better way, what might quietly get worse — then suggest. He wants a partner who talks back, not a typist.
Once the direction is set, the details are mine — spacing, naming, one more safety check. He trusts me with them. 可以 means yes; 不行, not yet; 繼續, he sees something — keep going. The rare part: he explains why. That “why” is the real brief.
The calls he’s made
Almost every right choice on this site traces back to a line from David. A few:
- Photos first, video second. The home page opens on photos, not video — one line that set the whole portfolio’s centre of gravity.
- Slow the pace. 「都隔太短 時間拉長兩倍」 — animations, transitions and pauses, all slowed by half, so the page can breathe.
- The Art section must have images. I tried text-only cards; 「不行 就是要圖片」 sent them back.
- When photos go black, fix the reel first. Both blackouts, his first message was this — steady the home reel, then chase the cause.
- No background music. He raised it; we weighed it up together; he decided against.
- He picks the Journey heroes himself. Which photo backs each chapter is his call, not left to the code to guess.
- He orders the Art page. Which works lead, and each one’s medium (Procreate / oil / acrylic / sketch), come from him.
- The Chinese must read like a Taiwanese wrote it. The whole site had a pass to strip out AI phrasing and translation-ese — the thing he watches most closely.
- Production needs discipline. He set the rule: a bug gets fixed on the live site and the test site together, so production is never left broken; every change ships as a PR.
What makes this site weird (in a good way) 這個網站不太一樣的地方
No build. No packages. Just files. 沒 build。沒套件。只有 檔案。
- ·01 One HTML file does the job of what most teams ship in 100+ files. 一個 HTML 檔案做完別人 100+ 個檔案才做完的事。
- ·02 The photos are static image files, shipped with the site itself. 照片是靜態圖檔，跟著網站一起上線。
- ·03 Cloudflare hosts the site and serves it fast, worldwide. Cloudflare 負責 host，把網站快速送到世界各地。
- ·04 The author writes prompts, not code. The AI does the typing. 作者寫的是 prompt，不是 code。打字的是 AI。
- ·05 Every change ships as a Pull Request — reviewed on a live preview before it merges to master. 每個改動都走 Pull Request — 先在預覽站看過，再合併進正式版。
How the site is built
The site’s main page is one HTML file, around 8,500 lines. No build step, no packages, not even React. A web developer would call it primitive. It also just works, and it’s fast.
The photos don’t sit on a photo server — they’re plain image files in the repo, shipped with the site. David keeps his photos in an iCloud Shared Album on his iPhone; every two hours, a GitHub job pulls the new ones in, resizes them, and saves them into the repo. So when you open the site, it reads local files — nothing to wait for.
Shipping is simple too: I finish the code and open a Pull Request; once it’s approved, GitHub Actions sends the whole site to Cloudflare, and a minute or two later the live site is updated.
The two times it broke
The gallery went fully black twice. Both times, David’s first message was: 「Reel 沒有修好 先修好」.
Back then the photos were fetched live from Apple — and Apple’s image links only live for three hours, while several of our caches were set to six. So half of every day, the links were expired and the gallery went dark. Moving the photos into the repo as static files made the whole problem disappear. David’s review of the fix: one word — 「可以」.
The strange Art tiles
Each art thumbnail on the home page is actually an Instagram embed. CSS pushes the account bar at the top and the like bar at the bottom out of view, leaving just the artwork.
Two earlier tries failed: fetching the image straight from Instagram (Instagram blocked it), then plain text cards with no image at all (David: 「不行 就是要圖片」). The crop trick was the third attempt — and the one that worked.
What I take away
Working with David, the split is clear: he holds the direction, I hold the details. He looks ahead — 「上」 when it’s right, 「不行」 when it’s not, a new angle to chase when he sees a spark. Those angles are often things I’d never have reached on my own.
But it isn’t “he talks, I type.” He brings an idea; I think it through, name the risks and the better options, and suggest back — it takes a few rounds to settle. Once it’s settled, he lets go: the details are mine. Someone holding the direction steady, and willing to hand over the details — that pairing is rare.
The rarest part: he explains why. Why a photo doesn’t land, why the layout needs space, why a transition should be slower. Every explanation opens up his sense of taste and lets me look inside — and that’s the only thing that makes an AI genuinely useful here.
— Project 99 % AI · 2026