Image Tool including the Protractor and Ruler – Learnosity Author Guide

Description

The Image Tool feature in Learnosity allows authors to add rulers and protractors to a Question stimulus, or include their own custom images as interactive tools.

Students can easily interact with image tools by dragging and rotating them.

The ruler and protractor appear as draggable, semi-transparent objects that students can use to measure lengths or angles of other images displayed within the question or item.

Like the calculator, the protractor and ruler are accessed through a button available to the learner; clicking the button displays the selected tool.

Figure 1 - Ruler with the 'rotate' button.

Figure 2 - Protractor with the 'rotate' button.

Adding Ruler as a standalone Feature to Items

To add a ruler to an Item, create the Item as you normally would. Then, in the Features section of the Question Editor templates, select Ruler override.

There is a set of default Rulers available in Learnosity, featuring rulers of different sizes, with inch or centimetre measurements. When the feature is selected, the Ruler type can be specified in the Image URL field.

For this, enter any of the following Ruler types into the Image URL box:

ruler-15cm-72dpi
ruler-30cm-72dpi
ruler-6in-72dpi
ruler-12in-72dpi
ruler-6in-15cm-72dpi
ruler-12in-30cm-72dpi

DPI refers to "dots per inch" and is a setting you can choose when exporting images from many graphic design software applications. Make sure to test the Ruler against the image you upload, to make sure that the Ruler matches your image. We provide 72dpi and 96dpi choices and make the ruler-15cm-72dpi as default.

The selected Ruler will be displayed in the Preview section.

The following four options are deprecated but are still supported currently:

ruler-15-cm
ruler-30-cm
ruler-6-inches
ruler-12-inches

The Show rotate icon option allows students to rotate the Ruler.

When the Button is enabled, the Ruler will only appear when the student clicks on the button. The button image can also be specified. Simply entering "ruler" into the Button icon field will display a ruler icon. Custom icons can also be used. Click Edit to upload or embed your image.

Authors can also change the button label by entering text into the Label field.

In the Image alternative text box, provide alternative text that describes the Ruler for accessibility and screen readers.

Adding Protractor as a standalone Feature to Items

To add a protractor to an Item, create the Item as you normally would. Then, in the Features section of the Question Editor templates, select Protractor.

When the Protractor feature is selected the protractor will be simply displayed in the Preview section.

There are several options that can be specified for protractors:

Image alternative text - Authors can add alternative text that describes the Protractor for accessibility and screen readers.
Show rotate icon - When enabled it will allow students to rotate the protractor.
Button - Protractor will only appear when the student clicks on the button.
Button Icon and Label can be changed for protractors, the same way it can be changed for rulers.

Adding Image Tool as a standalone Feature to Items

Selecting a custom Image Tool allows authors to use their own image as a Feature and allow students to interact with it.

To add Image Tool to an Item:

Create an Item as you normally would, and from the Features section of the Question Editor templates, select Imagetool.
Upload Imagetool - Underneath Image URL, click on +ADD. A modal will appear to upload the image. You can upload image in three ways:
- Drag your image file to the Drag and drop window.
- Click the Drag and drop image, select an image from your computer, then click OK.
- Under More options, insert the image URL into the respective field, then click OK.
In the Image alternative text box, provide alternative text that describes the image for accessibility and screen readers.
You can also specify the size of the image: insert values in pixels into the Width and Height fields.
Enable Button to display custom images as button. The image will only appear when students click on the button.
In the Label field, update the label text that will appear to learners on the button; by default, the label Image Tool is provided.
For the Button Icon, authors can add an image icon that will appear to learners as button for the Image Tool.
Enable Show rotate icon to allow students to rotate the image.

Adding a Protector as a Simple Feature to Questions

To add a protractor as a Simple Feature in your Question, begin by editing the Question where you want the tool to appear. Place your cursor in the Question composing area. In the rich text editor toolbar at the top of the screen, click the Simple Feature button.

Simple Features icon in the rich text toolbar.png

Figure 3 - Simple Features icon in the rich text toolbar.

The Simple Feature panel will appear.

Simple Feature protector option screen.png

Figure 4 - Simple Feature protector option screen.

Select Protractor from the left-hand menu.
In the Label field, update the label text that will appear to learners on the button; by default, the label Protractor is provided.
In the Image alternative text box, update the descriptive text; by default, A 180-degree standard protractor. is provided.
Use the Show rotate icon checkbox to enable or disable the rotate icon for the Protractor; by default, the rotate icon is enabled.
Use the Preview section to review how the Protractor will appear to learners.
Click OK to add the Protractor as a Simple Feature in your Question.

Adding a Ruler as a Simple Feature to Questions

To add a ruler as a Simple Feature in your Question, begin by editing the Question where you want the tool to appear. Place your cursor in the Question composing area. In the rich text editor toolbar at the top of the screen, click the Simple Feature button.

Simple Features icon in the rich text toolbar.png

Figure 5 - Simple Features icon in the rich text toolbar.