plan.md

HoloGraph 功能增强计划

1. OOBE（首次引导体验）系统

组件设计

• src/components/OOBE/ - OOBE 引导组件目录
  • index.tsx - 主 OOBE 容器组件
  • steps.tsx - 引导步骤定义
  • WelcomeStep.tsx - 欢迎页面
  • DemoStep.tsx - 示例项目介绍
  • SettingsStep.tsx - 初始设置
  • styles.module.css - 样式

功能特性

• 首次启动自动显示
• 支持从设置页面重新打开
• 步骤导航（上一步/下一步/跳过）
• 进度指示器
• 动画过渡效果
• 键盘快捷键支持（ESC关闭，方向键导航）

2. 欢迎/示例占位项目

数据结构

• 预设示例图数据
• 包含多种节点类型演示
• 展示核心功能（对话、分支、AI响应）

示例内容

1. 欢迎使用 HoloGraph - 介绍性节点
2. 对话示例 - 展示对话流程
3. 分支示例 - 展示分支功能
4. AI 集成 - 展示 AI 节点

3. 工具栏 UI 升级

设计方向

• 现代化图标按钮
• 分组工具栏
• 悬停提示和快捷键显示
• 响应式布局
• 暗色主题优化

工具栏分组

1. 文件操作 - 新建、打开、保存、导入/导出
2. 视图控制 - 缩放、适应视图、全屏
3. 节点操作 - 添加节点、AI生成、分支
4. 布局工具 - 自动布局、网格对齐
5. 显示选项 - 标签、动画、LOD指示器

视觉风格

• 玻璃拟态效果
• 精致的悬停状态
• 图标 + 文字组合
• 分隔线和分组标题