我在這篇文章中分享如何用Claude的Artifacts功能,不用自己寫程式,也能製作出一個簡單的小畫家,讓人邊塗鴉邊認識多波段天文觀測的概念。你們對哪些天文主題感到好奇呢?想要將它們連結到哪些學科領域呢?數學?文學?物理學?社會學?生物學?程式開發?遊戲製作?外語學習?…歡迎在「與AI探索天文」FB粉絲專頁或我的Threads留言分享你們的想法。
你閱讀著《資料視覺化:用Python為星空作畫》的10.1節,置身於一個Cyberpunk的科幻世界,眼前是拿著噴漆灌在牆上塗鴉的蕾娜·閃電,她正在向你解說多波段天文觀測的概念。
你闔上書,打開筆電,向視窗中的我問道:「我能利用AI工具,例如Claude,製作出能邊塗鴉邊認識多波段天文觀測的網頁小遊戲嗎?」
我回答:「你可以利用Claude的Artifacts功能來製作網頁小遊戲。它會開啟另一個視窗顯示AI產生的網頁程式,並能即時預覽成果。你要先在設定頁面中確認有開啟Artifacts功能,接著就可以在Claude的對話框中描述你想製作的網頁小遊戲。」
這時螢幕呈現Claude的設定頁面。

你思考了一下,然後開始輸入給Claude的指示:產生一個網頁版的塗鴉小遊戲,場景設定在一個賽博龐克風格的街頭,玩家可以使用不同顏色的噴漆在廢棄牆面上創作塗鴉。每種噴漆顏色代表不同波段的光(如可見光、紅外線、紫外線等),玩家透過這過程會學習到多波段天文觀測的基本概念。

此時畫面分為兩個部分,左側是與Claude的對話視窗,右側則顯示程式碼內容。隨著程式碼逐步撰寫完成,右側視窗最終自動切換為即時預覽的網頁畫面。

你試著操作第一版網頁,發現有些問題,思考該如何優化,然後繼續指示Claude:「請優化修正以下幾點:
- 目前遊戲場景尚未具備賽博龐克風格街頭作畫的氛圍,若無法以視覺方式呈現,請以簡短文字敘述遊戲世界觀,並說明玩家為何要在這面牆上使用不同波段的噴漆進行創作,強化遊戲背景與動機
- 儲存按鈕目前無作用
- 把目前畫面顯示的字CYBERPUNK 2077改成CYBERPUNK 404」

你覺得Claude修改後的版本有比較好,但發現儲存按鈕仍然沒作用,於是乾脆請它先移除這功能。最後,你依照我的指引,點選右上角的「Publish」按鈕,產生網頁連結以便分享給其他人
:https://claude.ai/public/artifacts/dca1c319-54a3-40b0-a5c7-dda904a7e04b
此篇文是由蘇羿豪經Claude協助創作,文章以「創用CC姓名標示─非商業性 4.0(CC BY-NC 4.0) 國際版授權條款」釋出。歡迎分享並追蹤「與AI探索天文」FB粉絲專頁或我的Threads。