28 lines
1.2 KiB
Markdown
28 lines
1.2 KiB
Markdown
# 翻牌特效项目共识 (CONSENSUS)
|
||
|
||
## 需求描述
|
||
开发一个基于 React 的翻牌 Web 应用,模拟抽盒机的翻牌流程及特效。重点在于 3D 翻牌动画、星空粒子背景以及整体视觉体验。
|
||
|
||
## 验收标准
|
||
1. **网格布局**:实现 3x4 的响应式卡片网格。
|
||
2. **3D 翻牌**:卡片点击后执行平滑的 3D 翻转动画。
|
||
3. **特效层**:翻牌时伴随全屏星空背景和闪烁粒子特效。
|
||
4. **大图展示**:翻牌后产品大图居中弹出,具备毛玻璃遮罩。
|
||
5. **静态数据**:使用 Mock 数据驱动,包含产品图片、用户头像、昵称、倒计时。
|
||
|
||
## 技术方案
|
||
- **框架**:React 19 + TypeScript
|
||
- **构建工具**:Vite
|
||
- **样式**:TailwindCSS + CSS Modules/Raw CSS (用于复杂动画)
|
||
- **动效库**:Framer Motion (可选,若需更细腻控制) 或 纯 CSS 3D Transforms。
|
||
|
||
## 技术约束
|
||
- 纯前端实现,暂不对接后端接口。
|
||
- 代码部署在 `douyin_game` 目录下。
|
||
|
||
## 集成方案
|
||
- 作为一个独立项目在 `douyin_game` 中进行初始化。
|
||
|
||
## 风险与假设
|
||
- 所有图像资源(产品图、头像)暂时使用 generate_image 工具生成的占位图或默认素材。
|