大家好,歡迎來到 CwC Channel。今天要為大家介紹 Google Gemini 中的一項強大功能:Canvas。它能讓你在 Gemini 上直接設計 App、遊戲、圖表,甚至進行文章轉寫、程式碼產生等工作。最棒的是,它不僅能產生程式碼,還能直接預覽效果。本文將詳細說明如何使用 Canvas。
Canvas 簡介
ChatGPT 也有類似的功能,例如 Write or Code 中的 Canvas。不過,本文將專注於 Google Gemini 的 Canvas 功能。
如何使用 Google Gemini Canvas
步驟一:搜尋並登入 Google Gemini
首先,在網路上搜尋 Google Gemini。如果是第一次使用,請在右上角登錄。
步驟二:開啟 Canvas 功能
登錄完成後,你會發現 Gemini 與一般的 AI 工具非常相似。點選下方功能列中的 Canvas 按鈕,即可開啟 Canvas 功能。
步驟三:選擇範本或開始設計
Canvas 提供了一些範例,你可以直接使用範本建立 App、程式或其他功能。如果你是網頁程式設計師,可以直接輸入你想要建立的網頁內容。
- 提示詞技巧: 提示詞越詳細,生成的結果越精確。
實例演示:使用 Google 試算表建立雲端網頁資料庫
本次示範將使用本頻道所寫的《Google 試算表》一書,來建立雲端網頁資料庫。
- 免費雲端資料庫: 這是一個免費、易用的方法,能將靜態網頁轉為動態網頁,非常適合建立個人雲端資料庫。
步驟一:輸入描述內容
將你的描述內容複製到 Canvas 中。例如,輸入 "請根據以下的內容設計一個 'Landing Webpage'",然後貼上你的描述。
步驟二:Canvas 工作環境
務必點選 Canvas,才能進入 Canvas 的 Workspace 工作環境。
步驟三:生成網頁內容
系統會開始執行,大約 20 秒左右,就能完成整個網頁內容,且可直接使用。
步驟四:修改與預覽
-
自動儲存: 所有的修改都會自動儲存在雲端。
-
修改功能: 可以使用上一步、下一步功能,或是重新整理。
-
程式碼檢視: 可以選擇查看程式碼內容,例如將標題修改為 "CwC Google 試算表"。
-
預覽: 點選預覽按鈕,即可立即看到修改後的結果。
步驟五:AI 輔助構想
點選右下方的按鈕,系統會自動生成一些建議,讓你參考並提升網頁內容。例如,系統建議在登錄頁面中加入一個新功能,讓使用者輸入興趣領域,並根據書籍內容生成 Web App 程式碼。
錯誤處理
-
Console: 如果出現錯誤訊息,可以點選 Console 查看。
-
錯誤解決方案: 點選彈出視窗,系統會自動分析 Console 結果,並提供解決方案。
範例中,系統指出 API URL 無效,可能是因為未提供 API Key。經過修正後,重新整理頁面,錯誤訊息消失,表示修正成功。
進階功能:結合 Google Apps Script
Canvas 可以結合 Google Apps Script,讓網頁更具互動性。範例中,使用者輸入 "個人理財",系統會連接到 AI,顯示相關資訊。
修改與風格調整
隨時可以在提示詞中加入修改資訊。例如,將網頁風格改為科技風格,並加入切換深色/白色模式的功能。
發佈網頁
方法一:GEMINI AI PRO 版本直接發佈
如果升級到 GEMINI AI PRO 版本,可以使用右上方 SHARE 按鈕直接分享 Canvas。系統會自動生成連結,你可以分享給朋友。
- 缺點: 這種發佈方式會在網頁上方顯示標題,下方告知來自 Canvas,整體體驗不佳。
方法二:複製程式碼到免費平台
將所有程式碼複製到免費平台,例如 Google Sites,即可直接呈現網頁,所有功能皆可使用。
方法三:使用 Google 試算表發佈
參考書籍內容,免費使用 Google 試算表發佈網頁。在 Google 試算表中,使用 App Scripts 建立新網頁 Index,並複製貼上 Code.js 中的 DoGet 函式。儲存後部署,即可取得 URL 並直接使用。
其他應用
生成 Podcast
Canvas 可以生成 Podcast。點選執行後,系統會花費一些時間,完成後即可聆聽。
設計 App
Canvas 可以協助設計 App,例如追蹤任務的 To Do List。
設計遊戲
Canvas 也能設計遊戲,例如 3D 探索遊戲。使用者可以在這個世界中自由探索。
設計繪圖 App
Canvas 甚至可以設計繪圖 App,提供顏色選擇、畫筆、橡皮擦等功能。完成的圖畫可以下載。
官方範例
Google 官網也提供許多範例,例如鋼琴 App、旋轉 App、權限管理 App 等。
總結
Google Gemini Canvas 是一項強大的工具,歡迎大家嘗試。如有任何問題,歡迎告知。感謝您的收看,下一集再見!