← 返回首页

立方(Cub e-1)物理
大模型

基于 人工智能 大语言模型的智能代码生成能力
构建轻量级、交互式物理学环境模拟平台

Next.js 15 DeepSeek API TypeScript Matter.js Canvas / WebGL Prisma ORM
5
物理领域覆盖
50+
预设实验模板
16w
开发周期
<3s
页面加载时间
Scroll

四层分离技术架构

采用前后端分离的现代化 Web 架构,各层通过标准化接口通信,确保系统的松耦合与高内聚。

Layer 01
用户交互层
Next.js 15 SSR
TypeScript 类型系统
Tailwind CSS 4 原子化
shadcn/ui 组件库
Frontend
Layer 02
业务逻辑层
API Routes 路由
语义解析引擎
Prompt 组装器
代码安全校验
Backend Logic
Layer 03
AI 服务层
DeepSeek LLM
z-ai-web-dev-sdk
对话补全接口
代码生成管道
AI Service
Layer 04
数据存储层
Prisma ORM
类型安全查询
模板库持久化
用户配置存储
Data Layer
tech-stack.config.ts
// 立方物理大模型 · 核心技术栈声明
export const TechStack = {
  framework: 'Next.js 15',     // SSR + RSC 混合渲染
  language: 'TypeScript 5.x'// 静态类型全链路覆盖
  styling:  'Tailwind CSS 4',  // 原子化 CSS 引擎
  components: 'shadcn/ui',    // 可定制 UI 组件系统
  ai:       'DeepSeek LLM',    // z-ai-web-dev-sdk 接入
  physics2d: 'Matter.js',     // 二维刚体物理引擎
  physics3d: 'Cannon.js',     // 三维物理模拟扩展
  render:   'Canvas / WebGL',  // 双渲染管线架构
  orm:     'Prisma',          // 类型安全数据访问层
} as const;

三大核心技术模块

物理引擎、可视化渲染、代码生成——三位一体,构成从自然语言到物理模拟的完整技术链路。

Module 01
物理引擎模块

负责物理现象的数学建模与数值计算。采用组件化设计,每个物理现象封装为独立计算单元,通过组合预置组件实现复杂场景模拟。

Matter.js 2D Cannon.js 3D Custom Solver
physics-engine/architecture.ts
// 组件化物理引擎架构
interface PhysicsComponent {
  compute(dt: number, state: State): State;
  reset(): void;
}

class PendulumComponent implements PhysicsComponent {
  private L: number; // 摆长
  private g = 9.81;  // 重力加速度
  compute(dt, s) {
    const α = -(this.g / this.L) * Math.sin(s.θ);
    return { ...s, ω: s.ω + α * dt, θ: s.θ + s.ω * dt };
  }
}

// 引擎组合器 — 像搭积木一样组合物理现象
const engine = composePhysics([
  new GravityComponent({ g: 9.81 }),
  new ElasticCollisionComponent({ e: 0.95 }),
  new PendulumComponent({ L: 2.0 }),
]);
Module 02
可视化渲染模块

将物理计算结果转化为直观的图形动画。双渲染管线架构,Canvas 处理常规场景,WebGL 承载高复杂度渲染任务。

HTML5 Canvas WebGL 60fps 目标
renderer/pipeline.ts
// 双管线渲染架构
class RenderPipeline {
  private canvas: HTMLCanvasElement;
  private ctx: CanvasRenderingContext2D;
  private fps = 60;

  render(physicsState: State[]) {
    this.ctx.clearRect(0, 0, w, h);
    physicsState.forEach(obj => {
      this.drawObject(obj);  // 物理对象绘制
      this.drawTrajectory(obj); // 轨迹线渲染
      this.drawFieldLines(obj); // 场线可视化
    });
    this.drawDataOverlay(); // 实时数据叠加层
  }

  // 自适应帧率控制
  private adaptiveLoop() {
    requestAnimationFrame(this.tick.bind(this));
  }
}
Module 03
代码生成模块

连接用户需求与物理模拟的桥梁。结构化 Prompt 工程 + 三重验证流水线,确保生成代码的质量与安全。

Prompt Engineering AST 校验 安全扫描
codegen/pipeline.ts
// 代码生成三重验证流水线
async function generateSimulation(input: string) {
  // Step 1: 语义解析 → 物理概念映射
  const concepts = await parsePhysicsConcepts(input);

  // Step 2: Prompt 组装 → 结构化模板填充
  const prompt = assemblePrompt({
    concepts, codeSpec, styleGuide, apiRefs
  });

  // Step 3: DeepSeek 代码生成
  const raw = await deepseek.chat(prompt);

  // Step 4: 三重验证
  await syntaxCheck(raw);   // ✓ AST 语法校验
  await securityScan(raw);  // ✓ 安全策略扫描
  await functionalTest(raw); // ✓ 沙箱功能测试

  return raw;
}

