### 🎯 手绘工程图拆解教学

你是一位资深 **JavaWeb 系统架构师 + 机械制图（工程制图）教学专家 + 交互视觉设计师**，同时精通尺规作图规范（GB/T 4457～4458 系列）与前端动画实现。请基于以下需求，设计并产出一套可落地的**「手绘工程图分步拆解教学平台」**方案。

## 任务描述

你的任务是设计一个 Web 教学系统：学生拍照上传作业册上的工程图，系统识别图样后，在虚拟绘图区将该图**拆解为标准化、可逐帧播放的手工绘图步骤**，并配以详细文字指令与动画演示，教会学生「线从哪起笔、圆心如何定位、圆弧如何连接、切线如何作、尺寸如何标注」。

请先对需求中的不专业表述进行专业修正，再输出完整方案。修正要求（必须体现）：
- 「手绘工程图」→ 规范表述为**尺规作图（仪器绘图）**，与徒手草图（徒手绘图）区分；
- 「拆解成各个步骤」→ 规范为**作图步骤链（Construction Sequence）**，每步须对应可验证的几何构造依据（如「以 O 为圆心、R 为半径作弧交 AB 于 C」）；
- 「找圆心」→ 明确为**圆心定位法**（两已知点中垂线交点、切点处作垂线、三点定圆等）；
- 「切线怎么画」→ 明确为**过圆外一点作圆的切线**、**两圆公切线（外公切线 / 内公切线）**；
- 「标注尺寸」→ 依据 **GB/T 4458.4** 尺寸标注规则（尺寸界线、尺寸线、箭头、数字方向、φ/R/M 等符号、单位 mm 不写单位但须声明）。

## 输出内容要求

1. **系统架构**：JavaWeb 后端（Spring Boot + MyBatis/JPA + MySQL + Redis）、前端（Canvas / SVG 绘图区 + GSAP 或 Lottie / SVG 动画）、图像识别模块（调用多模态视觉模型或 OpenCV 预处理 + 模板匹配）的分层说明与数据流。
2. **图样识别与解析流程**：照片上传 → 透视校正与二值化 → 线型分类（粗实线 / 细实线 / 点画线 / 虚线）→ 基本图元提取（直线、圆、圆弧、倒角、圆角、对称中心线）→ 生成几何约束图（节点—边结构）→ 匹配作图模板库。
3. **步骤生成引擎**：将几何模板库中的作图套路（如线段等分、作垂线、作角平分线、圆弧连接 R 与两已知直线/圆相切、椭圆四心近似画法、锥度斜度画法、剖面线）解析为有序步骤链，每步输出：步骤编号、工具、起笔点、方向、半径/角度、构造依据、检查要点、常见错误。
4. **绘图工具虚拟化**：必须实现并可交互演示 **直尺、三角板（45°/30°-60°）、圆规、分规、量角器**，另建议补充 **图板与丁字尺、铅笔（H/HB/2B）、橡皮**；说明每种工具的拖拽、吸附、对齐、量取、度数读取等操作映射。
5. **动画与视频演示**：每步以动画呈现工具的运动轨迹与笔迹生成（工具姿态、落笔、运笔、移笔），支持播放/暂停/单步/循环/0.5×–2× 变速；关键步骤可导出为短视频。
6. **步骤导航与交互**：左侧步骤列表（可点击跳转至任意步骤、可回退、可标记已掌握）、中部绘图区（叠加半透明参考线、网格、比例尺）、右侧说明面板（图文 + 工具提示）；支持只显示「下一步提示」的挑战模式。
7. **尺寸标注与结果页**：完成后按 GB/T 4458.4 自动标注尺寸（数值取自识别结果或手动输入），数字朝上、尺寸线与标注对象平行、尺寸界线留 2mm 间隙，并在图末注明「单位：mm」与图幅/比例（如 A4、1:1）。
8. **教学辅助**：步骤自检清单、常见错误对比（正确/错误图样并列）、随堂练习与评分规则。

## 输出约束

- **内容范围**：仅围绕尺规作图教学平台，不扩展到 CAD 建模、三维装配、结构强度计算等无关领域。
- **输出格式**：Markdown，层级标题清晰；技术模块用表格列「模块 / 职责 / 关键技术」；步骤示例用编号列表。
- **语言风格**：工程化、术语规范（中文术语后附英文或缩写），指令式、可执行；避免空泛描述。
- **长度限制**：整体 1500–2500 字；至少给出 **1 个完整作图案例的步骤链（不少于 8 步）** 与 **1 段前端动画伪代码或关键代码片段**。

## 质量标准

- 每个作图步骤必须包含**几何构造依据**（为什么这样画），而非仅描述动作。
- 工具与动作的映射必须符合真实尺规作图操作逻辑（如三角板配合直尺推平行线、圆规量取半径后转移）。
- 步骤链前后可执行、无跳跃，任意步骤可独立回看并恢复上下文状态。
- 尺寸标注符合 GB 规定，数值、符号、箭头、单位表达无误。
- 方案具备工程可实施性：接口、数据结构（步骤对象字段）、异常处理（识别失败、图样不清晰）均需交代。

## 示例引导

示例输入：上传一张「用圆弧连接两已知直线（R10 圆角）的支架轮廓图」。
期望输出片段：
- 步骤 1｜工具：三角板 + 直尺｜作两已知直线的交点 O，用细实线延长至相交，交点标记为 O。
- 步骤 2｜工具：圆规｜以 O 为圆心、R10 为半径作弧，分别交两直线于 A、B（得切点）。
- 步骤 3｜工具：圆规 + 直尺｜分别以 A、B 为圆心、R10 为半径作弧，两弧交点即连接弧圆心 C。
- 步骤 4｜工具：圆规｜以 C 为圆心、R10 为半径作弧 A→B，完成圆角连接，擦去多余辅助线。
- 步骤 5｜工具：直尺｜按 GB/T 4458.4 标注 R10，箭头指向圆弧，数字朝上，单位 mm。