# 光栅卡陀螺仪交互优化设计方案

**日期:** 2026-05-22
**文件:** `docs/superpowers/specs/2026-05-22-lenticular-gyro-optimization-design.md`

---

## 1. 问题描述

设备使用陀螺仪倾斜查看光栅卡时，图片在左右视图之间快速来回切换，无法稳定在某一侧。

**期望行为：**
- 设备居中（不倾斜）→ 显示中性图
- 往左倾斜 → 稳定显示左视图
- 往右倾斜 → 稳定显示右视图

**当前行为：**
- 轻微倾斜就触发切换，且图片在左右之间来回振荡
- 没有平衡点让图片稳定

---

## 2. 根本原因

**原因：缺少中性阈值区（Dead Zone）**

陀螺仪数据直接映射到图片切换阈值，没有任何"容忍区"。

当设备略微偏离中心时：
- `gamma` 值微小的正负变化
- 直接导致 `x` 方向变化
- 触发 opacity 切换

加上陀螺仪本身的噪声和设备轻微晃动，导致图片不断在左右之间来回切换。

---

## 3. 修复方案

**文件:** `frontend/composables/useHolographicPreview.js`

### 修改：增大中性阈值区

当前代码已有 dead zone 判断逻辑，只需增大 `db` 系数即可：

```javascript
// 第79行
const db = 0.08 * dead  // 从 0.016 改为 0.08
```

**说明：** 增大 db 系数 = 中性区变宽 = 更难触发切换 = 图片更稳定

---

## 4. 参数调整

| 参数 | 当前值 | 修改后 | 说明 |
|------|--------|--------|------|
| db (dead zone) | 0.016 | 0.08 | 中性区阈值，越大越难触发切换 |

**建议值范围：** 0.05 ~ 0.12
- 值越大：中性区越宽，越稳定但响应越慢
- 值越小：越敏感，但容易误触发

---

## 5. 验收标准

| 测试场景 | 期望结果 |
|---------|---------|
| 设备静止居中 | 显示中性图，稳定不动 |
| 轻微倾斜 | 保持中性，不触发切换 |
| 明显往左倾斜 | 显示左视图，稳定 |
| 明显往右倾斜 | 显示右视图，稳定 |
| 从倾斜缓慢回到居中 | 平滑过渡，无振荡 |

---

## 6. 影响范围

- 修改文件：`frontend/composables/useHolographicPreview.js`
- 不影响触摸滑动交互
- 不涉及后端或数据库