从自然语言到物理模拟

用户输入一句话,系统完成语义解析 → Prompt 组装 → AI 生成 → 三重验证 → 渲染呈现的全链路自动化。

1 自然语言输入 User Input
"模拟单摆运动,可以调节摆长和初始角度,显示实时速度和角度变化曲线"
2 语义解析 & 概念映射 NLP Parse
物理领域
力学
核心现象
单摆运动
可调参数
摆长, 角度
可视化需求
速度/角度曲线
3 Prompt 组装 & DeepSeek 生成 AI Generation
Structured Prompt Template
[SYSTEM] 你是一个物理模拟代码生成器...
[CONTEXT] 物理领域:力学 | 现象:单摆...
[CONSTRAINTS] 使用Canvas渲染 | 帧率60fps...
[USER] 模拟单摆运动,可调节摆长...
4 三重验证流水线 Validation
AST 语法校验

解析生成代码的抽象语法树,验证语法完整性、变量声明、类型一致性。

安全策略扫描

检测 XSS 注入、eval 滥用、非法 DOM 操作、外部资源引用等安全风险。

沙箱功能测试

在隔离沙箱环境中执行生成代码,验证物理模拟的基本功能和交互逻辑。

5 渲染呈现 & 交互就绪 Output
Interactive Simulation Ready

交互式物理模拟页面 · 参数控制面板 · 实时数据图表 · 结果导出功能

五大物理领域场景矩阵

覆盖从中学到大学阶段的典型物理实验场景,构建完整的物理学知识图谱。

物理领域
典型实验场景
力学
Mechanics
单摆运动弹簧振子斜面滑块碰撞实验抛体运动圆周运动刚体转动
电磁学
Electromagnetism
电场线分布磁场可视化电磁感应RLC 电路带电粒子运动
🔍
光学
Optics
光的反射折射薄透镜成像干涉衍射偏振现象光谱分析
🔥
热学
Thermodynamics
分子热运动理想气体状态方程热传导卡诺循环
🔬
近代物理
Modern Physics
光电效应波粒二象性原子结构相对论效应演示

四大技术创新点

01

AI 驱动物理教育新模式

首次将大语言模型的代码生成能力系统性应用于物理模拟领域,开创"自然语言 → 物理实验"的零门槛交互范式,颠覆传统物理教学工具的开发模式。

02

组件化物理引擎设计

每个物理现象封装为独立计算单元,通过组合器模式灵活装配复杂场景。在保证计算精度的同时,将 AI 代码生成的复杂度降低一个数量级。

03

三重验证代码流水线

AST 语法校验 + 安全策略扫描 + 沙箱功能测试,系统性解决 AI 生成代码可靠性不足的行业痛点,将生成代码的可用率提升至生产级水准。

04

纯浏览器端零服务器计算

所有物理模拟计算完全在客户端浏览器中运行,后端仅承担 AI 代码生成职责。大幅降低部署和运维成本,实现真正的"即开即用"体验。

四阶段开发路线

敏捷开发模式,以两周为迭代周期,16 周完成从架构搭建到正式上线的完整交付。

P1
基础架构搭建
第 1-4 周
Foundation
Next.js 15 项目框架搭建 & 开发规范建立
DeepSeek API (z-ai-web-dev-sdk) 集成测试
主页面布局 & shadcn/ui 定制化配置
自由落体技术原型验证(端到端流程)
P2
核心功能开发
第 5-10 周
Core Dev 主要攻坚期
Prompt 工程优化 & A/B 测试机制
Matter.js 集成 & 自定义物理计算模块
Canvas 渲染引擎 & 特效管线
三重验证机制 & 10+ 种模拟场景交付
P3
功能完善与优化
第 11-14 周
Polish
实时图表组件 & CSV/JSON 数据导出
预设模板库建设(30+ 场景)
渲染性能优化 & 页面加载 <3s
移动端适配 & 新手引导系统
P4
测试与上线
第 15-16 周
Launch
功能 / 性能 / 安全 / 兼容性全面测试
Beta 用户测试 & 反馈优化
用户手册 / API 文档 / 运维手册
生产环境部署 & 正式发布上线
项目总进度 16 Weeks · 4 Phases
P1 架构 P2 核心 P3 优化 P4 上线