# 翻牌特效项目共识 (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 工具生成的占位图或默认素材。