我用 AI 做了只猫咪布丁,没想到在微博获奖了

0 评论 110 浏览 0 收藏 16 分钟

作者用 AI 做了个能捏的猫咪布丁小作品,投到微博活动后拿了奖。文章给出三条做法:直接玩现成的、用开源仓库改成自己喜欢的样子,或者拿提示词从头做一个,并说明了为什么推荐 Astra。

我参加微博 VibeLab「用 AI 玩转 3D 世界」活动,获奖了。

名单里这个「月鹿造物」,就是我。下面左下角那只奶白色的小猫,也是我的作品,我在图上标出来了。

01 先给你看看这只猫

我做的是一个可以在网页上捏着玩的 3D 猫咪牛奶布丁。

按下去会凹,往旁边拖会变形,松手又弹起来,连小猫脸都跟着晃。牛奶、草莓、抹茶三种口味可以换,还有一把小勺子,能挖走一口。

我录了一段,直接看它动起来。

当时发微博,我写的是:本来在认真调试,结果变成了,再捏一下,再捏一下……怎么十分钟过去了。

手机上也能玩。我自己试的时候,用完勺子还想接着捏,结果没找到怎么切回去,连“复原”都得翻着找。于是又让 Codex 改了一轮,把“捏一捏”“小勺子”“复原猫咪”放在手机底部,一直能看见。

现在想捏就点手指图标,想挖一口就点勺子。玩变形了、挖缺了一块,点“复原猫咪”,补完整再接着捏。这张是我在手机上截的。

点“游戏方法 · 调调手感”,还能换颜色、调弹性。牛奶、草莓、抹茶做成了三个圆形色板,点哪个就换哪个。

这次我把做这只猫的代码也公开了,你可以直接下载、接着改。想做一个类似的小玩具,可以按下面三种做法试。想直接玩到同款,就从方法一开始。

02 方法一:让 AI 下载现成的,直接玩

PLAY IT FIRST

GitHub 是一个分享代码的网站。我的项目叫 lunaark/milk-meow-jelly,页面长这样。

项目名直接发给 AI 就行:lunaark/milk-meow-jelly。让它找到这只猫、下载到电脑,再帮你打开试玩,不用自己先找下载按钮。

我用的是 Codex,一个能帮你写代码、改文件的 AI 工具。你也可以试试 WorkBuddy、豆包办公、千问,要用能帮你下载文件、在电脑上动手操作的功能。不同版本能做的事不一样,普通聊天窗口可能只会告诉你步骤,还得自己照着操作。

我这次使用的模型是 GPT-6-astra。你也可以选它,聊想法用轻度,让它动手做、改代码时用中度。遇到反复修不好的问题,再调高一点,让它多想一会儿。

把项目名和下面这句话一起发过去:

请帮我找到 GitHub 上的 lunaark/milk-meow-jelly,这是月鹿的猫咪牛奶布丁项目。确认找对项目后,下载到一个新的文件夹,先看使用说明和允许怎么使用这些代码,再把运行需要的东西准备好。先保留原来的外观和手感,启动后帮我打开试玩。需要登录或操作权限时告诉我,不要覆盖我已有的文件。

等 AI 处理好,打开它给你的网址,就能捏了。中途如果出现看不懂的提示,截图发给它,说“这里打不开,帮我看看”,让它接着处理。

方法二:用这份代码,改成你喜欢的样子

能打开试玩以后,就可以接着改了。

我自己的猫咪也这么折腾过。最初做的是蓝色像素机器人,能压扁、拉长,但捏着像在拉贴纸。我不喜欢,让 Codex 重新看参考,换成了焦糖布丁。

那个布丁手感对了。我又试过猫咪团子,遇到过按了没反应、连续按几次就卡住的问题。来回改了一阵,还是回去选了布丁,再慢慢加猫脸和耳朵。

所以你拿到这份代码,可以先改外观,保留现有的回弹。比如想换成草莓奶冻,可以这样说:

我想把这只猫改成草莓奶冻。身体淡粉色,耳朵保留一点奶白,脸颊圆一些。请先保留一份当前版本,只调整外观,按下去、拖着玩和松手弹回来的效果都保留。小猫脸要跟着身体一起变形,改好后打开网页让我看看。

改完自己多捏几次。外观变可爱了,也要试一下按压有没有反应,拖到旁边再松手,会不会卡住。

我改猫脸的时候,嫌它头顶太平、五官太小,后来干脆让 AI 先画一张设计图。

这张我喜欢,就回复“可以喜欢,按照这个设计吧”,Codex 再照着图改网页。

如果你也觉得越改越不对,可以先停下来,把想要的样子画出来。至少先确认耳朵多大、脸多圆,省得每次打开网页都觉得差点意思。

方法三:拿提示词,从头做一个

想自己从头试,也可以让 AI 新建一个文件夹,把下面这份提示词发给 Codex。模型推荐 GPT-6-astra,思考强度用中度。

这是做完以后,根据成品和制作过程整理的。里面写了猫咪长什么样、怎么玩、按钮放哪里。整段复制给 AI 就行,也可以把颜色、造型换成自己喜欢的。

复制下面这段,发给 AI:

请在新建的文件夹里,制作一个可以直接在浏览器里玩的 3D 猫咪牛奶布丁,名称为 Milk & meow。

先做一块能按下去、拖着玩、松手弹回来的布丁,打开网页让我试试手感。确认后再继续添加猫咪造型和页面。

外观

猫咪是一块奶白色的牛奶布丁,身体矮胖圆润,脸颊饱满,底部自然接触桌面。顶部有两个短而柔软的猫耳,与身体连成一体。一侧耳朵附近有淡淡的焦糖色斑块。

眼睛是深棕色的椭圆,里面留一点小亮光。嘴巴简单一点,脸颊带一点淡淡的粉色。眼睛和嘴巴贴在身体上,捏的时候一起变形。看起来像细腻的牛奶布丁,表面有一点柔和的亮光。

手感

手指按在哪里,哪里就凹下去,旁边还是鼓鼓的。往外拖,那个地方会被拉长,身体也跟着晃。松手后弹回来,再晃几下慢慢停。

请做出能从不同角度看的立体猫咪,表面圆润光滑。捏住哪里就让哪里变形,别把整只猫一起简单地压扁、放大。拉长以后也要有布丁的厚实感,不能像一张薄纸。具体怎么写代码,由你选择合适的做法。

操作

电脑用鼠标拖,手机用手指拖。添加“按下去,再弹起来”“晃一晃”和“复原”按钮。两条可以左右拖动的调节条,分别叫“弹性”和“回弹收敛”:一条调软硬,一条调松手后晃多久。两项范围都用 0—100,默认弹性 65、回弹收敛 55。滑块加粗、拖动圆点放大,显示当前数值,并写清楚两端分别是什么手感。提供牛奶、草莓、抹茶配色,以及慢动作和暂停按钮。

基础手感确认后,再添加小勺子:压入后可以挖走真实的一小块,展示这一口被抬起的过程。挖过的地方要留下缺口,看起来仍然是一块实心布丁。点“复原猫咪”,就补回完整猫咪,恢复刚打开时的样子。

页面

使用暖灰、奶油白和焦糖棕,页面不要挤得太满。猫咪处于画面中心,光线柔和,猫咪底下有贴着桌面的影子。

左上角写“Milk & meow.”,分成两行,用像书里那样的英文字体,第二行的字斜一点。小字为“一口牛奶,一点喵。戳一下,快乐就晃起来。”

电脑版右侧放一块圆角操作面板,标题为“今日份软甜”。手机版缩小左上角标题,把详细控制面板放到场景下方,页面可以自然滚动,提供“游戏方法 · 调调手感”入口。

