Skip to Content
📧 Join the Teacharium waitlist to get access. 
User DocumentationSee It BuiltBuild a Chemistry Simulation

Build a Chemistry Simulation

What if your learners could pour chemicals, watch reactions happen, and learn from their mistakes — all inside a lesson? This project combines branching logic, custom widgets, and variables to build an acid-base titration simulation that responds to every learner action.

Try the lesson

This lesson is best viewed on a desktop or tablet computer.

Try it full screen →

How this simulation is built

The simulation tracks how much acid a learner adds to a base solution. As the amount changes, a custom widget updates the visual — color, bubbling, pH indicator — in real time. Adding too much acid triggers a branching path to an “overshoot” outcome; reaching the equivalence point triggers a success path.

Planning with variables

Before building any steps, the simulation variables are defined: volumeAdded, currentPH, reactionState. Every component and widget reads from or writes to these variables. Planning the variable schema upfront makes it easier to connect everything later.

Custom widgets for interactive visuals

The titration flask is a custom widget built in the Widget Builder. It accepts the volumeAdded and currentPH variables as inputs and renders an animated flask whose color and appearance change with the values. This kind of visual — one that updates continuously based on calculations — would be impossible with standard components but is straightforward to build as a custom widget.

Branching based on calculated values

The simulation uses Branching Logic controllers to route learners to different outcomes based on variable values. When currentPH drops below a threshold, the controller routes to the overshoot step. When it hits the target range, it routes to the success step. Learners experience consequences for their choices without the author having to manually wire every possible outcome.

Testing with the debug panel

Simulations are complex — it’s easy for a variable to be off by one or a condition to trigger at the wrong time. The Debug Panel (available in preview mode) shows all current variable values in real time as you interact with the lesson. This makes it straightforward to verify that variables are updating correctly and that branching conditions fire when expected.