把橫式改直式那天，順便把寫死的尺寸全拔掉
這件事拖了滿久的。
一開始我把 App 鎖成橫式，3/25 那一版（v1.0.2）就決定了。理由是射龍門桌上玩，三張牌攤開橫排，比較有在玩牌的感覺。
但後來越用越發現問題。
橫式的問題：
- 手機大家都直拿，打開 App 要先轉方向才能用，這個動作就卡住一批人
- 單手玩不了，要兩手撐才穩
- 通知、切 App 回來，方向會亂跳
- 朋友試玩的時候很多人直接關掉 — 「怎麼橫過來」
這個累積到 4/12 那天我終於決定 — 要支援直式。
但真的動手改以後，才發現更大的問題其實不在方向，是在下面：Claude 寫的尺寸全是寫死的。
前兩週我讓 Claude 自由發揮 UI，它寫出來的幾乎都長這種：
1 | .frame(width: 320, height: 480) |
或者：
1 | CardView().padding(.top, 40).offset(x: 20) |
在 iPhone 15 看起來很漂亮。
換到 iPhone SE，螢幕會炸開、卡牌被切掉。
換到 iPhone Pro Max，四周一片空白。
換到 iPad，整個畫面小小一塊擠在角落。
每次我叫 Claude「某某畫面調一下」，它改完那個畫面 OK 了，另外三個畫面又壞了。典型的改 A 壞 B。一開始我還耐著性子一個個修。修到第五輪我真的受不了。
那天下午我乾脆決定把所有畫面整組打掉重練。原則很簡單：
- 不用絕對 pt 值
- 所有尺寸都是容器尺寸的比例
- 字體用 DynamicFont，根據螢幕高度算 0.7x 到 1.6x
- 間距跟著 padding 比例走，不寫死
- 卡牌比例鎖 2:3，但具體大小由容器決定
大概長這樣：
1 | let cardHeight = geometry.size.height * 0.35 |
一個下午重構下來，晚上才收尾。過程中順便把橫式跟直式兩套版面都做起來，讓玩家自己選。
結果：iPhone SE、iPhone 15、Pro Max、iPad，全都撐得起來，不管橫直。
之後每次 Claude 改 UI，我都多叮嚀一句「不要寫死尺寸，用比例」。後來乾脆寫進 CLAUDE.md，每個新 session 它都會看到。再也沒發生過改 A 壞 B 的事。
最大的體會是 — 跟 AI 合作寫 UI 的時候，你不能等它自己學會適應螢幕，你要在一開始就把「比例」這個思維塞在它面前。你不講，它每次都寫死。你講了，它每次都想。
做 App 到這個階段我才真的懂，Vibe Coding 不是把需求丟出去就好，是你要先把你對工程的標準內建在它的上下文裡。