穗潮湾 Tidegrain Bay

面向抖音/H5 的陀螺仪 3DoF 全景轻经营原型——四场景一日回环（鸡舍·码头·果园·集市），定点观察 + 微操作 + 资源闭环。

HTML5 Three.js DeviceOrientation Vibe Coding

H5 Game Three.js Gyroscope

项目简介

《穗潮湾》（Tidegrain Bay）是一款 手机陀螺仪驱动的 3DoF 全景 H5 生活模拟原型，面向抖音小游戏 / 轻量 Cozy 经营方向探索。玩家不靠虚拟摇杆移动，而是通过 转动手机改变视角，在 360° 全景空间中完成「照料 → 观察 → 收获 → 交换」的一日回环。

世界观设定在一个靠海的小湾聚落：潮水退去后，鸡舍、码头、果园与夜市依次亮起。玩家扮演「把日子接起来的人」，在约 80 秒的单场景回合里完成轻劳动，再把收成带到集市兑现为金币与声望。

场景	英文名	核心任务	情绪关键词
暖穗鸡舍	WarmSheaf Coop	投喂、抚摸、拾蛋	安稳、亲近、照料
听潮码头	Tidewharf Dock	听音、抛竿、拉扯	专注、聆听、等待
风磨果园	Windmill Orchard	摇树、分拣、压榨	丰盛、判断、整理
暮灯集市	Dusklantern Market	浏览、交付、变现	热闹、兑现、回响

每个场景共享同一套交互范式：准星瞄准锚点 → 点击确认 → 体力消耗 → 任务进度与粒子反馈 → 结算评级。场景间通过订单系统（如「海风拼盘」「果篮补货」）形成资源链，避免四个玩法彼此孤立。

定点观察（Node-based 360°）：Three.js 全景背板 + 场景专属 FOV / 雾效；移动端默认陀螺仪视角，桌面端拖拽补正，进入场景自动回中。
瞄准辅助：悬停进入/退出角度、边缘箭头指引、静止超时弱/强提示，降低「找不到目标」的挫败感。
鸡舍回合（已实现最完整）：从料斗取干草、填充食槽、抚摸小鸡、拾取鸡蛋；S/A/B/C/D 评级与好感、蛋品质概率挂钩。
跨场景进度：localStorage 存档槽、身份标签、场景完成成就、市场订单与金币/声望累计。
音频层：场景 BGM 与操作音效（干草、衣物摩擦等），强化空间感与 ASMR 向反馈。

渲染：双 Canvas 架构（worldCanvas 全景世界 + hudCanvas UI 覆盖），逻辑分辨率 360×640（9:16）。
3D：Three.js 全景纹理背板 + 场景环境构建；鸡舍等场景含 3D 物体射线拾取与粒子系统。
输入链路：DeviceOrientation 四元数滤波 + 死区/平滑参数可配置；input-config 与 scene-config 文档化，便于后续数据驱动扩展。
状态：单一 State 数据源 + localStorage 持久化（多存档槽、用户表、经济字段）。
工程形态：scenes/暖穗鸡舍/index.html 为当前可运行原型集（四场景切换内聚于单入口）；GAME_DESIGN.md 提供模块拆分与 Agent 可复用的架构说明。

项目从 陀螺仪 H5 框架 出发，结合 Vibe Coding 迭代产品文档（输入链路表、四场景锚点配置、世界观文案库），验证「短回合 + 强反馈 + 可碎片化」是否适合抖音/小程序分发。设计重点不是重度数值，而是：

在本地 HTTP 服务下打开 scenes/暖穗鸡舍/index.html（陀螺仪需 HTTPS 或 localhost）。手机 Safari 需授权「动作与方向」；首次进入按引导完成视角校准。