eLearning Content Examples

Storyline

“Affirmative Action Basics”
link: https://alter-native-media.com/sl/aa-basics/story.html

Why I include this example:

This simple course started as a text-heavy PPT slideshow that was handed to me to create into eLearning for online deployment. I leveraged Storyline 360’s many various existing templates to add more interest, additional user interaction, and to ensure the content didn’t suffer from ‘death by PowerPoint’-ism.


“Guiding Team Through Change”
link: https://alter-native-media.com/sl/gyttc/story.html

Why I include this example:

This content came to me for vastly-needed update. Aspect ratio was changed from 4:3 to more of a 16:9; all images were refreshed; and extensive (programming) logic was revisited and reinvented, where needed. The content has extensive use of numerous variables and triggers which are constantly calculated based on user interaction to provide simple, color-coded feedback through the course.


“Multilanguage Microlearning Supplier”
link: https://alter-native-media.com/sl/lang-vids/story.html

Why I include this example:

I used this course to test Storyline’s ability to easily incorporate and implement various languages/localization. The core content was created to include custom triggers, enforcing learners to watch the intro video before moving on, as well as the freedom to jump between any of the subsequent videos at-will, and leverages Storyline 360’s improved video Closed Captioning. This main content scene was duplicated, renamed, and a translation file was generated where Portuguese was added, where applicable. The result is a simple course with custom triggers that was easily translated to another language.


Lectora

“CAL MSAF”
link: https://alter-native-media.com/lectora/cal/l8/

Why I include this example:

This bespoke training content is chock-full of event-based triggers, intricate branching navigation, multiple click-to-reveal interactions, state-based graphics, syched audio, captions, feedback popups, and utilizes an interactive navigation “ToC” menu that leverages external JavaScript / jQuery code.

Here is a sample of the custome ToC code:

$( document ).ready(function() {
   $('#cssmenu ul ul li:odd').addClass('odd');
   $('#cssmenu ul ul li:even').addClass('even');
   $('#cssmenu > ul > li > a').click(function() {
      $('#cssmenu li').removeClass('active');
      $(this).closest('li').addClass('active');
      var checkElement = $(this).next();
      if((checkElement.is('ul')) && (checkElement.is(':visible'))) {
         $(this).closest('li').removeClass('active');
         checkElement.slideUp('normal');
      }
      if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
         $('#cssmenu ul ul:visible').slideUp('normal');
         checkElement.slideDown('normal');
      }
      if($(this).closest('li').find('ul').children().length == 0) {
         return true;
      } else {
         return false;
      }
   });
});

“ToC Menu: Phonological Awareness”
link: https://alter-native-media.com/lectora/cli/

Why I include this example:

Given pre-existing content and previously-created layout, I created an interactive navigation “ToC” menu that leverages external JavaScript / jQuery code and includes custom icons to dynamically indicate visited states and video elements.


Presentations

I have also presented several insightful talks for the Lectora User Conference. Here’s one I gave in 2013 on how to extend Lectora for use on mobile devices with external libraries & scripts.

“Touch & GO: Quickly Enhancing Lectora for Gesture-Based Mobile Interaction”


Ember

“Acme Policy Acknowledgement”
link: https://alter-native-media.com/ember/acme/

Why I include this example:

Leveraging the open-source JavaScript web framework, Ember.js, this simple course demonstrates the ability to create elegant eLearning content and web apps using the Model–view–viewmodel (MVVM) framework. Customized style is handled via centralized .LESS code and various NPM plug-ins were used to create this content.


iSpring

“Nekro NomIcon: Story-Driven Mobile Game”
link: https://www.alter-native-media.com/nekro/

Why I include this example:

Originally created for the eLearning Guild’s DemoFest at the mLearning Conference 2016, this fun and playful homage to “Army of Darkness” character, Ash, was created with iSpring and pulls-off some pretty cool things, including an interactive FAQ section made with iSpring’s TalkMaster and an embedded 3D model that can be manipulated in real time, leveraging Sketchfab.


Unity

“Beechcraft C90 Flight Deck”
link: https://alter-native-media.com/3d/C90

Why I include this example:

This simple proof-of-concept shows-off the Beechcraft C90‘s interior flight deck and instrumentation. Created from various aircraft 3D models and photo references, it includes a custom avionics display, the 3D model was finalized in Autodesk’s Maya and uses Unity game engine for package deployment.


“HAL”
link: https://alter-native-media.com/3d/HAL

Why I include this example:

Originally included as part of a larger training for the US Air Force’s Air Force Medical Modeling and Simulation Training (AFMMAST) program, several Unity interactions were created to demonstrate proper installation and maintenance of 1 of 4 medical mannequins. I created each mannequin by extensively augmenting organic 3D models from the open source software, MakeHuman, editing in Maya, and using Unity for game-like learner interaction.


“Secure Office”
link: https://alter-native-media.com/3d/scif

Why I include this example:

Rudimentary user interactions – such as opening doors, climbing ladder, inspecting locks, doors, and ventilation system, and pause menu – was created by authoring succinct C# programming code within the Unity game development environment.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s