她的镜子 (Her Mirror)

一个引导性对话网站，帮助长期"自我沉默"的女性，通过回答具体问题，第一次用自己的话看见自己。

项目简介

"她的镜子"是一个基于 AI 的心理健康支持工具，专为那些长期压抑自我表达的女性设计。通过8个精心设计的引导性问题，帮助用户：

• 看见自己 - 用自己的语言描述自己的故事
• 接纳情绪 - 在安全的星空环境中表达内心
• 收获礼物 - AI 生成个性化的诗和信作为回应
• 带走记忆 - 可保存为图片，随时回顾

项目文件

文件	说明
她的镜子_课堂汇报.html	课堂汇报演示文稿（可直接在浏览器打开）
PRD_她的镜子.html	产品需求文档（PRD）
src/	React 源代码
api/	Netlify Functions (Claude API 调用)
public/	静态资源

技术栈

• 前端: React + Vite + Tailwind CSS
• AI: Claude API (via Netlify Functions)
• 特效: 手势交互星空效果
• 部署: Netlify

功能特性

• 8个引导性问题（从轻松到深入的渐进设计）
• 危机关键词检测（自动识别求助信号）
• AI 生成诗和信（基于用户回答的个性化内容）
• 手势控制星空（创新交互体验）
• 保存为图片（可分享、可回顾）

安全设计

• 无账号系统（不收集用户身份信息）
• 本地存储（数据不上传服务器）
• 危机检测（识别关键词，提供专业求助渠道）
• 温和退场（用户随时可以离开）

本地开发

npm install npm run dev

部署到 Netlify

1. 推送代码到 GitHub
2. 在 Netlify 连接仓库
3. 设置环境变量：ANTHROPIC_API_KEY
4. 部署

环境变量

ANTHROPIC_API_KEY - Anthropic Claude API 密钥

设计理念

人本 AI 设计原则：

1. 自主性 - 用户完全控制对话节奏
2. 透明性 - AI 角色清晰说明
3. 隐私优先 - 无账号、无追踪
4. 温和退场 - 正面引导，不制造依赖
5. 危机响应 - 检测求助信号，提供专业资源

---

北师大心理学部 · 人本 AI 设计与创新课程