Skip to content

734496335/chiboshi

Repository files navigation

尺博士 · 动态量感沙盒 🦉

面向小学低/中年级(1-4年级)的趣味量感训练工具。通过**“视觉荒谬”制造认知冲突,结合 AI 动物导师“尺博士”(猫头鹰)的幽默引导,帮助学生建立长度、重量、容积、面积、体积、时间**六大维度的量感直觉。


🌟 核心教学理念与创新

1. “视觉荒谬”认知冲突教学法

传统的纸笔练习只用对错(红叉)反馈,缺乏尺度直观感。当学生在尺博士中填错单位时(如“铅笔长 18 米”),舞台区会动态绘制出一个比公交车还长的巨型铅笔与公交车并排展示,利用荒谬的戏剧冲突,让抽象数值化为具体的视觉冲击,引导学生发笑并主动纠错。

2. “造物小工坊”学生内容共创

打破静态教材限制,学生可以在小工坊里输入天马行空的物体名称(如“孙悟空的金箍棒”),AI 实时现场烘焙出一张 8 位艺术像素风格或温馨儿童手绘风格 of SVG 卡片并自动归入数据库。学生可直接将其拖入沙盒与普通物品进行等比物理比对,让学生从“消费者”转变为“创造者”。

3. “多模型热插拔”与纯国产 AI 技术栈

  • 文本大脑:底层抽象兼容 DeepSeek-V4、小米 MiMo、智谱 GLM、Kimi、通义千问等主流国产大模型,可在页面底部设置中心一键热切换,无须重启服务。
  • 生图算法:采用通义万相、即梦 AI、文心一格等国产 AI 生成生活实物卡通插图资产。
  • 开发工具:通过国产 AI 编程工具 Trae,以“自然语言大白话”的 Vibe Coding(氛围编程)范式开发完成。

🛠️ 技术栈

  • 前端/全栈Next.js 16 (App Router) + React 19 + TypeScript
  • 样式与动画TailwindCSS v4 + Framer Motion + Lottie
  • 手绘风绘制:Rough.js + Wired Elements (Web Components)
  • 大模型 API:兼容 OpenAI 规范的国产 LLM 接口(小米 MiMo / DeepSeek)

📂 项目结构与导航

核心文档(docs/

  • 安装手册.md — 系统运行与部署安装说明。
  • 使用手册.md — 系统功能操作与玩法说明。
  • 开发记录.md — 系统详细的开发技术实现记录。
  • PRODUCT.md — 完整的系统产品逻辑与六大维度对比策略。
  • DESIGN_BRIEF.md — 页面视觉 UI 风格标准与 Duolingo 儿童奶油色配色规范。
  • DEPLOY_TODO.md — 离线部署、图标资源本地化及构建优化待办清单。

核心代码结构

src/
├── app/
│   ├── page.tsx                    # 首页(三大玩法入口:沙盒、字典、工坊)
│   ├── play/[dimension]/           # 六大维度的各路由模块
│   │   ├── sandbox/                # 动态自由沙盒
│   │   └── dictionary/             # 极速量感字典
│   ├── dev/icons/                  # 造物小工坊
│   └── api/                        # 服务端 API 接口(AI语义解析/像素生成/模型配置)
├── components/
│   ├── VisualCompare.tsx           # 核心视觉对比渲染引擎(处理图标紧贴与等比缩放)
│   ├── FooterSettings.tsx          # 底部大模型参数一键配置中心
│   └── Mascot.tsx / OwlReaction    # 尺博士猫头鹰的情绪反应动画播放
└── lib/
    ├── deepseek.ts                 # 统一大模型 API 调用包装器
    ├── dictionary.ts               # 内置离线量感知识库数据
    └── references.ts               # 内置 60+ 种日常实物与参照物物理尺寸数据

🚀 本地开发与启动

1. 安装依赖

npm install

2. 配置环境变量

复制根目录下的 .env.local.example 到新创建的 .env.local 文件,并填写你的 API Key:

cp .env.local.example .env.local

3. 运行开发服务器

npm run dev

打开浏览器访问 http://localhost:3000 开始量感探险!


📢 AI 生成内容与合规声明

  • 本项目中的所有卡通人物、物品以及参照物插图资产均由 AI 生图工具辅助生成,并均在产品页面右下角清晰标注了“AI生成”。
  • 本项目中大模型生成的对话吐槽文案、参照物匹配推荐由国产大模型(DeepSeek-V4/MiMo)实时处理。

About

小学数学量感教学AI智能体“尺博士”

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

No releases published

Packages

 
 
 

Contributors