# build-computer-edu

**Repository Path**: Interest-driven/build-computer-edu

## Basic Information

- **Project Name**: build-computer-edu
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-03-16
- **Last Updated**: 2026-05-02

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 计算机硬件组成教学互动系统

## 项目简介

本系统是一个面向高中生的计算机硬件组成教学互动系统，旨在通过直观、生动的3D交互方式帮助学生学习和理解计算机主要硬件组件及其功能。

## 系统功能

### 1. 硬件组装 (assembly.html)
- 通过3D交互操作添加或移除CPU、主板、内存、硬盘、显卡、电源等主要硬件组件
- 3D可视化展示各硬件组件在计算机中的位置和连接关系
- 支持鼠标拖拽旋转、缩放视图，点击已放置的硬件组件进行移除
- 响应式设计，适配桌面端和移动端

### 2. 硬件详情 (components.html)
- 展示各硬件组件的3D模型、详细说明、参数信息及在计算机系统中的作用
- 提供CPU、内存、显卡、硬盘、电源、主板等组件的3D可视化展示
- 支持对3D模型进行旋转、缩放操作，从不同角度观察硬件结构
- 包含各组件的主要参数和功能作用说明

### 3. 组装引导 (guide.html)
- 提供硬件组装流程的交互式引导
- 按照步骤讲解硬件组装过程
- 包含详细的安装步骤和注意事项

### 4. 知识测验 (quiz.html)
- 提供关于计算机硬件知识的选择题
- 自动评分并显示正确答案
- 提供详细的反馈信息

### 5. 性能测试 (performance.html)
- 测试3D场景的性能表现，包括帧率、内存使用等指标
- 生成详细的性能测试报告
- 提供性能优化建议

## 技术特点

- **3D可视化**：使用Three.js实现硬件组件的3D展示和交互
- **完全离线运行**：无需依赖任何网络资源
- **响应式设计**：适配不同屏幕尺寸，支持桌面端和移动端
- **直观易用**：操作简单，符合高中生认知特点
- **交互式学习**：通过3D交互操作增强学习体验
- **性能优化**：采用几何体复用、材质复用、渲染性能优化等措施
- **教育性**：包含必要的教学引导和知识测验功能

## 使用方法

1. 打开 `index.html` 文件，进入系统主页面
2. 点击相应的功能模块进入对应页面
3. 在硬件组装页面：
   - 使用鼠标拖拽旋转3D视图
   - 使用鼠标滚轮缩放视图
   - 点击上方按钮添加相应的硬件组件
   - 点击已添加的硬件可以将其移除
4. 在硬件详情页面：
   - 查看各硬件组件的3D模型
   - 使用鼠标操作旋转、缩放3D模型
   - 阅读组件的详细信息和参数
5. 在组装引导页面，按照步骤学习硬件组装流程
6. 在知识测验页面，测试对计算机硬件知识的掌握程度
7. 在性能测试页面，测试3D场景的性能表现

## 项目结构

```
build-computer-edu/
├── index.html          # 主页面
├── assembly.html       # 3D硬件组装页面
├── components.html     # 3D硬件详情页面
├── guide.html          # 组装引导页面
├── quiz.html           # 知识测验页面
├── performance.html    # 性能测试页面
└── README.md           # 使用说明文档
```

## 系统要求

- 现代Web浏览器（Chrome、Firefox、Edge等）
- 支持WebGL 1.0或更高版本
- 支持HTML5和CSS3
- 推荐配置：
  - CPU：Intel i3或 equivalent
  - 内存：4GB或更多
  - 显卡：支持WebGL的集成显卡或独立显卡
  - 分辨率：1024x768或更高

## 性能优化措施

1. **几何体和材质复用**：减少内存使用，提高渲染性能
2. **像素比限制**：根据设备性能自动调整渲染质量
3. **阴影禁用**：禁用阴影以提高性能
4. **响应式适配**：根据设备类型调整相机位置和控制方式
5. **移动端优化**：针对移动设备使用更轻量级的控制方式

## 教育价值

- 帮助学生直观理解计算机硬件组成和空间结构
- 培养学生的空间思维能力和动手能力
- 提供系统化的计算机硬件知识学习路径
- 通过3D交互增强学习兴趣和记忆效果
- 通过测验巩固学习成果

## 注意事项

- 本系统仅用于教育目的
- 所有硬件组件均为虚拟3D模型，非实际硬件
- 系统设计符合高中生认知水平，内容通俗易懂
- 在低配置设备上可能会出现性能下降，建议使用性能测试页面进行测试

## 未来扩展

- 添加更多硬件组件的3D模型和详细信息
- 增加硬件组装的动画演示
- 添加硬件性能对比功能
- 开发移动端专用版本
- 增加多人协作组装功能
- 添加更多互动式学习场景