👋 前言

在 AI 大模型爆发的今天，我们见惯了各种 Chatbot 形式的对话助手。但作为一个科幻迷和开发者，我总觉得缺少了一点“温度”和“酷炫”。于是，WorkingMate 诞生了——这不仅仅是一个语音助手，更是一个拥有赛博朋克风格、能够感知情感的 AI 桌面伴侣。

本项目完全开源，基于 React Native 开发，集成了 DeepSeek 大模型作为大脑，以及火山引擎（豆包） 的 ASR 和 TTS 服务作为耳朵和嘴巴。

👉 项目地址: https://github.com/CanFlyhang/WorkingMate

✨ 核心功能亮点

1. 👁️ 赛博之眼 (Cyber Eyes UI)

摒弃了传统的聊天列表界面，WorkingMate 采用了一双灵动的“赛博之眼”作为主交互界面。

拟人化交互：支持自然眨眼、眼球跟随移动、睡眠模式（带呼噜泡动画）。

情感反馈：它能听懂你的情绪！根据对话内容，眼睛会实时变换形状和角度，表现出开心、生气、惊讶或难过。

2. 🧠 强力大脑 (DeepSeek Inside)

接入了 DeepSeek 大模型，支持流式输出（Streaming），响应速度极快。无论是日常闲聊还是技术问答，都能对答如流。

3. 🗣️ 全双工语音交互

实时听写 (ASR)：基于 WebSocket 的实时语音转文字，支持关键词唤醒（"鸡腿航"）和休眠指令（"拜拜"）。

流式合成 (TTS)：不仅支持流式播放，还优化了首字延迟。在 LLM 输出第一个字时即开始合成语音，实现了近乎“零等待”的对话体验。

🛠️ 技术实现解密

1. 情感分析系统：给 AI 注入灵魂

为了让 AI 看起来不仅仅是一个复读机，我在前端实现了一套轻量级的情感分析引擎。在

src/hooks/useDoubaoAsr.ts 

中，通过关键词匹配实时分析用户的意图和情绪：

```typescript
// 情感状态定义
const [emotion, setEmotion] = useState<'normal' | 'sad' | 'happy' | 'angry' | 'surprised'>('normal');

// 情感分析逻辑
const analyzeEmotion = (text: string) => {
  const happyKeywords = ['开心', '快乐', '笑', '哈哈', 'happy', '棒', '赞', '喜欢', '爱你'];
  const sadKeywords = ['难过', '伤心', '哭', '悲伤', 'sad', '呜呜', '遗憾', '失望', '痛苦'];
  const angryKeywords = ['生气', '愤怒', '讨厌', '滚', 'angry', '烦', '死', '恨', '闭嘴'];
  const surprisedKeywords = ['惊讶', '哇', '真的吗', 'surprised', '天啊', '震惊', '厉害', '牛'];

  if (happyKeywords.some(k => text.includes(k))) return 'happy';
  if (sadKeywords.some(k => text.includes(k))) return 'sad';
  if (angryKeywords.some(k => text.includes(k))) return 'angry';
  if (surprisedKeywords.some(k => text.includes(k))) return 'surprised';
  return 'normal';
};
```

2. 动态 UI 渲染：眼睛的七十二变

在 App.tsx 中，利用 React Native 的 Animated API，将情感状态映射为具体的 UI 变换：

生气：眼睛呈倒八字 (`rotate: 20deg`)，瞳孔变扁平。

难过：眼睛呈八字 (`rotate: -15deg`)，瞳孔顶部变平。

开心：眼睛微眯，瞳孔底部变平（笑眼）。

```typescript
// 根据情感获取眼睛旋转角度
const getEyeRotation = (isLeft: boolean) => {
    if (emotion === 'angry') return isLeft ? '20deg' : '-20deg'; // 生气：倒八字
    if (emotion === 'sad') return isLeft ? '-15deg' : '15deg'; // 难过：八字
    return '0deg';
};

// 动态改变瞳孔形状
const getPupilStyle = () => {
    if (emotion === 'sad' || emotion === 'angry') return styles.pupilFlatTop;
    if (emotion === 'happy') return styles.pupilFlatBottom;
    return null;
};
```

3. 极致体验优化

声波可视化：左上角的声波条不仅仅是装饰，它会根据麦克风音量实时跳动，使用了 `Animated.stagger` 和插值动画，让视觉反馈如丝般顺滑。

思考状态：当用户说话结束等待回复时，右上角会浮现呼吸跳动的思考气泡（💭），填补等待期的交互空白。

多端适配：通过 `useWindowDimensions` 动态判断设备类型，无论是竖屏的手机还是横屏的平板，都能获得完美的布局体验。

---

🚀 快速上手

如果你也想拥有一个这样的桌面伴侣，可以按照以下步骤运行项目：

1. 克隆代码:

bash git clone https://github.com/CanFlyhang/WorkingMate.git

2. 安装依赖:

bash npm install

3. 配置 API Key:

* 在 src/services/DeepSeekService.ts 中填入你的 DeepSeek API Key。

* 在 src/config/DoubaoConfig.ts 中填入火山引擎的 AppID 和 Token。

4. 运行:

bash npm run android

📝 结语

WorkingMate 是一个探索性质的项目，它展示了 React Native 在构建高性能、强交互应用上的潜力，也展示了 LLM + ASR + TTS 结合后的无限可能。

欢迎大家 Star ⭐️ 支持，或者提交 PR 一起完善这个赛博伴侣！