Intro to Arboriculture



intro.arb

intro.arb




I spearheaded the HTML5 update to ISA's award-winning award-winning, interactive training series ("Intro to Arboriculture"), which was previously only available through CD-ROMs or in Flash format.

Image

Before I came to the project, the ISA had been struggling to update their legacy content. They had tasked a handful of instructional designers who failed to clean the Flash code. With proper planning and the right tools, I promised to have the ISA's entire online catalog updated in just three months time.

  The Old / Flash Version   

Anybody who has been in the e-learning space for a few years will immediately recognize the problem with the below screenshots. Although the legacy version of "Intro to Arboriculture" looked good enough, much of the code was written in non-functional Flash. The goal was to remove the flash from more than 800 individual lessons and introduce full mobile compatibility so that arborists could learn on the go.

Image

The original series -- written in Flash -- was a self-paced, highly interactive course to supplement the certification study guide. The lessons were designed for adult learners who cannot attend formal classes and nontraditional learners who respond best to visual, multi media, and hands-on teaching methods.


Image
This course is the same as the CD-ROM of the same title. CEUs can be earned from this product, even if you have already completed the CD-ROM.

  THE NEW / HTML5 Version   

We ported the series content to Articulate Rise — since the ISA already had a subscription to Articulate 360. The Flash imagery was converted using a macros script. The more difficult assets needed to be converted one file at a time.

Image

The new version of the series is available on desktop, laptop, and mobile devices. We considered assessible design with plenty of white space for those arborists who have vision issues. 


Image

The HTML5 version of the series combines text-learning with multimedia content: images, animation, audio, and online video. Inside each course users will find a variety of learning materials that have been designed to engage with a range of learning styles.


   Modern Feature Sets   
  • Responsive design available on desktop, mobile, and print
  • Instructional strategies that promote learning transfer
  • Completely searchable content to promote recall
  • High levels of interactivity and gamification
  • Self-paced instructional strategies
  • Intuitive navigation with clear orientation titles
  • A system of instant feedback that engages the learner
  • Quiz questions that simulate certification tests
  • Key terms with definitions and pronunciations
  • And much much more...
   Headers & Imagery   

With the new design came new and interesting imagery. Articulate Rise courses typically begin with splash images. I made new course headers for each module in the series.

Image
The course headers were modeled after the old content. I imported them into Photoshop and applied a subtle paintbrush effect in order to remove the .jpg artifacts from the origial files.

Image
Most of the old images were in .swf format. When we concerted them to .jpg or .png format, they looked pretty terrible. We had to get creative in order overcome quality concerns.

   Instructional Animations   
The most difficult part of the project — and the part that previous designers had struggled with — was the conversion of ISA's instructional animations. Almost all the animations were written in ActionScript1 (there were no tools available for quick conversion).
Image

The solution was simple enough. We used Camtasia Screen Recorder to capture each animation and then saved the files as animated gifs.

Image

It was important that we kept the originally imagery, since the project had a tight deadline. New images would have had to go through a round of peer-review with the ISA's subject matter experts.

   Project Management   

The "Intro to Arboriculture" update was a massive endeavor, and we needed to keep track of many moving parts. We used Microsoft Teams and Planner to keep everything on track. Updates were posted multiple times a day.

Image
Image
Image
   Final Form   

I am proud to announce that the old flash version of Intro to Arboriculture has been updated to HTML5 -- which means that all the courses are now compatible with Windows/Mac/Android/iOS/and all tablet and mobile devices. Arborists around the world are now able to access the new courses without suffering through problems concerning device incompatibility.

Image
Here's a shortlist of some of these features.
 
  • Intro 2.0 features 25 updated courses — covering topics from Safety, to Pruning, to Pest Control and much more. Each course features embedded games, knowledge checks, audio, video, and other fun activities.
  • Intro 2.0 is LMS compliment and can be easily exported to SCORM, AICC, & TinCan formats. It will not only work on our current LMS (Latitude Learning) but also on any compliment LMS on the market today.
  • Intro 2.0 now has eLearning tracking features — we can see how long students spend on each course, track their interaction with the content, and easily troubleshoot problem areas. We have integrated "back-end" analytics.
  • Being written to modern web standards, the new courses are easily updated — if we find bugs, misprints, or if we simply want to add new images/audio/or video — doing so is a point-and-a-click away.
  • Intro 2.0 can also be printed in PDF format for those arborists who prefer to learn on paper.
  • The new courses are easily translatable — all the buttons and interactive elements can be translated to any left-to-write reading language (including Spanish). Full text is exportable to XLIFF so that the courses can also be machine-translated.
  • Intro 2.0 has a beautiful redesign on all the course introduction pages — including new cover images (which can been seen in the image posted below).