基础篇
进阶篇
高频篇
精选篇
手写篇
面经篇
AI 篇
原理篇
每日一题
小程序题库
  • 知识卡片碎片时间过考点
  • 场景篇按分类整理的大前端场景考点
  • 历年面经按年份追踪真实考点
  • 算法题库NEW在线编码即时判题
  • 专项自测100 题快速查漏
  • 前端基础
    • HTTP从报文一路讲到 HTTPS
    • 浏览器渲染、事件循环、进程
    • 计算机基础Linux、网络、操作系统
  • 进阶专项
    • 设计模式23 种模式怎么用
    • 前端系统进阶学习大型项目工程化
    • 前端综合文章长期沉淀的实践文
  • 工程与工具
    • Node学习指南从环境搭建到服务端
    • NPM工作流script、依赖与发布
    • Docker容器化部署上手
    • Canvas图形与动画实战
  • 路线与导图
    • 思维导图知识点全景图
    • 学习路线按图索骥不跑偏
  • 动态
    • 公众号动态公众号历史文章
    • 博客动态站长的技术博客
    • 开发者导航常用工具与文档站
    • AI 热点每日 AI 资讯与动向
AI 工作台
旧版
AIHT
内容
精选全部 AI 动态热点榜AI 日报收藏
分类
模型行业编程产品技术观点开源
更多
Agent 接入
返回首页开发者导航
AIHT
精选 / 资讯详情
9.0
重磅
AI SCORE
模型发布2026-08-07 23:00

Claude Fable 5单次会话从推文构建可玩3D游戏

dev.to · AI#Claude#AI编程#案例
Editor brief · 编辑速览

Simon Willison用Claude Fable 5基于一条四年前的GPT-3推文(含文字+DALL-E图)在单次会话中完成了完整3D游戏,包含Three.js实现、纹理生成和GitHub Pages部署。

文章思维导图
Knowledge map
拖拽缩放
Full translation

完整中文译文

Simon Willison 把一条四年前的推文变成了一款可运行的 3D 游戏,整个过程只用了一个 Claude Fable 5 会话。提示词里放了两张图片和几行指令,没有其他设计决策。模型把整个游戏搭了出来。

2022 年 8 月的那条原始推文包含一段 GPT-3 的文本补全,描述了一款叫"Raccoon Heist"(浣熊盗窃)的游戏——浣熊团队执行大胆的抢劫行动,还附带一张 DALL-E 生成的截图,呈现这款游戏可能的样子。四年后,Willison 把两者都喂给了在 Claude Code for web 中运行的 Claude Fable 5。模型写出了游戏代码,通过 OpenAI 的 gpt-image-2 API 生成纹理,并提交到了一个 GitHub Pages 仓库。最终产物是一个可玩的 3D 浏览器游戏,托管在 simonw.github.io/raccoon-heist。

A pixel-art inspired night scene: two raccoons in masks sneak toward a bank under a crescent moon, one carrying a bag of loot. City buildings with lit windows line the street. The hero image for a blog post about AI building a game.

Claude Fable 5 是怎么只用一条推文就搭出游戏的?

Willison 在手机备忘录里写了提示词。没有指定技术栈。他只告诉 Fable:要为浏览器构建,要适配移动端,用 OpenAI 处理纹理,独立工作,并且频繁提交以便他能预览结果。模型自行选择了 Three.js,生成了浣熊主题的图像纹理,搭出了一个等距视角的 3D 街道和待抢劫的银行。

Willison 写的那篇文章里最有借鉴价值的技巧是工作流。他把 GitHub Pages 配置成从 Claude Code 分支部署,这意味着每次推送后 30 秒内就能拿到一个线上 URL。这种"写完就预览"的循环,把一个试探性的实验变成了像在和游戏设计师结对编程的体验。

为什么这不只是个花活?

一个模型能从"给你一张截图加概念提示词"直接到"给你一个可玩的游戏,不需要再问任何问题",说明它已经过了玩票阶段。Fable 5 是一个会做设计决策、自选技术栈、把图像生成当作子程序调用、不经批准就推送到生产环境的编程模型。浣熊游戏确实是个玩具,但这个范式是真实存在的:给模型一个目标、一些素材、一个部署目标,它就能交付。

我昨天写了一篇文章讲编程模型这一年走了多远,而 Fable 5 一次性构建游戏的能力比任何基准分数都有说服力。SWE-bench 95% 是一个抽象的数字,看它怎么从一条四年前的推文和一个 SVG 提示词搭出一个浣熊盗窃游戏,才是具体的证明。

常见问题

Claude Fable 5 是从零开始构建游戏的吗?

是的。Willison 只给了它一个提示词和两张图片。没有 starter code,没有框架提示。Fable 5 自己选择了 Three.js,通过 OpenAI 生成纹理,在一次会话中构建了完整游戏,且在整个过程中没有就任何设计决策提问求证。

我能玩这个 Raccoon Heist 游戏吗?

能。游戏已上线:simonw.github.io/raccoon-heist。源码在 GitHub:github.com/simonw/raccoon-heist。

2022 年的原始推文是什么?

那条推文结合了一段 GPT-3 文本补全(描述了一款浣熊主题的抢劫游戏)和一张 DALL-E 生成的截图。Willison 用它作为 Fable 5 的创意简报,同时提供了文字概念和视觉参考。

Willison 在 Fable 构建游戏时是怎么测试的?

他把 GitHub Pages 配置成从 Claude Code 分支部署。每次 Fable 提交并推送后,游戏在 30 秒内就能通过一个公开 URL 访问。这让他可以在不打断模型工作流的情况下增量预览进展。

这套方法能用来构建真实应用吗?

同样的模式——提示词加素材加部署目标——已经被用于原型和小应用了。局限在于复杂度:复杂的多服务应用仍然需要模型无法独自做出的架构决策。但对于单页应用、工具和游戏,门槛已经大幅降低了。

Original source

本文由 AI 翻译整理,来源 dev.to · AI,原文版权归原作者所有。

阅读原文
上一篇
别再往ChatGPT扔错误堆栈了
下一篇
让AI Agent拥有支付能力:x402协议实战

资讯速览

dev.to · AI · 2026-08-07 23:00

AI 评分 9.0 / 10

相关标签

#Claude#AI编程#案例

继续阅读

  • GitHub Code Quality 不再自动为 PR 添加 Copilot 审阅者
  • 别再往ChatGPT扔错误堆栈了
  • 让AI Agent拥有支付能力:x402协议实战
  • AI Agent工具优化:让Agent能安全调用你的工具
  • 用 Python + AI 自动化播客元数据流水线