Page Types

Introduction:

Let’s first understand where ‘page types’ fall in the range of options available to instructors/authors.

First, LodeStar offers a number of templates.  The most popular template, ActivityMaker Mobile, contains a range of page types.  The ‘Text’ page type also supports a range of widgets.

So we have the concepts of templates, page types, and widgets.

This article is primarily focused on page types that are available in ActivityMaker Mobile, the Swiss Army Knife template.

 

Text

The default first page in the ActivityMaker template is the ‘Text’ page.  Text pages can hold styled text, images, embed codes, audio and widgets.

Text Pages feature the HTML editor, which supports basic formatting and a variety of tools.  The sprocket tool enables instructors to insert Widgets, which are interactive activities.

The link tool links to not only external web addresses but to internal LodeStar pages.  Authors are encouraged to fill in the ‘Page ID’ field to make linking to those pages easier.

 

Crossword

The Crossword page supports simple crosswords.  Authors add their own words and hints and then click on ‘Compile’.  The page compiles the crossword and display the hints when students click on the numbered squares.  Authors should keep crosswords limited to approximately ten words.

 

Flashcards

The Flashcard page supports an image and short answer.  It also supports Reg Ex (Regular expressions) for more complicated answer judging.  When students successfully answer a flashcard, the page gets removed from the ‘flow’.  Authors typically create a series of flashcards and use a starting ‘Gate’ page and an ending ‘Gate’ page to loop through the pages until a threshold is met (i.e 100% or 80%).  See Introduction to Gates.

 

Form

The Form page enables authors to create interactive forms.  This is a more complicated page type.  Check the ‘FAQ’ for a detailed article on how to create interactive forms and how to link form fields to long answer pages.

 

Gate

The Gate page controls program flow.  The Gate page can require students to score above a threshold in order to continue.  A passing score branches the student to the next section; a failing score branches the student to either a remedial section or resets the activities so that students must try again.  A series of gates can function as ‘if-then’ statements that are common in programming languages.  Gates can also reset activities.  Once students complete a multiple choice, for example, the activity is locked.  Gates can unlock activities.

 

Interactive Image

The Interactive Image supports click touch areas, drag and drop and hover-overs.  The Interactive Image page presents authors with a scale-able interactive image.  A grid overlay helps authors to identify either hot spots or drag and drop targets by entering their coordinates in a form.   The invisible hot spots scale with the image so that they are responsive to the screen size of the device.

 

Interview

The Interview Page presents the student with the image of the interviewer, a question and three choices.  The author can design the interview question to include the best answer, an acceptable answer and a wrong answer.   The relative merit of each answer is dependent on the meter value that matches each answer.  The answer choices can also provide students with specific feedback and, optionally, branch students to the next step in the interview or interaction.

 

Journal

The Journal Page collects all of the student’s long answer responses in the lesson and organizes them by heading on one page.  Instructors can request that students copy the entire Journal Page and submit it to an assignment folder, drop box or discussion thread.

 

Long Answer

The Long Answer Page prompts students for an open-ended response.  Instructors can scaffold a step-by-step analysis, for example,  by providing students with questions that they can respond to with long answers.  The Journal Page will collect all of the student’s long answer responses and display them on one page.   In some learning management systems, the responses will also appear in the SCORM report.  Please check with your LMS administrator for how to access your learning management system SCORM report.

 

Multiple Choice Question

The Multiple Choice Question Page displays a multiple choice or a multiple select question with up to seven distractors (options).  For a True/False question, instructors should use the first two answer fields and leave the remaining blank.  Students will see only the number of options that the instructor filled in.

The multiple choice answers can also be matched to feedback and to branch options. For example, a student answer can cause the program flow to jump to a remedial section.

By default, this page displays a multiple select question in which more than one answer can be chosen.  Authors can force a multiple choice question by selecting the appropriate check box.  Multiple select questions display check boxes; multiple choice questions display radio buttons.

In contrast, a Multiple Choice Widget on a text page can display one or more questions on a page.  See Multiple Choice Widget for more information.  Both Multiple Choice Widgets and Multiple Choice Questions are advantageous based on the objectives and the user experience that is being designed.  For example, multiple choice question pages focus the student on one question at a time with options for feedback and branching.

 

Organizer

The Organizer Page displays tiles that the student must order or organize.  The simplest use of Organizer is to order tiles by position.  For example, a question may ask students to order the following presidents:  Washington,  Reagan,  Carter,  and Roosevelt.  Washington would be assigned position 1.  Roosevelt, position 2.  Carter, position 3.  Reagan, position 4.  Students would be presented with a random order.  They would then drag the tiles left to right or top to bottom or a combination thereof to show their answer.

 

Report

