首页 AI开发编程 AI应用实践:不会编程如何使用ChatGPT开发H5游戏?

AI应用实践:不会编程如何使用ChatGPT开发H5游戏?

标题:AI应用实践:不懂编程,如何用ChatGPT开发H5小游戏?

大家都知道人工智能现在很强大,可以帮助我们完成很多事情。有些人甚至使用ChatGPT来编写自己的APP。换句话说,如果用AI来开发游戏,应该如何实现?

前几天,我使用ChatGPT的GPT-4o开发了一款H5小游戏《龙舟抓粽子大赛》。

从技术实现上来说,这个游戏只是一个静态页面。对于程序员来说实现起来非常容易,但是对于不会写代码的产品经理来说还是非常困难。

说实话,作为一名产品经理,我对编程了解不多。自己+AI一天之内推出一款H5小游戏,还是蛮有成就感的。

在AI时代,有创意、有想法的产品经理可以利用AI快速开发产品demo,进行市场验证。

今天我就做一下回顾,分享一下如何使用ChatGPT来开发H5游戏?

内容很多。相信看完之后,你能够更好地理解制作一个产品的整个流程,以及如何利用AI来辅助各个环节的工作。 (文末附有AI工具清单)

做一个产品,除了想法之外,还必须明确需求细节、功能流程、逻辑规则、界面UI等。开发完成后,必须通过测试,才能上线。

因此,我把这个游戏当作一个小产品,包括这5个环节:需求、设计、开发、测试和发布。

在这个过程中,AI扮演了产品程序员、设计师、产品经理导师的角色,和我们一起共同完成任务。

你看,开发一个看似简单的游戏,也是在制作一个完整的产品,积累实践经验。

01 在需求流程开始的时候,我并不确定自己想要制作什么游戏。我只有一个模糊的想法,更谈不上需求。于是,我先聊了GPT,它给出了两个很好的解决方案,并且直接生成了代码。

上下滚动查看更多内容。但是,我不知道如何运行它。不断询问,让它教我如何操作。

果然在电脑上运行成功了,效果好吗?

不得不感叹GPT代码能力真是强大,完全可以用GPT来开发H5游戏。

验证了技术可行性后,我需要明确我的需求。我宁愿制作一款与赛龙舟有关的游戏。我问GPT,可以用HTML直接生成赛龙舟游戏吗? (为了让它能帮助我更好地工作,我需要多夸奖它)

都是我作为产品经理的错,没有把需求说清楚,所以只能要求再改。

新版本出来了,我尝试了一段时间。效果还不错。然而,障碍太多,难度太大。用户可能无法继续游戏。

于是,我进一步请求GPT给出优化建议。

没想到,它给出了几个靠谱的改进方向后,立马秒改了新代码。

经过多轮讨论和试玩,需求基本明确。让GPT根据我们的对话总结一下游戏规则和逻辑,然后我去检查和补充。

上下滚动查看更多内容。考虑到端午节期间发布,时间比较紧,按照MVP(最小可行产品)的思路,暂时不做复杂的功能和数据统计,只做核心功能将被实施。至此,这款游戏的功能需求就基本明确了,剩下的就比较简单了。

你注意到了吗?

在需求环节,尤其是“需求不明确”或者“不知道选择哪种解决方案”时,AI发挥着巨大的作用。它可以帮助我们理清思路,明确需求,分析解决方案的利弊,帮助我们做出决策。计划实施了,让我们体验一下、比较一下。

02 在设计过程中,产品经理通常会拿产品原型并与设计师进行沟通。设计师了解需求后,进行UI设计。

由于界面简单,需要的UI较少,所以我直接使用GPT的DALL.E来设计(Buoy在网上找到的)。

我最好先让GPT给我建议。它的答案非常好,但是它生成的图片有点尴尬,不太符合我的期望。我只能调整提示词,最终选择了自己比较满意的方案。

有了素材后,使用AI剪切工具“魔笔”对图像进行剪切,去除背景,并使用PS合成图像。看看结果如何?

游戏有UI皮肤和背景音乐,玩起来感觉很好。

像往常一样,先让GPT给出建议,然后使用最近流行的Suno AI生成背景音乐,并从网上下载常见的吃金币和游戏结束音效。

03 开发环节看到这里,你可能会发现开发变得更简单、更高效了。因为在整个通信过程中,GPT一直在输出可以立即验证的代码。它确实比敏捷开发更敏捷。为了让它先和我讨论需求,我得具体告诉它,不要输出代码,输出代码后再告诉它。

当然,编写AI代码时也会存在Bug。这也是整个开发过程中最耗时的部分,——测试。

04 测试环节测试非常耗时。产品经理需要模拟用户的实际使用场景,不断使用产品,看看是否有bug。

这期间,GPT其实遇到了一个bug,我们也为此苦苦挣扎了很长时间。

游戏本来运行得很好,但我要求它调整龙舟和粽子图像尺寸的计算方法。新版本运行时不显示粽子。

我向GPT反馈,它添加了调试信息,告诉我读取浏览器控制台中的日志,并将日志反馈给它。

我调试好之后,直接截图发给他。它发现了问题,又开始疯狂输出代码。不幸的是,事情仍然没有解决。

考虑到时间紧张,我果断要求它用另一种方式计算图像大小,bug就消失了。

所以,当你遇到问题的时候,有时候你要从另一个角度去想解决办法。也许如果换一种方法,原来的问题就不再存在了。

05 在实际工作中的发布过程中,开发同事通常会部署并发布产品。我没有研究过部署,所以只能问GPT,推荐Github。

我首先将代码上传到Github并生成页面链接。确实是免费又方便。但是国内访问Github的速度太慢而且不稳定。

经过大量研究和比较几个云平台,我选择了腾讯云。

最后,我自己完成了产品从构思到部署的全部工作。

06 总结最后,我们做一下总结。

首先,这个项目并不是要做一个很多人都用的很酷的游戏,而是验证一个不会编程的人在AI的辅助下独立开发一个产品的可能性。

从产品角度来看,这款游戏还有很大的改进空间。比如添加微信好友排名、添加数据点完善统计等。

通过这种实践,您在将来开发其他产品演示时可以更有经验、更有效率。

其次,GPT确实是一个非常强大和耐心的伙伴,可以配合我的想法,提出建议和优化方向,并且可以随时快速生成代码来帮助我验证我的想法。

例如,当测试过程中发现错误时,AI 不会表现出任何情绪。它一次又一次地根据我的调试反馈来解决问题并修改代码。

第三,这样的实践还可以锻炼我们产品经理各个环节所需要的能力。

比如在需求环节,与GPT讨论需求,就像与业务方沟通需求、与程序员讨论技术可行性一样。它锻炼了我们思考、沟通和表达需求的能力。

再比如,在开发过程中,将问题和调试结果反馈给GPT就像是和开发者沟通遇到的问题,锻炼了我们沟通、协作、处理问题的能力。

我希望你学到一些东西并且玩得开心!

工具清单:

1. 代码开发、UI设计、问答:ChatGPT

网址:https://chatgpt.com/

2.游戏音乐生成:Suno AI

网址:https://suno.com/

3.图像合成:在线PS定型

网址:https://ps.gaoding.com/#/

4.AI抠图:魔笔

网址:https://www.remove.bg/zh/

5.代码仓库:Github

网址:https://github.com/

6.云服务器:腾讯云

网址:https://cloud.tencent.com/

本文作者人人都是产品经理【四月产品经理】,微信公众号:【四月产品经理】,原创/授权发布于人人都是产品经理。未经许可禁止转载。

标题图片来自Unsplash,并获得CC0 许可。

热门文章