這是一個由 AI 助手 MinMax 2.7 全程驅動設計與生成的靜態網站樣板庫。它不是一個軟體工具或框架，而是一個大型的設計資源庫，旨在展示 AI 如何針對 24 個完全不同的產業（如美容、餐飲、科技、法律、教育等），產出具有差異化視覺風格與內容邏輯的網站原型。
這個專案解決的問題是前端開發者或設計師在面對新產業需求時，常遇到的版型枯竭問題。它提供了從視覺配色、字體選擇、到 12 個核心頁面結構的完整參考，讓開發者不需要從零開始思考該產業的網站應該長什麼樣子。
核心做法與技術實現
本庫採取純原生開發路徑，完全不依賴任何外部框架（如 Tailwind 或 Bootstrap），僅使用 HTML、CSS 與 Vanilla JS。
每套模板都擁有獨立的 CSS 架構，避免使用通用樣式。例如，美容類樣板採用左右分割的 Split Layout，科技類則使用方塊瓷磚的 Bento Grid，而法律顧問類則強調極致留白與襯線字體的 Editorial 風格。
每套樣板均包含 12 個 HTML 頁面，涵蓋首頁、關於、服務詳情、作品集、FAQ、預約、部落格等完整商業網站所需路徑。
最值得關注的是每套模板附帶的 prompt.md。這詳細記錄了生成該樣板的 AI 指令，包括對色彩策略、空間系統、運動哲學（動畫邏輯）以及內容節奏的定義，將設計思考過程透明化。
適合誰使用
前端初學者：可以透過閱讀原生 CSS 學習如何實現不同的佈局（如視差滾動、非對稱網格、Bento Grid）。
快速原型開發者：需要快速為客戶搭建一個產業原型，可以直接拿走 HTML 結構並替換內容。
AI 提示工程師或 Prompt 工程師：研究如何透過精確的指令讓 AI 生成具有高度一致性且符合產業美學的 UI 程式碼。
技術亮點
產業調性轉化：AI 成功將抽象的產業特質轉化為具體的設計語言。例如，將「權威感」轉化為黑白金配色與 Cormorant Garamond 襯線字體；將「活力」轉化為橙黃色調與 Syne 前衛字體。
結構化元數據：每套樣板附帶 tags.json 與 template.json，將視覺風格、色票、字體與產業標籤結構化，便於機器讀取與篩選。
輕量化互動：使用 Intersection Observer API 實現滾動淡入效果，並用純 JS 處理 FAQ 折疊與手機選單，保持了極高的載入速度。
實務限制與導入風險
靜態限制：這僅僅是 HTML 樣板，沒有後端邏輯。所有表單提交（如預約、聯絡）目前僅是模擬效果（Fake Submit），實際導入時需自行串接 API 或後端服務。
維護成本：由於每套樣板的 CSS class 命名完全獨立（為了追求差異化），如果你想將多套樣板的功能合併到同一個專案中，會面臨嚴重的樣式衝突與冗餘，無法像使用框架一樣統一管理。
圖片授權：雖然目前使用 Unsplash 圖片，但 README 已明確提醒，正式商用前必須替換為自有授權圖片，否則有法律風險。
成熟度判斷
本專案屬於展示性質的樣板庫（Template Showcase），而非可直接部署的產品。其程式碼品質屬於標準的原生開發水準，沒有複雜的架構設計，但其在 AI 生成 UI 的完整度與產業覆蓋面上具有很高的參考價值。