The Report Page reports to the learning management system at the precise moment the page is displayed.  If the lesson contained many questions with assigned points, the Report Page would gather up the student scores and divide them by the total number of possible points.

The Report Page is functional once the lesson is exported and imported into the learning management system.  See Export.

Authors can use the page to add a message to the student.  The student score is automatically appended to the message.

 

Short Answer

The Short Answer page supports short answer questions.  Authors can require a precise match or allow for variations.  Short Answer supports regular expressions.  For example, the following expression  wash.*  will accept any answer that begins with ‘wash’.

 

Video

The Video Page supports embedding YouTube Videos and uploading short videos to the lesson.  Authors can copy a YouTube URL (found on the address bar) and paste it in the first field.   Lessons that include YouTube videos must be previewed in Firefox.  The full functionality of pause and play (as well as start and end times) will not work until the lesson is uploaded to the learning management system or placed on a server.

 

Wall

The Wall page walls off content and is usually placed toward the end of the lesson.  Some text pages, for example, might function as resources.  If they are not to be presented in the regular flow of the lesson but summoned as a resource, then the pages can be placed after a wall.   Authors can convert text pages to resource pages by checking off the ‘Resources’ checkbox.

 

Conclusion

Page Types combined with Widgets that display on Text Pages and branch options provide authors with innumerable options to engage students.  Each page in ActivityMaker Mobile also includes a help icon that will jog your memory on how the page is used.

 

 

 

 

 

 

 

 

 

Advertisements

Changing Theme and Layout

We recently received an email about an instructor who preferred the older look of ActivityMaker.  Since the release of LodeStar 7.2, ActivityMaker has been given much more functionality (See Widgets) and a minimal look and feel that suits the look and feel of D2L Brightspace  and other learning management systems.

But the default look and feel can be changed for some templates like ActivityMaker Mobile.  Instructors can change the Theme and they can change the Layout.

Follow these steps.

  1. In LodeStar 7.3, create a project in ActivityMaker Mobile.
  2. Save
  3. From the opened project, Select Tools > Themes.
  4. Change Theme.  In my example, I will select ‘Black’.
  5. Click on the Advanced button only if you want full control of the gradient on both the header and the footer (navigator).
  6. Click on the ‘Ok’ button.
  7. Click on “Preview” to see the change.
  8. Click on ‘Reload Page’. But not much is happening yet.  The layout needs to be changed as well.
  9. Close the Preview.
  10. Select Tools > Layouts.
  11. Select ‘Navigator-bottom’.  (Don’t select Default. We noticed a glitch.)
  12. If you want a tiled background, click on ‘Get Image’. Your image needs to be a small, repeatable tile.
  13. Click ‘Ok’
  14. Click on “Preview” and then ‘Reload Page”.
  15. You should now see a layout and theme that is similar to previous versions of ActivityMaker.
2018-08-22_1953

Before: ActivityMaker Mobile Project using Daylite Theme and Layout

2018-08-22_2007

After: ActivityMaker Mobile using Navigator-Bottom Layout and Black Theme

Using MediaSpace Videos

Embedding MediaSpace Videos

2017-01-04_2211

A Screenshot of a MediaSpace Video Linked to LodeStar ActivityMaker

Kaltura MediaSpace is a wonderful video portal, but linking to MediaSpace videos from LodeStar can be a little tricky.

The simplest — but not the most effective — way is to take the embed code that MediaSpace offers and paste it into LodeStar using the following tool in the LodeStar’s HTML editor.

2017-01-04_2118

This tool, located on the toolbar of the LodeStar HTML editor allows you to paste in an embed code that displays the video on the page.

The downside to this simple approach is that the video will not pause when the student turns the page.

The better approach requires a few steps. You’ll pull out your hair the first time, and find it second nature the second time.

Linking LodeStar’s Video Player with MediaSpace videos

The following steps apply only to mp4 files, which (at the time of this writing) is the only truly cross-browser video format.

Steps:

  1. Launch MediaSpace, and locate your video file.
  2. In MediaSpace, select ‘Publish’ from the Actions drop down menu. Publish your video or make it Unlisted.
  3. At the bottom of your screen, click on the ‘Share’ button and  display the embed code.

Here is a snippet from an example:

<iframe id=”kaltura_player” src=”https://cdnapisec.kaltura.com/p/812561/sp/81256100/embedIframeJs/uiconf_id/33140371/partner_id/812561?iframeembed=true&playerId=kaltura_player&entry_id=0_ugv87vgr&flashvars[mediaProtocol]=rtmp&….

Notice that two codes are bolded and underlined.  They represent the two pieces of information that you need:  the partner ID, and the entry ID.

2. Launch Kaltura’s kWidget from the link below.

