Skip to main content
Explorations and apps

Animations and simulations

Put a working model into a worksheet: students change one condition with its own sliders and buttons and watch what happens, from wave interference to a market moving to a new equilibrium.

When to use it

An interactive artifact is an HTML page that runs inside the worksheet. Use it when the idea is about change, which a still picture cannot show: two waves adding up or cancelling out, a planet speeding up and slowing down on an elliptical orbit, the equilibrium price moving when demand grows.

It works in any subject. The model can be one you wrote, one a colleague shared, or one an AI assistant built for you.

Adding a model

  1. In a worksheet, use the + between two items and choose Interactive artifact.

  2. The editor opens with the HTML source on the left and the Live preview on the right. Paste the page's code into HTML source, or click Upload HTML file and choose a single .html file of up to 2 MB.

  3. Write a title at the top. Changes are saved as you go, and the status next to the buttons shows Saved.

  4. Try the model in the Live preview, then click Close and click the tick.

To change it later, click the pencil and then Edit HTML. Uploading a new file replaces the current code, so Praktikal asks first.

What students do

Students use the model where it sits in the worksheet, with whatever controls it has: they move a slider, press start or pause, and watch the result. If the item is shown closed, they first click Open interactive content.

An ordinary model saves nothing: what a student changes is not recorded, and opening the page again starts the model from the beginning.

Tips

  • One model per idea. In the example, the waves, the orbit and the market are three separate items in three worksheets.

  • Keep the page self-contained. Scripts and styles must be inside the file or come from jsDelivr, cdnjs or unpkg, and the page cannot load data from other websites. Images from https addresses do work.

  • Give students a question to explore, for example what happens to the equilibrium when demand rises, rather than leaving them to play.

  • If the page is built to report answers, the item shows Answerable while you edit it. It then collects students' answers like a question, and they appear in Results.