「與AI探索天文」如何用Lovable製作一個角色扮演遊戲,讓玩家透過大學社團博覽會認識各個天文研究領域?

更新於 發佈於 閱讀時間約 6 分鐘

我之前的文章分享了如何用ChatGPT、Claude、Replit、Windsurf製作天文教育遊戲,這篇文章則接續分享如何藉由Lovable網頁應用程式開發平台的AI助手,不用自己寫程式,也能製作出一個角色扮演網頁小遊戲,讓玩家用逛社團博覽會的方式認識各個天文研究領域。歡迎追蹤《與AI探索天文》FB粉絲專頁,並訂閱《與AI探索天文》Substack電子報。我會分享如何運用各種AI工具,來探究你我好奇的天文主題、將它連結到生活及其他學科領域,並結合相關開放資料,打造有趣的天文應用程式與遊戲。我希望藉由這些分享,讓每個人都可以與AI創造出專屬自己的天文探索故事,拉近我們與星空的距離。

你閱讀著《資料視覺化:用Python為星空作畫》的4.1節,置身於《獵星者旅店》遊戲中。旅店老闆尼賀勒·瓦再達向你介紹旅店中各種與天文有關的社團組織,例如:「心跳天文學社」、「聽我的電波吧俱樂部」、「時空漣漪調查團」、「行星物語研讀會」、「島宇宙拼圖同好會」…等等。

你覺得這種透過虛擬社團介紹不同天文研究領域的方式很有趣,想試試看用AI工具製作出一個「天文社團博覽會」的角色扮演小遊戲。你想起曾在《與AI探索天文》FB粉絲專頁看過的幾篇文章:「如何用ChatGPT製作一個網頁小遊戲來認識找尋系外行星的方法?」、「如何用Claude製作一個能邊塗鴉邊認識多波段天文觀測的網頁小遊戲? 」、「如何用Replit製作一個網頁小遊戲來了解測量星體距離的方法並從中學習三角函數?」和「如何用Windsurf製作一個蒸汽龐克風格的歌詞網站來詠唱蓋亞太空望遠鏡的觀測任務?

闔上書,你向筆電視窗中的我問道:「我想用AI工具製作一個角色扮演遊戲,讓玩家透過大學社團博覽會認識各個天文研究領域。我試過ChatGPT的Canvas功能和Claude的Artifacts功能,但它們目前只能製作單一檔案的網頁,不適合比較複雜的遊戲。Windsurf功能雖強,但介面稍微複雜了些,至於Replit,訂閱費又有點高。是否有兼具ChatGPT簡單操作介面與Windsurf複雜網頁開發能力的AI工具?」

我回答:「你可以試試Lovable。它是一個內建AI的網頁應用程式開發平台,介面簡單,類似ChatGPT的Canvas,但也能像Windsurf那樣製作多檔案的複雜網頁。雖然它的訂閱費與Replit一樣是每月25美元,但也有提供每天5次限額對話的免費版。我已經幫你開啟Lovable網站並完成註冊登入,只要在對話框中描述你想製作的遊戲即可。」

raw-image

你思考了一下,然後輸入:「製作一個2D網頁版角色扮演小遊戲,玩家扮演一位剛入學的大一新生,正在逛社團博覽會。活動現場設有10~15個社團攤位,每個社團皆代表一個不同的天文研究領域,例如:行星科學、恆星演化、黑洞研究、宇宙學…等等。社團名稱需充滿創意與趣味性,能吸引玩家的好奇心。

在與社團成員互動時,社員需以熱血、充滿幹勁的招募口吻介紹自家社團,但介紹內容須符合真實科學知識,讓玩家在遊戲過程中認識各個天文研究領域。

語言與介面需採用台灣繁體中文。整體風格輕鬆活潑、富有探索感,適合大眾玩家。」

raw-image

畫面顯示AI正在根據你的需求撰寫程式。當你完食蔥油餅加蛋後,第一版網頁就產生好了。

raw-image

你試玩了一遍後,發現有需要改進的地方,於是向Lovable提出改版需求:「目前遊戲性不高,只有對話與資訊展示,請加入更多有趣的遊玩機制,以提升整體遊戲體驗。例如:

  • 選擇互動選項:玩家在與社員互動時,可選擇不同的對話回應,影響社員對玩家的好感度與招募結果並觸發隱藏故事。
  • 收集與成就系統:玩家可收集各社團贈送的限定貼紙或徽章、天文小知識卡片或社團周邊,增加探索動機。而且累積達成特定條件後還能解鎖成就或特殊劇情。
  • 任務系統:玩家可接下各社團的小任務,完成後獲得獎勵,但任務不要是單純的知識考題。
  • 隱藏彩蛋:在博覽會場地隱藏部分有趣的社團彩蛋,鼓勵玩家探索每個角落。

另外,要在網頁底部加上版權宣言:©2025 本遊戲由蘇羿豪藉由Lovable協助開發,作為「與AI探索天文」天文教育產品開發計畫的一部分。其中“蘇羿豪”和“與AI探索天文“要分別連結到https://astrobackhacker.twhttps://www.facebook.com/astroeduai這兩個網頁。」

