Google AI 現在可以製作互動網頁，主要透過 Gemini 的「Canvas (畫布)」功能 來實現。
對於身為網頁設計師來說，這是一個非常強大的快速原型製作（Prototyping）工具。它不僅能生成靜態內容，還能直接寫出包含 HTML、Tailwind CSS 和 JavaScript 的單頁應用程式（SPA），並在右側視窗即時預覽與互動。
以下是 Google AI 製作互動網頁的核心功能與運作方式：
1. 核心工具：Gemini Canvas (畫布)
這是目前 Google AI 生成互動網頁的主力功能。Canvas 是一個獨立的協作介面，專門設計用來處理較長的專案，包含寫作和程式碼編輯。
- 如何運作：您只需輸入提示詞（例如：「幫我做一個可以計算房貸利息的互動網頁」或「製作一個英文單字測驗遊戲」），Gemini 會在右側開啟 Canvas 視窗。
- 生成內容：它會自動編寫完整的 HTML 程式碼（通常結合內嵌的 CSS 和 JS），並直接「渲染」成可點擊、可操作的網頁介面 。
- 即時修改：您可以直接在對話框要求「把按鈕改成藍色」或「增加一個重置功能」，右側網頁會即時更新。身為設計師，您也可以直接點擊「程式碼檢視」手動修改 HTML/CSS 。
2. 技術規格與特性
從開發者角度來看，Gemini Canvas 生成的網頁具有以下特性：
- 技術堆疊：通常使用標準 HTML5 搭配 Tailwind CSS 進行樣式設計，並用 JavaScript 處理互動邏輯。這意味著生成的程式碼非常乾淨且現代化，容易移植 。
- 無需部署：在 Gemini 介面中即可直接執行與測試，無需架設伺服器。
- 分享功能：完成後，您可以點擊「分享」，生成一個公開連結（Public Link），讓客戶或朋友直接在瀏覽器中操作您生成的互動網頁，無需登入 。
3. 其他互動生成模式
除了 Canvas，Google 還推出了其他相關功能：
- Dynamic View (動態檢視)：這是一個更「自動化」的功能。當系統偵測到您的需求適合視覺化時（例如規劃行程、比較數據），會自動生成一個動態的互動介面（如地圖、看板），而不僅僅是給您一堆文字 。
- 互動圖表與測驗：您可以指定生成「互動式圖表」（滑鼠游標懸停顯示數據）或「測驗卷」，這些本質上也是小型的互動網頁元件 。
4. 實際應用場景 (針對網頁設計師)
- 快速原型 (MVP)：客戶如果需要一個簡單的計算器、表單或 Landing Page 概念，您可以幾秒鐘內生成一個可互動的版本給對方看，確認需求後再用 WordPress 實作。
- 小工具製作：例如匯率換算器、簡單的遊戲、倒數計時器等，可以直接生成程式碼並嵌入到您現有的網站專案中。
- 除錯助手：您可以將寫好的 HTML/CSS 貼給它，請它幫您增加互動效果（例如：Javascript toggle menu）。
