大家都知道AI現(xiàn)在功能強大，能幫我們完成很多事情，甚至有人用ChatGPT自己寫APP的都有。拿換個思路，如果用AI來開發(fā)一款游戲，應(yīng)該如何實現(xiàn)呢？

前幾天，我用 ChatGPT 的 GPT-4o 開發(fā)了一個 H5小游戲「龍舟接粽子大賽」。

從技術(shù)實現(xiàn)上，這個游戲只是一個靜態(tài)頁面，對程序員來說，非常容易實現(xiàn)，但是，對不會寫代碼的產(chǎn)品經(jīng)理而言，還是很有難度的。

說實話，作為產(chǎn)品經(jīng)理，我不懂編程，一個人+ AI，1 天內(nèi)上線一個 H5小游戲，還是挺有成就感的。

在 AI 時代，產(chǎn)品經(jīng)理有創(chuàng)意、有想法，完全可以用 AI 快速開發(fā)產(chǎn)品 Demo，進行市場驗證。

今天做個復(fù)盤，分享下如何用 ChatGPT 開發(fā) H5小游戲？

內(nèi)容有點多，相信你看完，可以更好理解做一個產(chǎn)品的全過程，以及每個環(huán)節(jié)如何使用 AI 輔助工作。（文末附AI工具清單）

做一個產(chǎn)品，除了想法，還要明確需求細節(jié)、功能與流程、邏輯規(guī)則、界面UI等等，開發(fā)完了，還要通過測試，才能發(fā)布上線。

因此，我把這個游戲當(dāng)做小型產(chǎn)品來做，包括：需求、設(shè)計、開發(fā)、測試和發(fā)布，這 5 個環(huán)節(jié)。

這個過程，AI 扮演了產(chǎn)品的程序員、設(shè)計師，還有產(chǎn)品經(jīng)理導(dǎo)師，我們一起協(xié)作完成任務(wù)。

你看，開發(fā)一個看似簡單的小游戲，也是在做一個完整的產(chǎn)品，也能積累實踐經(jīng)驗。

01 需求環(huán)節(jié)

剛開始，我還不確定要做什么游戲，只有個模糊的想法，更別說需求。于是，我先跟 GPT 聊，它給出了兩個不錯的方案，還直接生成代碼。

上下滾動查看更多可是，我不懂運行呀，繼續(xù)問，讓它教我操作。

果然在電腦上成功運行，效果還行吧？

不得不感嘆 GPT 代碼能力真強大，完全可以用 GPT 來開發(fā) H5小游戲。

在驗證了技術(shù)可行性后，要明確需求，我更希望做跟賽龍舟有關(guān)的游戲，問 GPT ，賽龍舟的游戲能直接用html來生成嗎？（為了讓它更好地幫我干活，還得多夸夸它）

都怪我這個產(chǎn)品經(jīng)理，沒講清楚需求，只能讓它再改一次。

新版本出來，試玩了一會，效果還不錯，不過，障礙物太多，難度太大，用戶可能玩不下去。

于是，我得寸進尺，讓 GPT 給優(yōu)化建議。

沒想到，它給了幾個靠譜的改進方向后，又直接就秒改出新代碼。

經(jīng)過多輪討論和試玩后，需求基本明確，讓 GPT 根據(jù)我們的對話總結(jié)游戲規(guī)則和邏輯，我再檢查補充。

上下滾動查看更多考慮到要在端午節(jié)發(fā)布，時間比較緊，按照MVP（最小可行化產(chǎn)品）的思路，暫時不搞復(fù)雜功能和數(shù)據(jù)統(tǒng)計，只實現(xiàn)核心功能。至此，這個游戲的功能需求基本明確，后面就相對簡單了。

你發(fā)現(xiàn)沒？

在需求環(huán)節(jié)，尤其在「需求不明確」，或者「不知選哪個方案好」的情況下，AI 的作用巨大，它能幫我們理清思路、明確需求，還能分析方案的利弊，幫我們把方案實現(xiàn)出來，讓我們體驗和對比。

02 設(shè)計環(huán)節(jié)

這個環(huán)節(jié)，產(chǎn)品經(jīng)理通常要拿產(chǎn)品原型，跟設(shè)計師溝通，設(shè)計師理解需求后，設(shè)計UI。

由于界面簡單，需要的 UI 也少，我直接用 GPT 的 DALL.E 來設(shè)計（浮標在網(wǎng)上找的）。

還是先讓 GPT 給建議，它的回答很美好，生成的圖片卻有點尷尬，不太符合我的預(yù)期，只能調(diào)整提示詞，最后選了個人比較滿意方案。

