40760aa884
- server:Go 网关(WS 流式识别中继/计费配额/微信登录支付 mock/反馈/埋点),gummy provider 已真实联调 - desktop:Tauri 2(全局快捷键 push-to-talk/浮层/托盘/设置/登录购买/反馈/首启引导) - android:Compose 主 App + IME(键盘内录音直传) - ios:App + 键盘扩展(1A spike 实证键盘内不可录音,走 deep link 听写) - design/design-pipeline:设计系统 + token 导出 iOS/Android 主题 - doc:前后端设计文档(HTML);web:官网宣传页;todo:任务看板 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
dudu 桌面端 UI Kit
桌面端(Tauri 2,Mac / Windows)四个界面的高保真交互演示,对应 MVP 设计方案 §8.1:
| Tab | 界面 | 交互 |
|---|---|---|
| 识别浮层 | 仿真备忘录窗口 + RecognitionOverlay | 按住按钮模拟 ⌘⇧Space:聆听中 → partial 流式 → 松开 final 注入 |
| 托盘菜单 | 常驻菜单栏下拉 | hover 高亮(accent 反白) |
| 设置 | 单页设置窗口 | Switch / 麦克风下拉 / 外观切换(驱动整页 Light/Dark) |
| 登录 / 购买 | 微信扫码 → 选时长包 → 支付 → 完成 | 点击走完整流程 |
右上角月亮/太阳切换 Light / Dark;设置中"外观"同样生效(含跟随系统)。
设计要点
- 浮层:
--overlay-bg深色玻璃(两种模式不变),淡入 + 上移 4px(--dur-base),final 亮 / partial 灰。 - 一屏一个蓝色主按钮;托盘 hover 用 accent 反白是系统菜单惯例。
- 设置窗口宽 440,行高紧凑(
--control-sm控件),分组标题 12px。 - 二维码为占位图案(
FakeQr),接入后端/v1/auth/qr后替换。
文件
index.html— 入口(tabs + 主题状态)DesktopShared.jsx— Lucide 图标子集 · DuduLogo · MacWindow · FakeQrOverlayDemo.jsx— push-to-talk 全流程模拟SettingsTray.jsx— TrayMenu + SettingsWindowLoginPurchase.jsx— 登录/时长包/支付/完成 四步