Skip to content

Repository files navigation

🌡️ ThermOS

A lesson-based virtual professor for ME22301 — Engineering Thermodynamics. Part of the Omega Mu Gamma Studio open-source engineering education toolkit.


📌 Overview

ThermOS is not a toolkit you open when a diagram stops making sense — it's the primary way a student comes to understand thermodynamics, for life, not just for an exam.

The project is currently mid-redesign, moving away from a module gallery (five standalone interactive tools you visit to poke at a concept you already sort-of understand) toward a lesson-based architecture built around a single governing philosophy:

"If you can't explain it simply, you don't understand it well enough."

ThermOS behaves like a genuinely good professor — one who never opens with the syllabus. It leads with why before how, tells stories, reaches for metaphors, and is honest with students about what actually matters. After finishing a lesson, the goal is for a student to feel like they've genuinely conquered something that used to intimidate them — not because of a slick 3D visualization, but because the understanding was delivered with enough narrative and honesty to stick.

Design constraints that follow directly from this philosophy:

  • Every lesson leads with a story or metaphor before any formalism.
  • Every lesson is honest about what's exam-critical, what's real-world relevant, and what's academic trivia.
  • Visualizations are never mandatory — they appear only where they genuinely aid understanding.
  • The screen itself carries emotional weight, with atmosphere reacting to the narrative rather than sitting static behind text.

ThermOS is part of Omega Mu Gamma Studio's growing suite of open-source engineering education tools, alongside SeeDS, Java-Chan, KMapX, EG Suite, GateLab, and ArchVisor.


🎯 Course Context

Field Details
Course Code ME22301
Course Name Engineering Thermodynamics
Department Mechanical Engineering
Credits L T P C — 3 1 0 4
Total Periods 60
Textbooks Nag P.K. — Engineering Thermodynamics (5th Ed.), Cengel & Boles — Thermodynamics: An Engineering Approach (8th Ed.)

🧭 The Lesson Anatomy

Every lesson follows the same repeatable skeleton — 5 mandatory beats plus 1 optional beat — delivered slide-by-slide, one deliberate "Next →" click at a time. This forces the student to sit with the story before they're allowed to reach the equation.

# Beat Purpose
1 Hook A real-world scene, historical moment, or vivid metaphor. Plants the feeling before the fact.
2 Itch The specific problem that was unsolvable without this concept — the "why do we even need this."
3 Concept The formal definition, derivation, or diagram — delivered after the student already wants it.
4 Honesty Pass An explicit, tagged breakdown of what's exam-critical, real-world relevant, or trivia.
5 Echo The real-world impact of the idea, plus an interactive visualization if and only if one earns its place.
6 Check Yourself (optional) A quick, non-blocking self-test. Never gates progression.

Within the Hook and Itch beats, content breaks down further into Scenes — smaller narrative chunks, each carrying its own emotional mood, revealed progressively.


✍️ Content Authoring — MDX

Lesson content is authored in MDX (Markdown + embedded JSX) rather than JSON or hand-coded JSX components — prose beats read like actual writing, and Concept/Echo beats can drop a live diagram or slider directly into the prose at the exact point the story needs it. No backend, no CMS, just files in the repo.

---
title: "The Zeroth Law"
unit: 1
tags: [exam-critical, real-world]
---

<Scene mood="curious">
Imagine you've got three objects on a table: a mug of tea, a metal
spoon, and the wooden table itself. Which one is "hot"? Which is
"cold"? You'd assume the answer depends on the object. It doesn't.
</Scene>

<Scene mood="revelation">
It depends only on whether heat is currently flowing between them —
and that single, almost embarrassingly obvious idea took physicists
until after the First and Second Laws to formally name.
</Scene>

Each <Scene mood="..."> block is the atomic authoring unit — it drives both the progressive text reveal and the background atmosphere transition from a single tag.


📚 Syllabus → Lesson Map

