🧱 这是什么
用 Hello Kitty 的方式打开《我的世界》:在一片粉樱森林里挖方块、砍树、合成工具,盖一间自己的小屋,顺手驯服几只凯蒂猫。整个游戏跑在浏览器里,点开就能玩,不用下载安装 —— 手机上也可以。
- 挖掘与建造:方块挖掘、掉落物拾取、合成台做工具、自由搭房子
- 粉樱世界:程序化地形 + 樱花树,昼夜与天空实时变化,风吹粒子飘
- 驯服凯蒂猫:小猫会跟着你走,喂它东西会有反应
- 该有的都有:背包与合成、暂停菜单、设置、玩法说明、存档、自定世界种子
Gallery
实机截图
标题界面、游玩中、背包与暂停菜单 —— 点开看大图。
Behind the scenes
技术细节
⚙️ 怎么做到的
- 体素世界:区块式地形生成 + 面剔除网格,只渲染看得见的面;远处按距离剔除,手机上也能跑
- 零外部素材:方块贴图在运行时拼成图集,音效由 Web Audio 现场合成 —— 整个构建产物 632 KB,没有一张图片文件
- 游戏系统分层:
core/(循环 / 输入 / 存档 / 设置 / 音频)、world/(地形 / 区块 / 方块表)、entities/(玩家 / 生物 / 掉落物 / 手部与物理)、ui/(HUD / 背包 / 像素字体)、fx/(天空 / 粒子) - 像素级 UI:自绘像素字体与图标,配色统一走凯蒂粉,菜单、背包、设置全部手写
🐞 实机验收:三个致命 bug
这个项目最有意思的不是写完,而是「真打开跑一遍」—— 第一次实机验收就炸出三个致命问题,全部定位并修掉:
- UI 点不动:界面层与画布的事件穿透 / 层级问题,按钮收不到点击
- 世界全黑:法线与材质配置不对,进世界一片黑
- 跳跃失效:移动与重力判定顺序错,按了跳不起来
验收方式也写成了脚本(tools/playtest.mjs):连上真实 Chrome、走一遍开局流程、逐屏截图存档 —— 以后每次改动都能自动回归。


