Build interactions: Build interactions

Build interactions

Create a question type

PIE elements define how a question is edited, displayed and scored. You can adapt an existing element or build one that works with the same players.

Before building a new element

  1. Configure an existing element. Change its authored content or editor settings. Browse the library.
  2. Compose an item. Combine existing interaction elements in markup with one model per instance. Use the item player.
  3. Customize the application. Add a layout, tool or provider. See extension points.
  4. Create an interaction. Implement a new response behavior and its authoring view against the element contract.

Element development guides

How elements work

Models, responses, controllers and views.

Your first interaction

Define the data, scoring, delivery and editor for a new question type.

Test and distribute

Test an element and package it for the players.

How an element works

The model describes the question; the session holds the learner's response. A controller prepares the data for each mode and role, and can score the response. Delivery and authoring views use HTML custom elements, so they work across frontend frameworks.

An element package exports delivery, authoring and controller modules, plus an optional print view. The host and player communicate through the shared model and session contracts. View full diagram

The library includes React and Svelte implementations you can use as examples, including accessibility, validation and packaging.