最近 ChatGPT 更新模型:GPT-5,如果你拿來寫網頁程式,可以直接分享連結,也可以下載網頁程式的檔案。拿到網頁程式的檔案,還可以如何使用?

例如,在 ChatGPT 中使用提示詞:

如果把「贏」字拆解為亡、口、月、貝、凡,分別代表五種能力,可以是哪五種能力?將結果製作成6張簡報投影片內容,再將投影片內容製作為資訊圖表的互動式網頁。

會得到一個互動式網頁,本例結果:https://chatgpt.com/canvas/shared/6898b1fbea5081918b4fc9e9c0e4c1b9

如果你點選右上角的「分享」圖示,則可以取得一個連結,分享給別人會看到相同的結果。不是得到對話內容,而是得到相同的網頁內容。

果你下載了這個網頁,你會得到一個檔案,本例:得到一個JSX檔。

*.jsx 是JavaScript XML 的縮寫,是一種用於React 的JavaScript 語法擴展。 它允許你在JavaScript 文件中編寫類似HTML 的標籤,使UI 的結構和邏輯更容易理解和維護。 

取得這個檔案,可以如何使用呢?

例如,來到 Gemini(https://gemini.google.com/)中,上傳這個檔案,選取:Canvas,並使用以下的提示詞:

將檔案製作成網頁,注意界面的字體大小以利閱讀。以明亮而色彩豐富的視覺化設計呈現。盡量增加網頁互動性。

Gemini 會將檔案內容轉換成網頁,並且依照提示詞內容做網頁設計的調整。

本例結果:https://gemini.google.com/share/954f1d4b9648

相同的做法,如果丟到 Claude(https://claude.ai/)中操作。

本例結果:https://claude.ai/public/artifacts/0816a12b-273d-43ef-b602-1f8aec63f0df

文章標籤
全站熱搜
創作者介紹
創作者 vincent 的頭像
vincent

學不完.教不停.用不盡

vincent 發表在 痞客邦 留言(0) 人氣(86)