有了素材，再用 AI 摳圖工具「魔力筆刷」摳圖，去掉背景，用 PS 合成圖片。看看這最終效果如何？

游戲有了 UI皮膚，還要有背景音樂，玩起來才有感覺。

照例先讓 GPT 給建議，然后，用最近很火的 Suno AI 生成背景音樂，在網(wǎng)上下載常見的吃金幣和游戲結(jié)束音效。

03 開發(fā)環(huán)節(jié)

看到這，你也許會發(fā)現(xiàn)，開發(fā)變簡單、高效了。因為整個溝通過程，GPT 一直在輸出代碼，可以立即驗證。真是比敏捷開發(fā)，還敏捷。為了讓它先跟我討論需求，還得專門告訴它，不用輸出代碼，等要輸出代碼再告訴它。

當(dāng)然，AI 寫代碼，也有會 bug，這也是整個開發(fā)過程中，我最花時間的環(huán)節(jié)——測試。

04 測試環(huán)節(jié)

測試是比較費時間的，產(chǎn)品經(jīng)理要模擬用戶實際的使用場景，不斷地用產(chǎn)品，看看有沒有 bug。

期間，GPT 還真遇到一個 bug ，我們折騰了好久。

本來游戲運行好好的，我讓它調(diào)整龍舟和粽子圖片尺寸的計算方式，新版本運行時沒顯示粽子。

我反饋給 GPT ，它自己就加了調(diào)試信息，告訴我在瀏覽器控制臺看日志，并把日志反饋給它。

我調(diào)試后，直接發(fā)截圖給它，它找到一個問題，又開始一頓瘋狂輸出代碼?？上В€是沒解決。

我考慮到時間較緊，果斷讓它換一種方式計算圖片尺寸，這個 bug 就沒了。

所以，遇到問題，有時得從其他角度想辦法，也許換一種方式，原來的問題就不存在了。

05 發(fā)布環(huán)節(jié)

實際工作中，通常由開發(fā)同事部署發(fā)布產(chǎn)品。我沒研究過部署，只能請教 GPT，它推薦了 Github。

我先把代碼上傳到 Github，生成頁面鏈接，確實免費又方便?？墒?，國內(nèi)訪問 Github 的速度實在太慢，而且不穩(wěn)定。

幾經(jīng)折騰研究，對比了好幾個云平臺后，選擇騰訊云。

終于，自己一個人完成了產(chǎn)品從構(gòu)思到部署上線的全部事情。

06 總結(jié)

最后，做點總結(jié)。

第一，這個項目不是要做一個很多人用的酷炫游戲，而是驗證一個人不懂編程在 AI 的協(xié)助下獨立開發(fā)一個產(chǎn)品的可能性。

從產(chǎn)品角度，這個游戲有很多地方可以完善。比如，加入微信好友排行榜、加數(shù)據(jù)埋點完善統(tǒng)計等等。

有了這次實踐，后續(xù)開發(fā)其他的產(chǎn)品 Demo，可以更有經(jīng)驗、更高效。

第二，GPT 真是一個非常強大、耐心的好搭檔，能配合我的想法，提出建議和優(yōu)化方向，還能隨時快速生成代碼，幫我驗證想法。

比如，測試中發(fā)現(xiàn) bug，AI 沒有任何情緒，一次又一次，根據(jù)我的調(diào)試反饋去排查問題，修改代碼。

第三，這樣的實踐，也可以鍛煉我們產(chǎn)品經(jīng)理在每個環(huán)節(jié)需要的能力。

比如，在需求環(huán)節(jié)，跟 GPT 討論需求，就像我們跟業(yè)務(wù)方溝通需求、跟程序員探討技術(shù)可行性，鍛煉了我們思考、溝通表達需求的能力。

又比如，在開發(fā)環(huán)節(jié)，跟 GPT 反饋問題和調(diào)試效果，就像跟開發(fā)溝通遇到的問題，鍛煉了我們溝通協(xié)作、處理問題的能力。

希望你有所收獲，玩的愉快哦！

工具清單：

1、代碼開發(fā)、UI設(shè)計、答疑：ChatGPT

網(wǎng)址：https://chatgpt.com/

2、游戲音樂生成：Suno AI

網(wǎng)址：https://suno.com/

3、圖片合成：稿定設(shè)計的在線 PS

網(wǎng)址：https://ps.gaoding.com/#/

4、AI 摳圖：魔力筆刷

網(wǎng)址：https://www.remove.bg/zh/

5、代碼倉庫：Github

網(wǎng)址：https://github.com/

6、云服務(wù)器：騰訊云

網(wǎng)址：https://cloud.tencent.com/