第2天。我想做一些令人怀念的东西。
提示词#
我使用了这个:
“构建一个诺基亚3310风格的贪吃蛇游戏。LCD绿色屏幕、像素方块,完整呈现。把它放在一个手机外壳里。”
这基本上就是全部的要求。我脑海中有一个清晰的视觉形象,但没有给出任何实现细节。
构建过程#
Watchfire 接收了这个提示词,并将其分解为涵盖游戏引擎、诺基亚视觉风格、音效、移动端控制和手机外壳UI的任务。游戏逻辑、LCD渲染、七段式分数显示——所有这些都来自那一个提示词。
我没有坐在那里指导每一个决策。我描述了我想要的感觉,然后回来时已经有了一个可以玩的游戏。
我得到了什么#
这个让我惊讶于它在美学上走了多远。

它构建了一整部手机。 不只是一个游戏画布。一个完整的诺基亚3310外壳,带有扬声器格栅、NOKIA品牌标识、方向键、功能按钮和带有深度感的屏幕边框。手机机身有渐变和阴影,使其看起来是三维的。我要求一个手机外壳,却得到了一部手机。

LCD屏幕非常真实。 经典的诺基亚绿色(#9bbc0f,如果你好奇的话),带有可见的像素网格、扫描线叠加层和屏幕角落的眩光效果。网格上的每个单元格都有细微的间隙来模拟真实的LCD段。蛇头甚至有小小的像素眼睛。
它有七段式分数显示。 不只是屏幕上的一个数字。一个实际的SVG渲染七段式LCD显示屏,位于游戏屏幕外部,就像手机上的副屏。分数和最高分都以适当的非激活段幽灵效果渲染。

食物会脉动。 食物方块上有正弦波动画,使其轻轻跳动。蛇每次吃东西都会加速。起始速度为每帧150毫秒,逐步降低到最低50毫秒。难度曲线内置于游戏循环中,而非按关卡硬编码。
复古音效。 通过Web Audio API生成的方波振荡器声音。开始时的上升音调,吃东西时的欢快叽叽声,游戏结束时的下降悲伤音调。所有声音在运行时合成,不需要任何音频文件。它甚至会将你的静音偏好保存到localStorage。

最高分持久化。 它将你的最佳分数保存到localStorage,并在你打破记录时显示带有脉冲动画的"NEW HIGH SCORE!“消息。游戏结束界面有一个由CSS网格构建的像素艺术骷髅图标。
移动端控制。 在触摸设备上,它会渲染一个带有中央暂停按钮的方向键。在桌面端,它显示与手机美学相匹配的装饰性按钮。它会检测设备类型并适配。还有滑动控制作为备用方案。
可切换的手机外壳。 你可以在完整的诺基亚手机外壳和只有游戏屏幕的简约视图之间切换。偏好设置保存在localStorage中。
数据统计#
- 8个源模块(GameBoard、StartScreen、GameOverScreen、PauseOverlay、ScoreDisplay、useSnakeGame、useSound,以及页面布局)
- 约2,100行TypeScript和React代码
- 零外部游戏库(仅Next.js和React,游戏逻辑全部是自定义hooks和Canvas)
- 5个合成音效通过Web Audio API
- 实际操作时间: 大概20分钟的游玩和调整提示词
试试看#
方向键或WASD移动,空格键暂停。在移动端支持方向键控制。
第2天总结#
我要求在诺基亚外壳里做一个贪吃蛇游戏。我得到的是一个完整的手机模拟器,带有合成音频、七段式显示屏、LCD扫描线效果,以及分数、音效偏好和外壳可见性的localStorage持久化。
令人印象深刻的是有多少工作投入到了我从未要求的细节中。屏幕眩光。扬声器格栅圆点。食物上的脉冲动画。游戏结束界面上的像素艺术骷髅。这些都是手工实现需要数小时的精致决策,却免费出现了。
我自己能构建贪吃蛇吗?也许可以,只要给足够的时间。但我会在网格上做一个绿色方块加上分数计数器。我不会构建一个带有合成芯片音乐和响应式移动控制的诺基亚3310模拟器。我会构建的东西和我得到的东西之间的差距,正是这个挑战的意义所在。
两天下来,两款游戏已发布。第1天的规律延续下来:起点不再是一个空白文件,终点也远超我独自努力所能达到的目标。
这是30天极速编程挑战的第2天。跟随我使用AI辅助编程在30天内发布30个项目。







