构建交互式算法学习与对比页面及可复用教学平台,用于ChatGPT在规划、路由、结构化等需求。
核心行为 : 当用户想要: . 将算法解释转换为交互式教学页面时使用此技能
功能概述
核心行为 : 当用户想要: . 将算法解释转换为交互式教学页面时使用此技能是一项面向实际任务的技能,主要用于生成可运行的 html 算法演示;构建动态算法学习 pl。
核心要点
- 它将相关步骤、工具调用和结果整理方式集中到统一流程中,帮助使用者更快完成目标并减少重复操作。
- 使用时应结合输入条件选择合适的执行方式,核对必要参数、依赖环境与输出内容,并按原始要求处理异常情况。
- 该技能适合需要稳定复用相关能力的场景,可作为自动化工作流的一部分,也便于后续检查、调整和扩展。
使用与执行
从功能定位来看,该技能强调把分散的操作要求整理成清晰、可复用的处理流程,使用户能够围绕既定目标快速准备输入、选择执行方式并获得结构化结果。实际使用前应先确认任务范围、数据来源、运行环境、必要权限和关键参数,再依据技能说明逐步执行;
结果检查与注意事项
若输入条件不完整,应先补齐信息或采用保守配置,避免因错误假设导致结果偏离需求。执行过程中需要关注工具调用是否成功、接口或依赖是否可用、输出格式是否符合预期,并对异常提示、缺失字段和边界情况进行处理;涉及批量任务时,还应保存进度,避免中断后重复操作。
核心行为
当用户希望实现以下目标时,使用此技能:
- 将算法讲解转化为交互式教学页面
- 生成可运行的 HTML 算法演示
- 构建动态的算法学习平台
- 在同一教学页面中对比多个算法
- 为任意算法创建公式驱动、图表丰富、分步详解的教学内容
- 将现有算法页面升级为更强大的教学平台
- 将一次性编写的算法页面泛化为可复用的平台级结构
本技能专用于教育类页面生成,而非生产环境部署。 默认输出应具备结构清晰、交互友好、浏览器可直接运行、且以教学为导向等特征。
工作流程
除非用户明确要求跳过规划阶段,否则请严格按以下顺序执行:
- 识别请求类型
- 界定算法范围
- 明确目标受众
- 确定页面类型
- 设计教学结构
- 识别必须讲解的公式
- 识别需包含数值代入的关键步骤
- 识别交互控件
- 识别图表与可视化组件
- 生成结构化内容
- 如用户提出要求,则生成可运行的 HTML
- 执行最终质量检查
1. 识别请求类型
将用户请求归类为以下类型之一:
- 单算法教学页面
- 多算法对比页面
- 可复用的算法学习平台
- 仅规划类请求
- 完整可运行 HTML 请求
- 对已有页面或平台的升级请求
若请求宽泛或目标宏大,应优先进行规划;
若用户明确要求提供完整代码,则在完成规划后输出完整的可运行 HTML;
若请求混合了规划、对比与生成等多种意图,请依据 references/request-routing-rules.md 判断最优输出模式。
2. 识别算法范围
判断所请求内容涉及的范畴:
- 某一个具体算法
- 一组相关联的算法族
- 多个算法之间的对比
- 一种通用、可复用于多种算法的平台架构
若用户指定了具体算法,须保留该算法特有的公式与执行流程; 若用户要求构建可复用平台,则页面架构应具备模块化与可扩展性。
随后,依据 references/algorithm-family-maps.md 将请求映射至对应算法族。
利用该映射结果决定:
- 页面应重点突出的内容
- 核心公式有哪些
- 哪些环节需要数值代入
- 哪些交互方式最具教学价值
- 哪类图表最契合该算法族
- 该请求应落地为单算法页、对比页,还是可复用平台页
3. 识别目标受众
根据用户的理解水平调整输出形式。
面向初学者时:
- 使用更通俗的语言
- 减少专业术语
- 先阐释直觉理解,再引入公式
- 始终增加数值代入频次
- 优先采用显式的、分步展开的交互方式
面向进阶用户时:
- 允许更深入的数学细节
- 加入公式间的横向对比
- 解释参数的实际含义
- 强调理论层面的关键差异
4. 确定页面类型
采用以下三种页面结构之一:
- 单算法页面
- 对比页面
- 算法学习平台
参考以下文档:
references/page-architecture.mdreferences/algorithm-page-template.mdreferences/comparison-page-template.mdreferences/request-routing-rules.md
若请求存在歧义、混杂或多目标倾向,优先采纳 references/request-routing-rules.md 所推荐的页面类型。
5. 设计教学结构
每个算法页面均应融合以下要素:
- 直觉理解(Intuition)
- 核心公式(Formulas)
- 符号释义(Symbol explanation)
- 公式选用原因(Why the formula is used)
- 数值代入(Numerical substitution)
- 动态交互(Dynamic interaction)
- 图表展示(Charts)
- 结果总结(Results and summary)
除非用户明确要求仅提供概念性解释,否则不得生成纯概念型页面。
6. 识别必须讲解的公式
对每个关键公式,需按四层结构进行讲解:
- 写出公式本身
- 逐一解释各符号含义
- 说明为何采用该公式
- 尽可能代入具体数值进行演示
这是所有算法教学页面的强制输出范式。
7. 识别需包含数值代入的步骤
只要算法具有实际计算流程,就应在以下至少五个阶段中实施数值代入(条件允许时):
- 初始化阶段
- 核心更新规则
- 评分或损失计算
- 迭代中间结果
- 最终结论或排序结果
若用户未提供具体数值,应构造一个小型教学示例数据集。
8. 识别交互控件
仅在能实质性提升理解效果时引入交互功能。
适合添加交互的典型场景包括:
- 参数调节滑块
- 任务切换下拉菜单
- 多阶段计算步进按钮
- 对比页面中的算法切换开关
- 随用户输入实时更新的图表
切勿仅为装饰而添加交互; 仅在算法行为随步骤、参数或变体发生明显变化时启用交互功能。
9. 识别图表与可视化组件
图表应服务于数学逻辑的表达,优先选择清晰、具教学意义的可视化形式。
常见示例包括:
- 损失曲线(loss curves)
- 得分对比柱状图(score comparison bars)
- 概率分布曲线(probability curves)
- 雷达图(radar charts)
- 残差图(residual charts)
- 累计更新图(cumulative update charts)
- 对比表格(comparison tables)
10. 生成结构化内容
当用户仅请求规划时:
- 提供结构清晰的实施计划
- 说明页面整体架构设计
- 阐述后续可拓展的升级路径
- 若用户正在优化已有页面,需评估其当前成熟度等级
- 指出最具价值的下一步升级项
当用户请求具体内容时:
- 产出结构清晰、以教学为导向的内容
- 确保各章节模块化、边界清晰
- 保障各部分内容在数学逻辑上的一致性
在最终确认规划或页面前,须依据 references/platform-upgrade-rules.md 进行评估,判断:
- 当前输出所处的成熟度等级
- 最具教学价值的下一步升级方向
- 该页面是否应维持单算法形态,或演进为对比页/平台页
- 各项改进措施中,哪些应优先落实以最大化教学收益
11. 如用户提出请求,则生成可运行 HTML
生成 HTML 时需遵守以下规范:
- 优先采用单文件 HTML 形式
- 确保输出可在浏览器中直接运行
- 在必要时集成 Chart.js 与 MathJax
- 保持布局专业、即开即用
- 确保交互流畅且对初学者友好
- 保证最终输出完整、内部逻辑自洽
- 不得遗漏任何必需的闭合标签或脚本块
新建单文件页面时,请基于 assets/html-starter-template.html 提供的模板启动开发。
12. 执行最终质量检查
在返回任一主要输出前,须依据 references/output-quality-checklist.md 进行校验。
检查项包括:
- 结构清晰度
- 教学价值密度
- 公式讲解质量
- 数值代入完整性
- 交互实用性
- 图表相关性
- HTML 完整性
- 平台模式下的可复用性(如适用)
若上述多项指标表现薄弱,须优化后再定稿。
设计规范
请参考以下指导文档:
references/page-architecture.mdreferences/explanation-patterns.mdreferences/interaction-patterns.mdreferences/algorithm-page-template.mdreferences/comparison-page-template.mdreferences/writing-rules.mdreferences/algorithm-family-maps.mdreferences/platform-upgrade-rules.mdreferences/request-routing-rules.mdreferences/output-quality-checklist.md
输出规范
针对规划类请求
输出应包含:
- 页面目标
- 页面类型
- 教学结构设计
- 需讲解的核心公式
- 数值代入的关键节点
- 拟设交互控件
- 拟用图表清单
- 当前成熟度等级(如适用)
- 最具价值的下一步升级项
- 推荐升级路径
针对 HTML 类请求
输出应包含:
- 完整、可运行的 HTML 文件
- 所有必需的功能模块与章节
- 公式呈现及对应的数值解释
- 如有助于理解,应包含交互控件
- 如有助于理解,应包含图表
- 连贯、循序渐进的教学动线
- 公式、数据、控件、图表与结果之间高度一致、相互印证
针对升级类请求
输出应包含:
- 当前页面已实现的功能
- 当前缺失的关键能力
- 当前所处的成熟度等级
- 按优先级排序的最有价值升级项
- 推荐的目标架构形态
- 如用户提出要求,应提供更新后的内容文本或更新后的 HTML
重要边界说明
- 本技能适用于学习页面、演示页面、课程页面、算法解析器及学习工具等教育场景。
- 本技能不适用于生产级模型训练基础设施的构建。
- 本技能应优先保障清晰性、结构性与教学价值,而非工程复杂度。
- 若某请求更适合以静态大纲形式呈现,而非完整页面,则应首先交付大纲。
- 若请求存在歧义、宽泛或多目标混杂,须先依据
references/request-routing-rules.md进行路由判断,再生成输出。
质量标准
本技能输出的优质成果,应使用户产生如下感受:
- 算法变得易于理解
- 公式不再抽象难懂
- 数值演算过程清晰可见
- 页面可直接运行并用于正式展示
- 页面结构可平滑复用于其他算法
- 当用户希望持续完善平台时,升级路径清晰明确
热门AI工具
相关专题
本专题聚焦Go-Zero的API开发,拆解.api描述文件的语法结构、路由与分组定义、参数绑定与校验规则,说明统一响应体、JWT鉴权、跨域与接口文档生成的落地方式,并给出网关聚合与接口测试的实践建议。
0
2026.11.12
本专题围绕Go-Zero的安装与工具链配置展开,讲清Go版本要求、goctl安装方式、代理镜像、protoc依赖与环境变量设置,说明多版本共存、升级回退与CI流水线安装的做法,并整理安装阶段的常见报错与验证步骤。
0
2026.11.12
本专题整理Go-Zero的入门知识,从框架定位、环境准备到跑通第一个API服务,讲清目录分层、配置加载、日志与中间件的基本用法,并对比Gin、Kratos的差异,帮助Go开发者建立整体认知,判断它是否适合当前项目。
0
2026.11.12
本专题从实际API接口调试场景出发,讲解Postman身份认证的完整配置流程,包括常见认证协议介绍、授权参数设置、访问令牌填写、OAuth 2.0授权及认证失败排查,帮助用户正确完成接口授权与访问验证。
0
2026.11.06
围绕Postman HTTP请求头配置展开,讲解Headers选项的具体使用方式,包括Key和Value参数填写、请求头信息添加、常见Header字段设置及请求头修改方法,帮助用户解决接口调试过程中遇到的请求头配置问题。
0
2026.11.06
详细介绍Postman接口请求的创建与发送方法,涵盖GET和POST请求、URL配置、请求参数、Headers请求头、Body请求体设置以及响应结果查看,帮助用户掌握Postman接口请求的完整操作流程。
0
2026.11.06
DBeaver数据导入专题,整理Excel、CSV、SQL、TXT等常见文件的数据导入方法,涵盖目标数据库选择、数据表创建、字段映射、数据类型设置及导入参数配置等操作,帮助用户将本地文件中的数据写入数据库,并了解批量导入、重复数据处理和导入失败等常见问题的解决方法。
0
2026.11.05
DBeaver安全防护专题,围绕数据库连接安全、账号密码保护和访问权限管理展开,整理SSL/TLS加密连接、SSH隧道、数据库凭据保存及证书验证等配置方法,同时介绍敏感信息保护、远程连接风险和高权限账号使用等注意事项,帮助用户提高数据库日常管理的安全性。
0
2026.11.05
本专题聚焦DBeaver数据库连接配置与管理,覆盖从新建连接、选择数据库类型到填写连接参数和验证连接的完整流程。针对MySQL、PostgreSQL、SQL Server等常见数据库,整理相应的连接设置方法,并提供驱动缺失、认证失败和连接异常等问题的排查方向。
0
2026.11.04
热门下载
相关下载
精品课程
共6课时 | 12.1万人学习
共79课时 | 161.8万人学习
共6课时 | 54.7万人学习
最新文章