iT邦幫忙

2025 iThome 鐵人賽

DAY 5
0
生成式 AI

我不想努力了,AI!系列 第 5

Day 5:大型馴獸失敗現場:原來我才是要被訓練的那個

  • 分享至 

  • xImage
  •  

其實 AI 有發現問題癥結點也是無法解決:
「移除所有主題系統引用 - 不再使用 MaterialTheme.colorScheme」

但是他其實根本沒有真正移除掉,他留了最上層的 system design 的 theme 在那邊,或許對於 AI 來說這才是基本預設的設計

但是對於先前沒在管 system design ,單一元件單一背景調整顏色與樣式的狀況,這等於是雪上加霜

最後,我決定把自己降級為專案經理團隊裡的小M (Manager),一個親力親為、把目標切到最小、把 Scope 框到最死的主管。我的新戰術很樸實,甚至有些笨拙:

  1. 截圖為王: 將 v1.2.8 版所有理想中的 UI 畫面,一張張截圖下來,作為絕對的「視覺聖經」。
  2. AI 當分析師: 讓 Agent PM 和 Agent Architecture 去「看圖說話」,分析這些畫面裡到底包含多少元件。
  3. AI 當碼農: 最後再讓 Agent Android Dev 根據分析出來的規格,動手實現。

同時,我祭出了 Jetpack Compose 的一個樸實無華卻極其好用的功能:@Preview
我要求 AI 必須為所有實作的 UI 加上預覽,讓我可以透過人工的方式,像審批零件一樣,在不實際運行的情況下,快速判斷哪個元件合格、哪個有問題,最後再把它們組裝起來。

@agent-pm 我希望每個元件都可以再拆出來,請幫我協同 @agent-android-dev 拆分更細小的元件,然後記得要補上 @Preview 讓我可以查看最小單位的元件

然後他在最後給予了這個回應:

  1. 為所有 Compose 畫面添加 @Preview
    已為所有 15 個畫面添加預覽功能:
  • IndexScreen(首頁)
  • LeaderBoardScreen(排行榜)
  • ProfileScreen(個人資料)
  • ResultScreen(結果頁)
  • RankListScreen(排名列表)
  • 以及其他 10 個畫面
    現在你可以:
  1. 不會再閃退 - RankListViewModel 參數問題已修復
  2. 在 Android Studio 中預覽所有畫面 - 使用 Split 或 Design 視圖查看
  3. 自行調整顏色 - 在預覽中即時看到變化
    編譯成功,沒有錯誤,只有一些既有的 deprecation 警告(不影響功能)。

然後,AI 給了我一個看似完美的回應。它宣稱已為所有 15 個「畫面」添加了預覽功能,並解決了閃退問題。

他確實為每個「頁面 (Screen)」加上了 @Preview,但我的本意是「元件 (Component)」啊!結果就是,預覽功能不僅有 Render Issue,我看到的依然是一整個混亂的頁面,而不是我想要的、那個可以獨立驗收的「最小單位」。

這就是馴獸失敗的現場:我們說著同樣的詞,腦中卻是完全不同的東西。

至此,我明白了,我必須把指令的精確度,提升到「不容任何模糊解釋」的程度。我發出了最後通牒,這一次,我不要它猜,我要它寫下來:

@agent-pm 我希望每個元件都可以再拆出來,請幫我協同 @agent-android-dev 拆分更細小的元件,然後記得要補上 @Preview 讓我可以查看最小單位的元件

以及

@agent-pm 你能協同 @agent-system-architect 與 @agent-android-dev 幫忙把要拆出來的元件裂成表且放到 md 文件裡嗎

 這份文檔包含了:

  1. 36+ 個元件的詳細表格,包括:
    - 元件名稱
    - 來源位置
    - 功能描述
    - 參數列表
    - 依賴關係
    - 目前狀態(✅ 已完成 / 📝 待處理)
  2. 元件分類:
    - 核心 UI 元件:圓形選擇器等(4個,已完成)
    - 卡片元件:ActionCard、ActivityCard 等(3個,已完成)
    - 媒體元件:VideoPlayer、CameraPreview(2個,已完成)
    - 視覺化元件:RopeCanvas 等(2個,已完成)
    - 畫面專屬元件:25個待拆分
  3. 實施計畫:
    - 第1週:核心元件
    - 第2週:畫面專屬元件
    - 第3週:結果與分析元件
    - 第4週:優化與文檔
  4. 開發指南:
    - 命名規範
    - 參數設計原則
    - 預覽要求
    - 測試策略
  5. 成功指標:
    - 70% 元件重用率
    - 50% 減少重複程式碼
    - 20% 建置速度提升

https://ithelp.ithome.com.tw/upload/images/20250816/20091093VI6YnIofFc.pnghttps://ithelp.ithome.com.tw/upload/images/20250816/20091093gVZ4GfIZwB.png

當拆分文件與畫面截圖都已經 ready 後,接下來就是等他拆分的每個段落的實作
然後下面附上目前的成果圖

因為太多了所以附上幾張來代表代表
https://ithelp.ithome.com.tw/upload/images/20250816/20091093WD2Z3b2EzO.pnghttps://ithelp.ithome.com.tw/upload/images/20250816/20091093kawCQOYsBd.png

當拆分文件與畫面截圖都準備就緒後,整個專案的樣貌瞬間清晰了起來。接下來,就是驗收成果的時刻。附上目前幾個已完成的元件預覽圖,雖然只是冰山一角,但每一個都是在清晰指令下誕生的完美結晶。

這次的慘痛經驗也實際告訴我們一個真理:與 AI 協作,我們不能期待它能讀懂人心。我們必須將模糊且範圍龐大的需求,盡最大可能地拆分釐清。你給的 Scope 有多清晰,AI 的產出就有多精準。


上一篇
Day 4:我不當工程師啦!AI!
下一篇
Day ?: 邁入人工階段
系列文
我不想努力了,AI!6
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言