http://player.kaltura.com/kWidget/tests/kWidget.getSources.html

You will see the following widget at the bottom of the page:

2017-01-04_2133

3.  Enter the partner ID from the embed code in the partner id field and enter in the entry ID in the entry ID field.  Click on get sources.

4. You will see the following heading, followed by video sources, the true addresses of the videos.

2017-01-04_2136

Notice the second source with the video src that ends with a.mp4

You’ll want to copy the  address into your clipboard beginning with http:// and ending with .mp4

5. Open your LodeStar ActivityMaker, ActivityMaker Mobile,  or ARMaker project or any template that is derived from ActivityMaker like PBLMaker or WebQuestMaker.

6. Add a Video Page (not Video Scenario).

7. Paste in the video source (src) in the top field, as pictured below

2017-01-04_2156

8. Preview your project to ensure that the video is properly linked.

Linking to a PDF

There are two ways to link a PDF (or any other web friendly file) to a LodeStar ActivityMaker page.  The first way involves copying the PDF to the root directory of the project so that PDF always remains with the project.  The second way involves linking to a PDF located anywhere on the public internet.

Linking to a local PDF file

Open or start an ActivityMaker project.  Every project has its own directory under LodeStar > Projects.  Copy the PDF to the root of that directory.  In my example I have a project named Demo_PDF.  In the screenshot, you will see that I have copied the pdf to the Demo_PDF directory. My pdf file is called GuitarTab.pdf.  It is not obvious, but note that the pdf file sits inside my Demo_PDF project directory.

 

2016-06-15_2139

Next, I click on the link icon in the HTML Editor toolbar on the ‘Text’ page.

2016-06-15_2153

In the URL field, type in the name of the PDF file.  In my case, I typed GuitarTab.pdf.  Type in a text to display to your students, as pictured below:

2016-06-15_2142

Click Ok.  To preview your work, click on Preview.  This will copy the address of the project to the clipboard.  Preview will not show the popup with your PDF.  To see this in action, launch Firefox, and paste in the project URL from the clipboard.  (If you previewed, the project URL is on the clipboard.)  Once your project loads, you can click on your link and see it work.

Linking to a PDF on the Public Internet

Follow all of the steps above, but instead of a filename as a URL paste in the complete address of the PDF on the internet.

See below for how either scenario should appear:

 

2016-06-15_2143

 

Controlling the Look and Feel of a Project

Introduction

The LodeStar eLearning authoring tool strikes a balance between author control over projects and ease of use. Many authoring tools provide pixel perfect control over every element. That’s fine for instructional designers, but faculty authors may need pre-configured templates, themes, project layouts and page layouts that will reduce their time commitment.

This article covers each of these configuration features starting with the most recent addition to LodeStar: layouts.

Layouts

The most popular LodeStar template, ActivityMaker, has a header, viewer and a navigator as well as a table of contents and resources divisions. The navigator, for example, holds the page forward and page back buttons. The viewer displays the content.

The layout of these divisions (div) can be changed. After the project is opened, the instructor can select Tools > Layouts. The dialog displays several layout presets. Some layouts are partially editable; others are not. A LodeStar project can look very different as a result of these layouts.

Default Layout:

ss1

Gamer Layout

ss2

Shadowbox Layout

ss3

Advanced tip: Instructors who have access to programmers or designers can customize a layout to their taste and can save the layout so that it is available to future projects.

The designer should follow these instructions:

Make a copy of the project’s layout folder. Zip up the folder and replace the .zip extension with .starlayout  Place the zipped up folder in /lodestar/app/Layouts. Give it a name that best represents the new layout. Restart LodeStar. The layout will now appear in the Layouts dialog.

Templates

Instructors will notice a number of templates displayed in the template viewer under the ‘Templates’ tab. Templates produce very different types of projects. EbookMaker. For example, assists instructors with creating eBooks that follow a common, open standard. But the most popular template is ActivityMaker, which gives instructors the most variety in activities that they can include in their online courses. ActivityMaker also gives instructors the greatest latitude in controlling themes and layouts.

Advanced tip: Instructors can use a project as the starting point for the next project. For example, an instructor who is producing a series of Webquests can create a project with a table of contents that includes the major parts of a WebQuest (i.e. Task, Process, Resources, Evaluation). Once these parts are set up, the instructor can zip up the project as a template and make this the new starting point. That is, a project with the major parts of a WebQuest already set up.

Instructors should:

Make a copy of the project folder. Optionally, change the description.htm and even the thumbnail.png to better represent the project as a template. Zip up the folder and replace the .zip extension with .star Place the zipped up folder in the /lodestar/app/Templates. Give it a name that represents the project. Restart LodeStar. The template will now appear in the template viewer.