ME22301's 60 periods across 5 units are mapped onto roughly 20 focused lessons, each a single sit-down session:

  • Unit I — Basics, Zeroth & First Law (4 lessons): systems & boundaries, equilibrium & properties, the Zeroth Law, the First Law
  • Unit II — Second Law & Entropy (5 lessons): heat engines/refrigerators/heat pumps, the Second Law, the Carnot Cycle, entropy (parts I & II)
  • Unit III — Properties of Pure Substances (4 lessons): steam's phase behavior, reading p-v/p-T/T-v/T-s/h-s charts, dryness fraction, steam tables & the Mollier chart
  • Unit IV — Ideal & Real Gases (4 lessons): the ideal gas, where the ideal-gas assumption breaks, Maxwell relations & TdS equations, Joule-Thomson & Clausius-Clapeyron
  • Unit V — Psychrometry (4 lessons): humidity as a survival problem, the psychrometric chart, psychrometric processes

(Unit ordering — whether entropy is front-loaded or treated as a "boss level" — is still an open discussion.)


🚦 The Honesty Pass

Every concept inside a lesson is tagged with a small inline chip:

  • 🔴 Exam-critical — you will be tested on this, know it cold
  • 🟢 Real-world/career — what practicing mechanical engineers actually touch
  • Academic trivia — professors love it, you'll rarely use it again

This is the philosophy's centerpiece: being upfront about what's not worth a student's anxiety, not just what is.


🌗 Atmosphere Engine

The screen carries emotional weight, reacting to the narrative's tone rather than sitting static behind text. Each <Scene mood="..."> tag drives a global AtmosphereLayer sitting behind the lesson player — crossing from one Scene to the next triggers a smooth crossfade of background color, light, and motion into the new mood (curious, foreboding, grief, revelation, triumph, focus, wonder). Implementation is CSS-variable driven and crossfaded via Framer Motion, paired with a lightweight canvas particle field — deliberately not Three.js, so it stays cheap enough to run behind every single lesson.


🔭 Visualizations

No visualization is forced into a lesson — each earns its place. Existing engines and visualization components from the module-gallery era (PVT Explorer, Cycle Builder, Energy Balancer, Entropy Visualizer, Property Solver) carry over, restyled as embeddable Echo-beat components, alongside new pieces built specifically for concepts that had no visualization before: a System Boundary Sketcher, a Thermal Handshake, a P-V Work Area, the Energy Mover, a Quality Slider, a Compressibility Playground, a Throttling Valve Animator, and a Psychrometric Navigator.

All existing calculation engines and NIST-sourced data files carry over unchanged.


🏗️ Architecture

The redesign restructures around Unit → Lesson → LessonPlayer, replacing the old Home → pick a module → standalone tool navigation model. A lesson is content, not code — adding lesson #21 should mean writing an .mdx file, not touching LessonPlayer.jsx.

src/
├── content/                  # units + lessons (.mdx), the new heart of the app
├── components/
│   ├── lesson-player/        # LessonPlayer, ProgressDots, AtmosphereLayer, beats/
│   ├── visualizations/       # reusable Echo-beat visual components
│   └── shell/                # TopBar, Layout
├── engines/                   # pure-JS calculation engines (existing + new)
├── data/                      # NIST-sourced property data
├── store/                     # progressStore, uiStore
└── pages/                     # Home (unit map), UnitPage, LessonPage

🛠️ Tech Stack

Layer Technology
Framework React 19 + Vite
State Zustand 5
Styling Tailwind CSS 4
Animation Framer Motion 12
Content MDX (@mdx-js/rollup)
Routing React Router v7
3D @react-three/fiber + drei (reserved for PVT Explorer)
2D charts/diagrams D3.js 7
Schematics/drag Konva.js + react-konva
Ambient particles Lightweight canvas (no Three.js)
Data JSON, NIST-sourced
Deployment Vercel

📈 Progress & Testing

Progression is never gated — a student can always click Next through every beat. Check Yourself, the optional sixth beat, offers a quick self-test whose results feed progressStore quietly without blocking anything. Gamification is deliberately light: per-unit completion badges and a satisfying "Unit Cleared" moment, no XP or points — the "conquered the world" feeling should come from genuine understanding, not a dopamine mechanic.


🚧 Status

Pre-development redesign. The module-based architecture is being scrapped in favor of the lesson-based one described above. Open questions include unit ordering, a locked tone/voice guide for lesson prose, and the Home/Unit page visual design — the next design conversation once lesson content itself is underway.


📄 License

Part of the Omega Mu Gamma Studio educational toolkit.