这年我拜爆了 · 赛博互动祈福小游戏

项目简介

这年我拜爆了 是一款专为移动端设计的 2D 像素风互动祈福小游戏。核心 Slogan 为**“今年的好运，先拜为敬”**。本项目采用了明亮鲜艳的暖色调赛博霓虹配色，结合 16-bit 复古游戏质感，带来别具一格的“赛博修电子功德”体验。游戏完全基于 HTML5 Canvas 绘制，无任何外部框架依赖，保证了极高的运行效率和跨平台兼容性。

核心玩法 (四大场景)

1. 开运拜一拜 (Worship)

• 丝滑选神：提供赵公明·正财神、关二爷·武财神、比干·文财神、范蠡·商财神四位财神供玩家参拜。新增左右滑动卡片式轮播，详细展示神明简介与选择提示。
• 体感互动：调用手机陀螺仪，双手按住屏幕模拟持香，上下晃动手机进行参拜（无体感设备则降级为点击屏幕）。
• 赛博赐福：完成参拜后，财神将随机赐下专属的赛博祈福语录。

2. 敲出好运来 (Wooden Fish)

• 功德积攒：点击屏幕敲击木鱼，每次敲击积攒“功德”并触发波纹与飘字特效。新增木鱼受击时的弹性物理缩放。
• 灵宠升阶：随着功德的累积，境界将从“初心”一路飙升至“圆满”，木鱼的光环与粒子特效也会随之升级。
• 本地存储：功德数据会自动保存在本地，随时随地继续修行。

3. 今日神意签 (Moon Blocks)

• 体感投掷：双手握住手机，心中默念问题，用力晃动手机（或点击屏幕）进行投掷。
• 原理解析：利用 2D 物理重力模拟杯筊掉落与弹跳的过程。
• 神明指引：随机生成“圣杯”、“笑杯”或“哭杯”，并附带相应的神明指引与解读。

4. 拜年姿势王 (Stickman)

• 赛博中式人设：角色升级为悬空登场的 16-bit 赛博中式拜年人，采用红金长袍、霓虹青粉电路纹、传统帽冠与发光机械关节，保留 FK 骨骼拖拽结构。
• 落地开摆：点击“开始挑战”后，皮影人会从正中央缓缓落地并散成松垮姿态，玩家需在 8 秒内拖动肢体，把他重新摆回标准拜年动作。
• 清晰引导：准备态、落地过渡与挑战中均提供分阶段提示，围绕“扶正躯干、双手回胸前、恢复作揖礼”来引导玩家理解玩法。
• 动态结算：倒计时结束时会读取头部、双手、双膝、骨盆等关键节点坐标，用启发式规则判定当前姿势属于“跪地磕头 / 拳脚乱舞 / 歪门邪道 / 标准作揖”中的哪一类。
• 动态海报：结算海报不再写死文案，而是根据姿势判定结果动态替换标签与语录，并用赛博霓虹风字体绘制后导出。

视觉与技术亮点

• 视觉风格：极具辨识度的 16-bit 像素艺术（Pixel Art）风格，高对比度、无渐变、无软阴影，呈现最纯粹的复古 2D 平面质感。
• 生动交互：全局 UI 按钮自带物理按压反馈（点击下沉），首页支持点击财神领取初始功德，并在财神两侧生成 2 颗可精准点击、缓慢时隐时现的金币 GIF，每次命中额外获得 +9 功德，配合舒适的缓动飘字与爆金币反馈。
• 极致性能：通过全面弃用庞大的 SVG 文件并改用小尺寸位图（PNG），结合 Canvas 的 imageSmoothingEnabled = false，将原本超过 5MB 的资源体积极致压缩至不到 1MB，完美契合微信小游戏等平台的严苛首包限制。
• 统一字体：全局强制预加载 PoxiaoPixel 像素字体，消除跨设备字体渲染差异。
• 原生实现：零外部依赖，使用原生 JavaScript + Canvas 2D API 构建自定义渲染引擎、UI 系统与动画循环。
• 设备适配：完善的设备安全区适配（Safe Area）与屏幕分辨率自适应（DPR），支持不同尺寸的手机屏幕。

运行方式

无需复杂的编译构建过程，只需通过任意 HTTP 服务器运行项目根目录即可。

# 例如使用 Python 自带的 HTTP 服务器
python -m http.server 8000

然后在手机或浏览器中访问 http://<您的IP>:8000 即可体验。

更新说明（2026-04-26）

• 首页手机端布局优化：扩大财神展示区、收紧按钮区，并压缩右上角“功德”框占位。
• 首页新增财神金币彩蛋：golden_coin.gif 已迁移至 images/home/，并以真实 GIF DOM 元素挂载在首页财神两侧；金币固定在人物两侧缓慢时隐时现，精准点击即可获得 +9 功德，同时降低了财神浮动速度并简化“点我~”提示，避免遮挡人物主体。
• “拜年姿势王”视觉重做为16-bit 赛博中式拜年角色：红金服饰、青粉霓虹线路、发光机械关节与更完整的人物面部细节已接入 FK 渲染。
• “拜年姿势王”场景背景升级为数据庙宇 / 赛博神坛：新增神坛主屏、两侧能量柱、数据流与祭台地面，不再使用简化空场景。
• “拜年姿势王”新增坐标启发式判定与动态海报：倒计时结束后会按骨骼关键节点位置生成不同标签与语录，再写入结算海报。
• “拜年姿势王”新增 PNG 拆件资源已规范化迁移至 images/stickman/，并同步更新加载路径，避免角色素材继续堆放在项目根目录。
• 针对手机端重新调整了“拜年姿势王”的人物落点、头身比、四肢绘制厚度与按钮位置：角色更完整居中，准备页按钮不再压住人物脚部，整体观感更协调。
• “拜年姿势王”本轮重构了 FK 切片绘制算法：废弃按骨骼长度强拉伸贴图的做法，改为固定全局缩放 GLOBAL_SPRITE_SCALE + 关节铰链旋转绘制，四肢/躯干统一以起点关节作为旋转原点，显著修复了贴图错位、比例失调与断肢问题。
• “拜年姿势王”绘制顺序已调整为“后侧肢体 -> 躯干 -> 前侧肢体 -> 头部/脚部”，利用自然遮挡压住接缝；并已通过本地截图复核，当前无需额外追加 UI 美化。
• 木鱼资源目录已规范化：fish.png、fish0.png、fish2.png、striker.png 统一迁移到 images/woodenfish/。
• 木鱼场景引用路径已同步更新为 ./images/woodenfish/*.png，避免根目录资源堆积。
• 木鱼玩法新增可见的“切换木鱼”按钮，支持 4 种形态（第 4 个为经典原始版）与差异化敲击特效。
• “开运拜一拜”成功流程升级为“燃烧显影 → Canvas 海报生成（html2canvas）→ 全屏海报展示”。
• 为避免浏览器缓存导致脚本旧版本执行，index.html 中 device.js、worship.js、woodenfish.js 已添加版本参数。
• “今日神意签” UI 升级：为了完美契合提供的霓虹像素签筒与签条（slip.png），将界面彻底重构为**“赛博街机 / 复古电玩”**配色体系。以深邃的午夜蓝紫为主色调，搭配高对比度的赛博青蓝（Cyan）与霓虹亮粉（Magenta）作为发光边框，辅以经典的街机明黄点缀。同时重写了签条动画的物理曲线，让签条弹出的效果更丝滑生动，彻底解决了原有的尺寸比例和层级遮挡问题。