手机底部一直显示“捏一捏”“小勺子”“复原猫咪”三个按钮,分别配手指、勺子和复原图标,同时保留短文字。正在用的按钮换个颜色,提示怎么操作。用完勺子可以直接切回捏捏,复原后补回完整猫咪并切回捏捏模式。从下方面板选择玩法后,回到猫咪画面。底部按钮要避开手机最下面的系统横条,不挡住猫咪,也别盖住页面最后的内容。

手机玩法区域叫“游戏方法”,牛奶、草莓、抹茶用横排圆形色板选择,保留名称,选中时显示外圈和勾。按钮和说明都用中文。

做好以后

请直接把它做出来,打开网页让我玩,并告诉我下次怎么打开。自己先试试按、拖、松手、连续捏几次、换颜色、暂停和复原。手机端专门走一遍“用勺子挖一口 → 切回捏一捏 → 复原猫咪”,确认按钮好找、当前玩法清楚。

多捏几次也不能卡住,猫咪不能突然散开、变成尖刺或者掉到桌面下面。手指离开屏幕、切去别的页面再回来,也不能一直卡在捏住的状态。电脑和手机都打开看看,确认按钮能点、文字看得清。请把代码检查好再给我。

如果网页打不开,要告诉我原因和怎么处理。试好以后,再告诉我怎么让别人也能打开玩,需要我登录账号时提醒我。

从空文件夹开始,每次做出来的造型和手感可能不一样。先打开网页试,哪里不喜欢,再接着说

比如“没有 Q 弹的感觉”,可以再补一句:

按到的位置先凹下去,旁边鼓一点。松手后弹回来,再晃几下慢慢停。现在这版像整只猫一起变扁,请检查一下。

我当时也没一口气写出什么完整要求。更多时候,是它做出来,我一看,不对,再改。想快一点拿到同款,直接拿现成的代码,会省掉不少来回调整。

做好以后,直接跟 AI 说“帮我上线,给我一个能分享的网址”,就可以发给别人玩了。

最初的灵感来自 Scott(@scottstts)的果冻演示。感谢作者的分享,才有了后面这只猫。相关来源也都放在 GitHub 项目说明里。

想找同款,GitHub 搜索 lunaark / milk-meow-jelly,试玩和下载都在里面。

05 为什么我推荐 GPT-6-astra

还有个事,前面推荐 GPT-6-astra,是因为我这次就是用它做的,也来回改到了自己愿意留下来的效果。聊想法时用轻度,让它动手做、改代码时用中度,可以从这个设置试起。

我当时在 X 上还录了两段演示。先看 Scott 发的 Astra 果冻,按住一个地方往外拉,身体会跟着变形,松手以后又晃回来。我想要的就是这种软软的、能捏起来的感觉。

另一段来自 @ekibuilds 的帖子,帖子里提到了 Fable 5.1。这段录屏里也有一块红色果冻,但录下来的部分没有展示出前面那种大幅拉伸的效果。

这两段是别人发布的演示。我没拿到它们完整的提示词,也不知道各自改过几轮,所以这里只放我看到的效果,不把它当成一次严格的模型测评。

但我想说的是,照着做却没做出同样的效果,先别急着觉得是自己不会用。 模型能不能把“按下去、弹回来”做好、听不听得懂你说哪里不对,会影响结果。换了模型,效果也可能差很多。

如果你用其他模型,包括国产模型,反复改还是达不到想要的手感,可以换 GPT-6-astra 试试,或者直接拿我的开源项目接着改。不用一直跟同一段提示词较劲

作者:月鹿造物 公众号:月鹿造物

本文由 @月鹿造物 原创发布于人人都是产品经理。未经作者许可,禁止转载

题图来自 Unsplash,基于CC0协议

更多精彩内容,请关注人人都是产品经理微信公众号或下载App
海报
评论
评论请登录
  1. 目前还没评论,等你发挥!