详细说明: - 添加了V2版本的工作流页面和结果页面 - 更新了Serena记忆文件 - 添加了详细实施计划文档 - 优化了Vite配置 - 更新了项目文档CLAUDE.md - 构建了演示系统的dist版本 - 包含了exhibition-demo的完整依赖
69 lines
2.2 KiB
Markdown
69 lines
2.2 KiB
Markdown
# 会展策划多Agent演示系统项目 - 2025-09-08
|
||
|
||
## 项目概述
|
||
构建一个基于React的Web演示系统,实时展示多Agent协同生成会展策划方案的完整过程。
|
||
|
||
## 技术栈决策
|
||
- **框架**: React 18 + TypeScript
|
||
- **动画**: Framer Motion + CSS Animations
|
||
- **样式**: Tailwind CSS (参考字节跳动、Flowith、Raycast设计风格)
|
||
- **状态管理**: Zustand
|
||
- **构建工具**: Vite
|
||
|
||
## 项目文件结构
|
||
```
|
||
web_frontend/
|
||
├── data/
|
||
│ ├── Agent_prompt/ # 7个专业Agent的prompt文档
|
||
│ │ ├── 信息检索专家.md
|
||
│ │ ├── 格式编辑专家.md
|
||
│ │ ├── 会展策划专家.md
|
||
│ │ ├── 设计师专家.md
|
||
│ │ ├── 财务预算专家.md
|
||
│ │ ├── 活动执行专家.md
|
||
│ │ └── 营销宣传专家.md
|
||
│ └── 会展策划/
|
||
│ └── 汽车展会展策划案_DEMO.md # 演示输出文档
|
||
├── doc/
|
||
│ ├── 可行性分析.md # 技术实施方案
|
||
│ └── 会展策划工作流.md # n8n工作流程图
|
||
└── exhibition-demo/ # React演示系统
|
||
```
|
||
|
||
## 演示参数
|
||
- **总时长**: 3分钟
|
||
- **文字生成速度**: 30-40字/秒
|
||
- **Agent Prompt展示**: 完整展示,逐步显示
|
||
- **交互控制**: 暂时不支持跳过,保证演示完整性
|
||
|
||
## 内容板块(6个独立页面)
|
||
1. 策划案
|
||
2. 展会介绍与预期效果
|
||
3. 营销方案
|
||
4. 现场运营方案
|
||
5. 预算与收益分析
|
||
6. 风险评估与应急预案
|
||
|
||
## 演示流程设计
|
||
1. 初始页面:展示Run按钮
|
||
2. 点击Run:开始执行mermaid流程
|
||
3. 每个Agent独立输出:
|
||
- 显示Agent头像和名称
|
||
- 展示Agent的Prompt
|
||
- 逐字生成文字内容(打字机效果)
|
||
- 图片加载时显示loading动画
|
||
4. 生成完成后自动切换到下一个页面
|
||
|
||
## 设计风格
|
||
- **视觉风格**: 简洁实用、年轻化、高端感
|
||
- **参考产品**: 火山引擎、Trea、Flowith、Raycast
|
||
- **核心特征**:
|
||
- 精致的微动画
|
||
- 清晰的信息层级
|
||
- 中性色调搭配品牌色
|
||
- 优雅的过渡效果
|
||
|
||
## Git分支管理
|
||
- **Main**: 主分支(已同步到Gitea)
|
||
- **My_N8N**: n8n中文翻译功能
|
||
- **Web_Create**: AgentDemo演示系统开发(当前分支) |