2c47fb8f65
- 添加收藏锦囊功能，支持查看和删除收藏 - 实现积分系统，每日赠送5次灵感次数 - 添加静心阅读功能，阅读15秒可获得额外次数 - 实现灵感广场，展示用户分享的名字 - 添加字源溯源组件，长按汉字查看详情 - 优化空状态和结语卡片样式统一 - 添加音频控制（静音/风铃/雨落/古琴/白噪音/森林/溪流） - 优化名字生成逻辑，确保每次返回5个不重复名字 - 修复卡片翻转样式问题 - 移除首页动态提醒气泡
4.3 KiB
阶段 5 开发实施方案：五感交互与内容生态 (step6_dev.md)
🛠 准 备工作
- 资源包准备：
- 搜集 3-5 段 30s 左右的无缝循环白噪音（MP3/M4A 格式，建议采样率 44.1kHz，单声道以减小体积）。
- 准备 2 个极简音效：水滴声（入墨）、纸张摩擦声（翻转）。
- 后端扩展：
- 在 NameCard 模型中增加 public_shared 字段。
- 准备一个新的 SquareController 用于处理广场流数据。
第一部分：五感体验优化 (Sensory)
1.1 环境白噪音管理 (Soundscape)
- 实现方式：在 app.js 或全局自定义组件中封装 AudioContextManager。
- 代码要点：
1 // utils/audio.js
2 const bgm = wx.getBackgroundAudioManager(); // 或 createInnerAudioContext
3 export const playAmbience = (type) => {
4 bgm.title = '见素-环境音';
5 bgm.src = https://your-cdn.com/audio/${type}.mp3;
6 bgm.loop = true;
7 };
- UI 交互：在卡片详情页右上角增加一个极其隐蔽的“音符”图标，点击弹出切换菜单（静音/风铃/雨落/古琴）。
1.2 触感与音效反馈 (Haptics)
- 触感反馈：在 AI 生成状态变更时调用 wx.vibrateShort({ type: 'light' })。
- 呼吸震动：模仿冥想 App，在名字逐字显现时，配合 setInterval 产生极微弱的节奏震动。
第二部分：智能解析增强 (AI Deep Dive)
2.1 字源溯源组件
- 功能：长按卡片上的某个汉字，触发弹窗。
- 数据来源：
- 方案 A (静态)：内置常用起名汉字库（约 3000 字）的解析。
- 方案 B (动态)：调用后端接口，利用 AI 实时生成该字的“意象分析”。
- UI 设计：弹窗采用透明磨砂玻璃效果，背景展示该字的篆书或隶书位图（可从开源书法库爬取）。
2.2 AI 对话解析
- 前端逻辑：在卡片底部增加“问问 AI”按钮。
- 后端逻辑：
1 // NamingController.java 扩展 2 @PostMapping("/explain") 3 public String explainDetail(@RequestBody ExplainRequest req) { 4 // Prompt: "作为起名专家，请深度解析名字'墨染'对于'从事艺术行业'的职场暗示..." 5 return kimiService.ask(req.getPrompt()); 6 }
第三部分：灵感广场 (Social Square)
3.1 匿名分享流
- 数据库设计：创建 SquarePost 表，存储 name_card_id, image_url, tags, like_count。
- 前端展示：使用小程序瀑布流组件（Masonry Layout），展示用户生成的精美海报缩略图。
- 交互：点击海报进入详情，由于是“见素”风格，评论功能建议弱化，仅保留“共鸣”（点赞）。
3.2 “同款”跳转逻辑
- 核心逻辑：点击“同款意境” -> 携带 keyword 和 mode 参数跳转回 home 页面。
1 // square.js
2 copyInspiration(e) {
3 const { keyword, mode } = e.currentTarget.dataset;
4 wx.reLaunch({
5 url: /pages/home/home?keyword=${keyword}&mode=${mode}
6 });
7 }
第四部分：技术预研与优化
4.1 积分/激励系统
- 逻辑：
- 每日赠送 5 次“灵感”。
- 消耗完后，引导用户点击“静心阅读”（观看 15 秒极简视频或精美画报）增加次数。
- 注意：UI 必须极其克制，不能有任何弹窗干扰，建议放在“个人中心”的角落。
4.2 高级模型接入 (Premium Path)
- 策略模式：在后端 KimiService 中根据用户等级（或请求类型）切换 Model ID。
- 普通：moonshot-v1-8k
- 大师：moonshot-v1-32k 或 gemini-1.5-pro (更强的逻辑推理)。
📅 任务排期 (WBS)
- Day 1-2: 音频/触感系统重构。解决音频在页面切换时的平滑过渡问题。
- Day 3-4: 广场后端 API 开发及小程序瀑布流页面实现。
- Day 5: 字源数据库集成与 AI 对话解析 Prompt 调优。
- Day 6: 性能专项优化（音频资源 CDN 加速、广场图懒加载）。
- Day 7: 整体回归测试与上线准备。
💡 开发提示： 对于“见素”这样追求极致体验的产品，音效的淡入淡出 (Fade In/Out) 至关重要。请务必在切换音频时手动实现音量平滑曲线，避免突兀。