raw-image

於是,你就這樣持續與Lovable協作改進遊戲,例如:「點擊社團後跳出的頁面有『選擇你的回應』,但沒有任何的選項及按鈕,請修正。」、「遊戲的所有文字描述需要更貼近大一新生逛大學社團博覽會的氛圍,目前的描述仍顯不足,請優化。像是加入大學名稱、現場氣氛描寫、玩家扮演的新生內心OS及動作描述…」、「將大學名稱改成獵星者大學。另外,提供能讓玩家選擇角色圖示的功能。」…..等等。

最後,你完成了「獵星者大學2025天文社團博覽會」遊戲,並將網頁連結分享給有興趣的人:https://e8f0581e-7631-4cd0-9baa-7798a22efd56.lovable.app

raw-image
raw-image
raw-image
此篇文是由蘇羿豪經ChatGPT及Lovable協助創作,文章以「創用CC姓名標示─非商業性 4.0(CC BY-NC 4.0) 國際版授權條款」釋出。歡迎分享並追蹤「與AI探索天文」FB粉絲專頁或我的Threads。也邀請你訂閱《與AI探索天文》電子報
留言
avatar-img
留言分享你的想法!
avatar-img
與AI探索天文
1會員
18內容數
為了延伸並實踐《資料視覺化:用Python為星空作畫》書中「與AI探索天文」的想法,我會在這分享如何運用各種AI工具,來探究你我好奇的天文主題、將它連結到生活及其他學科領域,並結合相關開放資料,打造有趣的天文應用程式與遊戲。我希望藉由這些分享,讓每個人都可以與AI創造出專屬自己的天文探索故事,拉近你們與星空的距離。
與AI探索天文的其他內容
2025/06/19
我前幾篇文章分享了ChatGPT、Grok、Gemini和Perplexity的深入研究功能,這篇文章則接續分享如何用Claude的深入研究功能,搜尋彙整火星研究的最新論文,並以自傳的方式呈現這些新發現。歡迎追蹤《與AI探索天文》FB粉絲專頁,並訂閱《與AI探索天文》Substack電子報。
Thumbnail
2025/06/19
我前幾篇文章分享了ChatGPT、Grok、Gemini和Perplexity的深入研究功能,這篇文章則接續分享如何用Claude的深入研究功能,搜尋彙整火星研究的最新論文,並以自傳的方式呈現這些新發現。歡迎追蹤《與AI探索天文》FB粉絲專頁,並訂閱《與AI探索天文》Substack電子報。
Thumbnail
2025/06/09
我前幾篇文章分享了ChatGPT、Grok和Gemini的深入研究功能,這篇文章則接續分享如何用Perplexity的深入研究功能,針對高中的彈性學習時間,設計出主題為「運用天文研究觀測資料進行藝術創作」的跨領域自主學習計劃。
Thumbnail
2025/06/09
我前幾篇文章分享了ChatGPT、Grok和Gemini的深入研究功能,這篇文章則接續分享如何用Perplexity的深入研究功能,針對高中的彈性學習時間,設計出主題為「運用天文研究觀測資料進行藝術創作」的跨領域自主學習計劃。
Thumbnail
2025/06/05
我在前兩篇文章分享了ChatGPT和Grok的深入研究功能,這篇文章則接續分享如何用Gemini的深入研究功能,設計一個《龍與地下城》風格的科學教育遊戲,讓玩家能認識韋伯太空望遠鏡的最新研究成果,例如目前發現最遙遠的古老星系MoM-z14。
Thumbnail
2025/06/05
我在前兩篇文章分享了ChatGPT和Grok的深入研究功能,這篇文章則接續分享如何用Gemini的深入研究功能,設計一個《龍與地下城》風格的科學教育遊戲,讓玩家能認識韋伯太空望遠鏡的最新研究成果,例如目前發現最遙遠的古老星系MoM-z14。
Thumbnail
看更多
你可能也想看
Thumbnail
2025 vocus 推出最受矚目的活動之一——《開箱你的美好生活》,我們跟著創作者一起「開箱」各種故事、景點、餐廳、超值好物⋯⋯甚至那些讓人會心一笑的生活小廢物;這次活動不僅送出了許多獎勵,也反映了「內容有價」——創作不只是分享、紀錄,也能用各種不同形式變現、帶來實際收入。
Thumbnail
2025 vocus 推出最受矚目的活動之一——《開箱你的美好生活》,我們跟著創作者一起「開箱」各種故事、景點、餐廳、超值好物⋯⋯甚至那些讓人會心一笑的生活小廢物;這次活動不僅送出了許多獎勵,也反映了「內容有價」——創作不只是分享、紀錄,也能用各種不同形式變現、帶來實際收入。
Thumbnail
嗨!歡迎來到 vocus vocus 方格子是台灣最大的內容創作與知識變現平台,並且計畫持續拓展東南亞等等國際市場。我們致力於打造讓創作者能夠自由發表、累積影響力並獲得實質收益的創作生態圈!「創作至上」是我們的核心價值,我們致力於透過平台功能與服務,賦予創作者更多的可能。 vocus 平台匯聚了
Thumbnail
嗨!歡迎來到 vocus vocus 方格子是台灣最大的內容創作與知識變現平台,並且計畫持續拓展東南亞等等國際市場。我們致力於打造讓創作者能夠自由發表、累積影響力並獲得實質收益的創作生態圈!「創作至上」是我們的核心價值,我們致力於透過平台功能與服務,賦予創作者更多的可能。 vocus 平台匯聚了
Thumbnail
喜歡的話,可以拿去當手機桌面,我不介意。要拿去當素材也無妨,不要直接拿去販售就好了,雖然我有用AI繪圖,但好歹也花了不少時間在修圖。
Thumbnail
喜歡的話,可以拿去當手機桌面,我不介意。要拿去當素材也無妨,不要直接拿去販售就好了,雖然我有用AI繪圖,但好歹也花了不少時間在修圖。
Thumbnail
這篇文章介紹了使用UE4製作遊戲的練習和免費資源,包括素材連結和對話系統外掛。同時也提到了Unreal遊戲引擎的每月限免素材和線上學習資源,以及Epic Game Store遊戲平臺的優惠和缺點。
Thumbnail
這篇文章介紹了使用UE4製作遊戲的練習和免費資源,包括素材連結和對話系統外掛。同時也提到了Unreal遊戲引擎的每月限免素材和線上學習資源,以及Epic Game Store遊戲平臺的優惠和缺點。
Thumbnail
一個獨立開發者,立志打造顛覆性的遊戲體驗,在開拓全新玩法的道路上,砥礪前行。 大家好,我正在開發一款獨立遊戲,以魔法戰鬥為主題,如果想要嘗試遊戲的demo,歡迎到下方連結處,加入我的Discord群組。 魔法與戰鬥的世界---開發中的遊戲   這款遊戲發生在一個飄浮於雲端之上的世界,
Thumbnail
一個獨立開發者,立志打造顛覆性的遊戲體驗,在開拓全新玩法的道路上,砥礪前行。 大家好,我正在開發一款獨立遊戲,以魔法戰鬥為主題,如果想要嘗試遊戲的demo,歡迎到下方連結處,加入我的Discord群組。 魔法與戰鬥的世界---開發中的遊戲   這款遊戲發生在一個飄浮於雲端之上的世界,
Thumbnail
透過玩桌遊的方式學習AI生成圖像技巧,在充滿樂趣的活動中,學會如何操作工具及生成圖像技巧。這款遊戲預計下個月將開設實體課程,適合所有對AI有興趣的人、AI繪圖新手及藝術愛好者。
Thumbnail
透過玩桌遊的方式學習AI生成圖像技巧,在充滿樂趣的活動中,學會如何操作工具及生成圖像技巧。這款遊戲預計下個月將開設實體課程,適合所有對AI有興趣的人、AI繪圖新手及藝術愛好者。
Thumbnail
其實有很多下載版的實用工具,免費的付費的我都有,但就懶得安裝懶得開,還是喜歡線上直接使用……
Thumbnail
其實有很多下載版的實用工具,免費的付費的我都有,但就懶得安裝懶得開,還是喜歡線上直接使用……
Thumbnail
學完基礎的Lua語法後,今天開始製作第一個遊戲畫面了!
Thumbnail
學完基礎的Lua語法後,今天開始製作第一個遊戲畫面了!
Thumbnail
天網快速地進行了模擬和設計,數分鐘後,屏幕上出現了一個簡單而精美的遊戲介面。 天網:「初步設計已經完成。這個APP看起來是一個普通的益智遊戲,使用者可以在遊戲過程中觸發隱藏的安全報警功能。所有報警信號會立即發送到天網系統,並通知你和相關機構。你可以試用一下,看看是否符合你的要求。」
Thumbnail
天網快速地進行了模擬和設計,數分鐘後,屏幕上出現了一個簡單而精美的遊戲介面。 天網:「初步設計已經完成。這個APP看起來是一個普通的益智遊戲,使用者可以在遊戲過程中觸發隱藏的安全報警功能。所有報警信號會立即發送到天網系統,並通知你和相關機構。你可以試用一下,看看是否符合你的要求。」
Thumbnail
這篇文章分享了一個線上桌遊的新創意,結合了線上課程與遊戲的元素,以促進學習與擴大人脈。作者希望透過遊戲的體驗來教導漏斗、直效行銷的知識,並提供了免費試玩的名額,期待收集更多的回饋意見。
Thumbnail
這篇文章分享了一個線上桌遊的新創意,結合了線上課程與遊戲的元素,以促進學習與擴大人脈。作者希望透過遊戲的體驗來教導漏斗、直效行銷的知識,並提供了免費試玩的名額,期待收集更多的回饋意見。
Thumbnail
今天參考臉書上一些高手的作品,練習幾款水晶球造型的圖片發想: 覺得把景物、人物透過ai繪圖,裝在水晶球裡呈現,感覺好療癒喔。
Thumbnail
今天參考臉書上一些高手的作品,練習幾款水晶球造型的圖片發想: 覺得把景物、人物透過ai繪圖,裝在水晶球裡呈現,感覺好療癒喔。
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News