Interactive Components

Centre for Teaching and Learning, Durham College

Interactive Components

This page demonstrates many different options to present content.

Adding these Components to your Content

The methods used to add these components to your course content varies slightly depending on the learning management system your institution uses. For demonstration purposes, here is how to add these components into a content page using the Brightspace learning management system.

To start, simply copy the embed code found below or use the Quiz Builder Tool to generate the code.

Then, using the “Insert Stuff” HTML editor tool (), you can embed it into your content page by selecting “Enter Embed Code” () from the list of options.

Here’s how in 3 easy steps:

Step 1 Click the “Copy Embed Code” Button found under the component you want to add.

Animation of what was outlined in Step 1

Step 2 Go to the content page you want to add the component to. Click on the “Insert Stuff” tool button.

Animation of what was outlined in Step 2

Step 3 Select the “Enter Embed Code” option. Paste the code “Embed Code” window. Click the “Next”, “Insert” and “Save and Close”.

Animation of what was outlined in Step 3

Practice Quiz Example

The image below is a preview of a multiple choice interactive practice activity. The interactive components in this resource are only functional in the downloaded course template.

Multiple Choice Question Example. Question with four radio options.

Question Types Available:

Multiple Choice
True/False
Multi-select
Reorder
Short Answer

Build Quiz:

Generate the code for this formative interactive activity using the Quiz Builder Tool available in the downloaded course template package.

Tabs Example

The image below is a preview of interactive organizational tabs. The interactive components in this resource are only functional in the downloaded course template.

Content Tabs Example. Organize content into multiple interactive tabs.

Accordion Example

The image below is a preview of interactive organizational accordions. The interactive components in this resource are only functional in the downloaded course template.

Accordion Example. Organize content into multiple interactive accordions.

Multiple Target Example

The image below is a preview of interactive multiple targets. The interactive components in this resource are only functional in the downloaded course template.

Multiple Target Example. Organize content into multiple targets.

Flip Cards Example

The image below is a preview of interactive flip cards. The interactive components in this resource are only functional in the downloaded course template.

Interactive Flip Cards Example. Grey cards are displayed containing a question or prompt on one side. When selected the card animates and flips over to reveal the answer, or reflection on the other side.