Page Layouts

In ActivityMaker, each page layout supports a different type of activity. The ‘Text’ layout, for example, provides authors with a simple HTML editor. The ‘Text’ layout therefore supports the presentation of text and images. ActivityMaker also includes 19 other page layouts ranging from multiple choice questions, to long answers, crosswords, and other challenges.

Advanced tip: Instructors who have access to programmers – computer science students, perhaps – can have custom pages built with HTML, Javascript and CSS. LodeStar Learning offers a guide to the application programming interface (API) of ActivityMaker. Contact supportteam@LodeStarLearning.com for the JET API documentation.

Themes

Themes enable authors to control HTML background color, content page color, menu (outer) color and the colors of both the header and navigator. An advanced button enables authors to create their own gradations for both the header and navigator.

Advanced tip: Instructors who customize a theme to their taste can save the theme so that it is available to future projects.

Instructors should:

Make a copy of the project’s theme folder. Zip up the folder and replace the .zip extension with .startheme Place the zipped up folder in /lodestar/app/Themes. Give it a name that best represents the new theme. Restart LodeStar. The theme will now appear in the Theme dialog.

Conclusion

Oftentimes, instructors will want to focus on the content and not trouble themselves with customizing templates, themes, layouts and pages. Occasionally, a project will demand some level of customization. The LodeStar Authoring Tool offers presets for those occasions as well as an open architecture that enables someone with programming and/or design skills to construct his or her own themes, layouts and more.

Saving a Project

You may save an opened project at any time. There are four ways to save:

  • Option One: Select File > Save from the menu bar.
  • Option Two: Hold down the Control key (CTRL) and press ‘S’.
  • Option Three: Click on the button on the bottom right hand corner that resembles a diskette.
  • Option Four: Simply Preview your project.  The project will be automatically saved.

By default, LodeStar creates a directory titled ‘LodeStar’ in your user directory.  Under the LodeStar directory, you will find a Projects and an Exports directory (once you export a project). You can change this default setting by selecting Tools > Options. If there is more than one tab, select the ‘User Directory’ tab.  Type or paste in the path where you would like to create the LodeStar directory with its sub-directories.

When you save, LodeStar will merge your unique content with data elements that the template needs but you don‟t need to worry about the details because LodeStar takes care of this step automatically. If you were to copy the project directory to a web server and link to index.htm, your project will run on the web.  In other words, everything that is required to run your project on the web is self-contained in your project directory.

When you reopen your project at a later time, by selecting File and then choosing your recent project from the list, LodeStar finds your content automatically and loads it in. If you wish to get a fresh start, create another project from a template.

Exporting to Desire2Learn 9.0 or greater

Desire2Learn has improved its SCORM upload procedure in version 9.x. LodeStar users who have grown accustomed to the upload routine in earlier versions of Desire2Learn will now have to adjust to a new procedure for D2L 9.x. Here are the basic steps for importing a LodeStar resource into Desire2Learn.

Prepare your export to match D2L 9.x according to the following instructions:

Inside of LodeStar, do the following:

1. Open and complete your project

2. Click on the  Export button.

3.  Keep the default ‘SCORM 1.3 (Recommended)’ selected.

4. Pay attention to where LodeStar will save your export.  Typically this will be in [user folder]/LodeStar/Export

5. Click on ‘Create Export’ button.

Inside of D2L, do the following:

1.Go to your course.

2. Select ‘Edit Course’ (on the right hand side of the screen)

3. Select ‘Import/Export/Copy Components’ (on the left hand side of the screen)

4. Select the ‘Import Components’ radio button.  Select the ‘From a File’ radio button.

5. In the ‘What would you like to do?’ screen, click on the ‘Browse’ button and browse to the lodestar zip file in the exports folder.

6. Click Next. (Be patient. The upload process has started. You will see a progress bar at the bottom.)

7. D2L will now display the Preprocessing Progress at it completes reading the zip file (technically, the IMS content package). When you see green check marks, click on the ‘Next’ button.

8. You may leave ‘Do not overwrite the existing file’ selected if you wish. If you are re-uploading, you may want to select, ‘Overwrite the existing file.’ In either case, check ‘Import Metadata’.  Check, ‘Select All Components’. Click on the ‘Next’ button.
9. You will now see the ‘Confirm Import Selections’ screen. You should have ‘Import Metadata’ as selected. You should also have selected ‘Import all Items’.

10. D2L will now complete the import of this course material. When you see all green check marks, you can simply return to your content. Do this by clicking on the word ‘Content’ next to ‘Course Home’ rather than clicking on D2L’s link. Doing the latter causes confusion.

11. You should now see your imported LodeStar resource at the end of your course.

12. You can use the content manager to move the topic to another module.