為了測試這些 AI 模型在實際任務中的表現，我做了一個小實驗專案 —— bsod-page，並已部署在 bsod.windo.me，讓大家可以直接線上體驗。

這個實驗的做法很單純：
給模型一張模仿 Windows BSOD 的 meme 圖，讓它們嘗試輸出完整的 UI 網頁。

測試模型

這次比較了五個不同的 AI 模型，涵蓋 Anthropic、Google 與 OpenAI：

• Claude Sonnet 4 —— Anthropic 最新旗艦模型。
• Claude Code —— Anthropic 專門強化程式碼的模型。
• Gemini 2.5 Flash —— Google 的高速模型，強調低延遲。
• Gemini 2.5 Pro —— Google 的高階模型，側重複雜推理與理解。
• OpenAI GPT-5 —— OpenAI 最新一代模型，綜合語言、程式與多模態生成能力。

比較面向

為了觀察不同模型的差異，我將結果從以下五個面向來檢視：

實驗結果

1. Claude Sonnet 4

• 能輸出 HTML，但格式不完全正確。
• 表情符號無法正確還原。
• 文字沒有靠左對齊，而是置中顯示。
• 雖然能展示，但與 meme 差距明顯。

2. Claude Code

• 結構清晰，但也有偏差。
• 背景顏色選擇錯誤，與 meme 不一致。
• 同樣存在 文字置中、表情符號錯誤 的問題。
• 語法乾淨，但在外觀忠實度上表現不佳。

3. Gemini 2.5 Flash

• 能正確生成可展示的網頁。
• 文字被置中，非靠左對齊。
• 表情符號還原稍微有落差。
• 有趣的是，還原度反而比 Pro 更高，更接近 meme。

4. Gemini 2.5 Pro

• 同樣能生成可展示的網頁。
• 文字置中，表情符號不夠精確。
• 雖然理解力理應比 Flash 更強，但在這次測試中，還原度比 Flash 低。

5. OpenAI GPT-5

• 唯一能完整正確輸出的模型。
• HTML/CSS 結構清晰、正確。
• 文字正確靠左對齊，樣式高度還原 meme。
• 表情符號完全正確，細節精準。
• 可直接作為網頁使用，效果最佳。

總結

• OpenAI GPT-5 是唯一能正確生成「格式、對齊與表情符號」的模型，忠實度與實用性最高。
• Claude 系列 雖能生成 HTML，但普遍存在文字置中與表情符號錯誤，Claude Code 還選錯背景顏色。
• Gemini 系列 能生成可展示的網頁，但文字置中、表情符號不足；Flash 還原度竟比 Pro 更高。
• 整體而言，GPT-5 在「由圖生成 UI」任務上明顯領先其他模型。

這也意味著，未來若要讓「圖生 UI」更成熟，可能需要 結合不同模型的優勢 —— 一個專注語義結構，一個專注排版與美感，最終融合成完整的可用結果。

想親眼看看比較結果？
bsod.windo.me