Please enable JavaScript.
Coggle requires JavaScript to display documents.
AI網頁自動化生成, 提供圖素、KV、資料、 自然語言描述、 動畫強度選項、CI, 工單、結構圖生成模組 (原先版本)URL,…
AI網頁自動化生成
資料輸入
工單、結構圖生成模組:
將網頁以結構文字進行描述
含視覺化描述/去視覺化
lo-fi框線圖生成模組
提供參考骨架
框線編輯器
開源方案-Moveable
決定文字、物件位置
Hi‑Fi 素材補齊與確認 Gate
流程圖生成模組
模型管理
操作log、監控
生成結果與版本管理資料存放
*內部網頁資料庫
*CI規範、區塊規範資料
評估哪些原型程式碼可以沿用、哪些需要重構
設計正式前後台架構與 API
將 AI 分析、Lo‑Fi、Hi‑Fi 等功能模組化
串接內部資料庫、CI 規範、元件庫與其他系統
處理多人同時使用、資料隔離及操作紀錄
提供圖素、KV、資料、
自然語言描述、
動畫強度選項、CI
Hi-Fi網頁生成器
物件編輯器
視覺類外觀、字體大小等 調整
提交、審核
內部測試
上架
編輯修改
AI Design Plan
工單、結構圖生成模組
(原先版本)URL
抓 HTML 原始碼
移除 script/style/svg
截到最多約 80,000 字元
一次丟給 Gemini
分析並產生工單
參考工單 + 流程圖
現存問題:幻覺
網站是圖片組成情況產生幻覺
圖片按鈕 文字無法讀取
MicroLink 截圖
Full Screenshot
工單、結構圖生成模組 v2.0
(已完成佈署)
URL
DOM / HTML
文字、結構、連結
Evidence Map
證據清單
AI
AI 產生參考工單
流程圖
Visual:
全頁截圖
原始圖片
影片播放器
Full Screenshot
原始圖片
Gemini Vision
AI辨識
AI:分析網頁輸出工單
/結構圖語法
工單資料
歷史網頁
瓦甘達
網頁分析、
自然語言
(工單格式)
AI結構化設計
程式碼、資安規範
LayoutContract
公司共用的 Logo、CI、字體與 Design Tokens:可預先存在系統中,不必每次重新上傳
大數據