GPT-4+Midjourney零代码做「愤怒的南瓜」！实测体验：门槛不低，很难复现

　　本文来自于微信公众号新智元(ID:AI_era)，作者:新智元。

　　【新智元导读】国外网友分享了一个只用AI工具制作游戏的教程，在外网爆火。但亲自尝试之后发现，真的想要做出像样的游戏，远远没有想想那么简单。

　　通过市面上的AI工具，不需要自己亲自写一行代码，就能做出一个完整的「愤怒的小鸟」?!

　　最近，外国网友分享了自己花了10个小时，通过GPT-4和DALL-E3/Midjourney做了个愤怒的小鸟的教程，3天之内已经超过了270万的浏览。

　　还曾登顶Hacker News!

　　按照他说的方法，从游戏素材生成，到游戏核心代码的编写，都使用AI工具完成。

　　虽然只有一关，但是从效果来看已经完全可以流畅游玩，而且美术风格非常成熟，完全get到了《愤怒的小鸟》的玩法和爽点。

　　教程作者在跑完整个过程后感叹到:

　　我真的被震撼到了。老实说，我从来没想过这一切真的就这么发生了。我坚信我们正生活在一个迄今为止只在科幻电影中看到的历史时刻中。

　　这个全新的工作流程，让我们可以仅使用自然语言就能创建任何东西，将改变我们所知道的世界。

　　这是一场如此巨大的浪潮，那些没有预见到它到来的人将受到沉重打击。

　　网友纷纷感叹，离了大谱!这是我见过最酷炫的ChatGPT用例。

　　也许我们离这样的场景已经不远了:

　　只要想想一个游戏的玩法，直接和AI智能体沟通，然后它就能给你做出来。这个应用实在是太疯狂了。

　　作者最后补充到，他前后制作这个小游戏大概花了10个小时的时间。核心框架花了两个小时就弄出来了。

　　后边的时间主要是调整各种细节和处理小问题。

　　然而我们自己上手试了一下之后，发现，好像还真不是那么回事。

　　用AI几句话就能做游戏?远没有想象的那么简单

　　教程作者写的不复杂，整个过程就两个部分。图像素材

　　这部分是最简单的，毕竟文生图工具已经面世一年多了，大家应该早就熟练掌握了用AI生图的技术要领了(抄提示词)。

　　首先是用提示词制作一张背景图，作者用DALL·E3制作的这张开始界面图。

　　Photo of a horizontal vibrant home screen for a video game titled 'Angry Pumpkins'. The design is inspired by the 'Angry Birds' game aesthetic but different. Halloween elements like haunted houses， gravestones， and bats dominate the background. The game logo is prominently displayed at the center-top， with stylized pumpkin characters looking angry and ready for action on either side. A 'Play' button is located at the bottom center， surrounded by eerie mist.

　　提示词翻译过来之后，就是一段对于图片内容的详细描述。

　　一张名为「愤怒的南瓜」的视频游戏的横向充满活力的主屏幕的照片。该设计的灵感来自于「愤怒的小鸟」游戏的美学，但有所不同。鬼屋、墓碑和蝙蝠等万圣节元素占据了背景。游戏徽标醒目地显示在顶部中心，风格化的南瓜角色看起来很愤怒，并准备在两侧采取行动。「PLAY」按钮位于底部中心，周围环绕着怪异的薄雾。

　　但是注意，必须要用英文的提示词，中文只能帮助大家理解。

　　然后用Midjourney制作了两张游戏背景图。

　　除了提示词之外，还使用了「外画(outpainting)」按钮。

　　Angrybirds skyline in iPhone screenshot， Halloween Edition， graveyard， in the style of light aquamarine and orange， neo-traditionalist， kerem beyit， earthworks， wood， Xbox360graphics， light pink and navy --ar8:5

　　「iPhone 截图中的愤怒的小鸟天际线，万圣节版，墓地，浅海蓝宝石和橙色风格，新传统主义，kerem beyit，土方工程，木材，Xbox360图形，浅粉色和海军蓝 --ar8:5」

　　2d platform， stone bricks， Halloween，2d video game terrain，2d platformer， Halloween scenario， similar to angry birds， metal slug Halloween， screenshot， in-game asset --ar8:5

　　「2d 平台、石砖、万圣节、2d 视频游戏地形、2d 平台游戏、万圣节场景、类似于愤怒的小鸟、合金弹头万圣节、屏幕截图、游戏内资产 --ar8:5」

　　Halloween pumpkin， in-game sprite but Halloween edition， simple sprite，2d， white background

　　「万圣节南瓜，游戏中的精灵，但万圣节版，简单的精灵，2d，白色背景」

　　「绿色万圣节怪物，愚蠢，有趣，游戏中的精灵，但万圣节版，简单的精灵，2d，白色背景」

　　Green Halloween monster， silly， amusing， in-game sprite but Halloween edition， simple sprite，2d， white background

　　除此之外，对于木箱，骨头等游戏素材，也就直接从Midjourney中生成。

　　代码部分

　　游戏的核心部分是600行的代码。

　　作者完全没有动手写任何一行代码，但是想要用GPT-4生成代码也是非常有挑战的任务，作者大部分的精力也是花在了这里。

　　作者添加了许多细节，例如不同的粒子效果、不同类型的对象等。

　　作者生成600行代码，几乎还是像开发者一样，从最基本的逻辑做起，一步一步提出更细节的要求。

　　作者也分享了他的初始的prompt:

　　Now， I ask you: do you know how the birds are launched in Angry Birds? Whatthe finger does on thescreen? Exactly. Add this to the game， using the mouse.

　　「我们现在可以使用 Matter.js 和 p5.js 以《愤怒的小鸟》的风格创建一个简单的游戏吗?只需使用鼠标以角度和力量发射一个球，然后用2D 物理击中一些堆叠的盒子即可。」

　　当代码出现问题时，用这个提示词向GPT-4提问:

　　I have this error， please， fix it: Uncaught ReferenceError: Constraint is not defined

　　我有这个错误，请修复它:Uncaught ReferenceError: Constraint is not defined

　　教程上手实测

　　老实说，对于这件事情，小编一开始是有些怀疑的。GPT-4V在发布之初，就向大众展示了自己做网页的能力。

　　用餐巾纸画草图喂给模型，直接生成出像模像样的网页——吃进去的是草，挤出来的是奶。

　　但是说到具体的游戏，就需要把静态的页面和动态的逻辑结合起来，GPT-4到底能否较好的完成愤怒的小鸟所需要的功能呢?

　　本着实事求是的原则，小编尝试为大家复现这个过程。

　　首先根据作者给出的提示范例，我们来考一考GPT-4，它竟然第一次就真的生成出了像模像样的代码:

　　GPT-4同时给出了html和js的代码，出人意料。

　　由于js的代码比较长，所以这里只截取展示一小部分，感兴趣的读者可在文章的最后找到GPT-4首次生成的程序。