STS Blog

The Work Management Process is an initiative of one of our clients to standardize the process of work identification, planning, and completion at power plants the Company owns and operates. This process aims to transition work activities at power plants from a reactive to a planned mode, thereby improving asset reliability and lowering costs.

The purpose of this training is to present an overview of the Work Management Process either as a refresher for existing employees or as an introduction for new employees.

The training is broken down into six lessons, each of which correspond to a particular step within the Work Management “Wheel.”  Unlike a training course delivered via a learning management system, this training is completely open-ended so learners are free to explore and learn at their own pace.

Although this training is open-ended, some managers wanted their employees’ progress  to be tracked to test their mastery of the content.  Learners can directly link to a short quiz stored within an online learning management system from the Work Management Process Training site.

Goals and Objectives

The original Work Management Process Training existed as a 180-page document that learners had to read.  Once our Technical Communications project team got our hands on that, we all recognized that we had an opportunity to create a unique eLearning experience from this training.

The primary goal of the training site is to create an interactive, online resource that employees can visit to learn about the Work Management Process.  Using a simple design, contextual links and actions, drill-down exploration of content, and leveraging interactive learning experiences, our training site easily stands out as a technology-based learning site unlike any other training initiatives we have created in the past.

The objective of this training is to promote and encourage learners to “explore the content” rather than simply read it. Many learners have become too accustomed to reading through text-heavy documents and diagrams, which can detract from the learning experience. We set out to create an engaging and immersive learning experience that would change the way our employees viewed eLearning, and based on the positive feedback this training has generated within all levels of the company, we would like to think we have succeeded.

Design Theory

The graphical user interface for this training was developed progressively over the course of a series of design review sessions. In an effort to make this training the first of its kind for our client, we decided to use a bold UI design that would capture the learner’s attention and stand out in their minds from the typical text-heavy, online training modules that they have seen for the past decade. Pulling design theories from software user interfaces, our UI aims to make navigation intuitive, thus simplifying learner actions.

The Work Management Process Training was built by deploying custom code and content onto a Microsoft SharePoint site. Since SharePoint has the ability to integrate with many types of content, we found it advantageous to use it as the platform for our backend. The build process was relatively simple and straightforward — custom CSS code was applied to the existing SharePoint template and then an assorted set of content was added to each page, including Flash interactions, Captivate movies, and custom Javascript functionality.

Figure 1: The Work Planning lesson within the Work Management Process Training site

Our goal was to attain a clean and simple “web 2.0” visual style in this interface.  We achieved this through the marriage of custom code and graphics with the simplicity and flexibility offered by SharePoint. Through our modifications to the backend and our design of the user interface, we created a smooth and visually appealing interface.

Success through teamwork

One of the most successful elements of this project was the dynamic that our project team shared. With a small project team, we found that having a solid plan of attack would be paramount in making forward progress and meeting our deadlines. Before development began, we created a role-based division of labor which would allow us to work effectively in our areas of expertise.

Using this approach, we adapted an agile development method, focusing heavily on collaboration, constantly adapting our design. Throughout the project life-cycle we had at least one design meeting per week, and this allowed us to openly share our work, obtain feedback and criticism, and to brainstorm ways of approaching and overcoming various challenges. We set many short milestones for our team over the course of the project, typically lasting one to two weeks. After each milestone, we held a meeting to present and review our deliverables and determine if we needed to adapt our design to technical limitations, design flaws, or inconsistent learning experiences.

Technical challenges

With innovation comes technical challenges and creating this training had its share of obstacles. The first 3 months of this project were spent on rapid prototyping in Flash and SharePoint and for the remaining 6 months, we were in an agile development mode, constantly building and revising along the way. Most of the technical challenges came within the latter portion of the project life-cycle, as we were rethinking the designs used in our beta prototype. For example, one large challenge we faced was selecting how to best present the content of the training to the learners.

In our first prototype, we tried to make the content more aesthetically pleasing by turning it into a series of images which we turned into a slideshow using simple Flash interactions, but this method made it too difficult to edit the content and too difficult to maintain via Photoshop and Flash.

Figure 2: Content delivered through Flash in the beta prototype

The failures that we encountered throughout this project’s life-cycle only made it easier for us to adapt to the problem and find innovative solutions to bridge the next gap. In our next prototype, we took the content, dropped it into a PowerPoint presentation, and exported it as an MHTML file, which was then embedded within the SharePoint page. This method made it much easier for content maintenance and allowed our content to look however we wanted it to, but since the presentation was scaled down drastically to fit within the space we had, it was impractical for us to include any interactive elements.

Figure 3: An embedded PowerPoint presentation in the training site.

We spent a lot of time in design meetings discussing how to best approach this challenge and how to find a good middlegroud – we needed something that was easy to maintain yet visually appealing and allowed for interactivity.

Figure 4: The final lightbox version of how we display content.

In our final prototype, we achieved the balance of aesthetic and functionality by putting our content into a Captivate movie. We displayed the content in a series of slides, interspersed with quizzes, and also included other interactive elements to enhance the learning experience and boost retention. Additionally, to overcome the constraints of embedding the content directly into the SharePoint page, we built a “lightbox” by modifying third-party code, which could open a separate layer over the current site and play a Captivate movie, giving us the learner’s entire screen to display information.

An interactive approach

The Work Management Process itself has numerous process flow diagrams within it, since each part of the process has a series of steps that must be followed to complete it. Instead of simply placing the image of the process flow in the content on the training site, we thought that this would be a good opportunity to use interactivity to bring a static image to life.

Figure 5: The Process Flow Viewer promotes learning through interactive, drill-down learning.

After many prototypes and putting a lot of thought into both the interactive design and the instructional design, we created the “process flow viewer.” This interactive process flow takes the simple image of the process flow and lets the learner overlay information on top of it, such as what steps of the process flow apply to them based on their job role. This activity also allows learners to engage in drill down learning – each step within the process flow can be clicked to learn more about that step in detail. Learners can also play a simulated walkthrough of the process flow, allowing them to see the process flow in action.

The process flow viewer can be launched from the menu of a lesson or while viewing the content itself.  In both cases, it launches in a separate window so as to not interrupt the main navigation, allowing learners to view the content and the process flow side-by-side if they are using a dual monitor setup.

Tell Someone About This Post:

If you’ve just started using Captivate, the best advice I can give is the kind that should be printed in big, friendly letters on the front of every technology-related reference guide or manual… DON’T PANIC.  While there are a million and one reasons to use our favorite demo/presentation/simulation software, there are a few issues that you are inevitably going to have to deal with.  In the past I’ve written about consistent, reproducible errors that I’ve had to work around, but once in a while I run into something entirely new and unpredictable.

After recording a demo today, I went back into the project to edit the auto-generated captions.  I checked the “Apply To All” options and then changed the caption style from Adobe Blue to Haloblue.  The default text size for both caption styles is 12 pts, but when I clicked OK, it changed all caption text to the Haloblue style… at 16 pts.

I undid the change, re-tried it on the same caption, and saw the same behavior.  After closing and re-opening Captivate, I could no longer replicate the issue.

So don’t panic.  Always reboot first.

Tell Someone About This Post:

Howdy folks! Hope all has been well since our last exciting installment in our ongoing Captivate entomology series.

Since my last post back in May, I’ve had the mixed experience of upgrading to the latest version of my *favorite* software package in the world. I would be ready to give our faithful readers a full run-down of the new features and enhancements in v.3, if it weren’t for the fact that I’ve been tied up troubleshooting what I considered to be a show-stopping issue with the new version: an apparent inability to capture full-motion recordings.

For the uninitiated, Captivate creates animations by snapping screenshots, stringing them together, and then animating mouse movements and typing actions over those captures. Since this approach does not work for things like scrolling and drag-and-drop operations, Captivate documents those types of actions by creating full-motion SWF recordings for the duration of the scrolling or dragging movement. But I found that this was not the case after upgrading. I was unable to capture full motion with version 3, no matter how hard I tried. Naturally, I tried reinstalling the software at first, and when that didn’t work, I followed all the recommended troubleshooting steps:

• Tested with hardware acceleration disabled and then enabled – no dice either way. Everything that did not require full motion was captured perfectly, though.
• Tried forcing full motion during a capture session using the F9 and F10 hotkeys… useless. Same results as above.
• I even tried switching Captivate to Full-Motion Recording mode for the entire capture session. This left me with a single screenshot on a single slide… no full-motion slides.

Having exhausted all my options, I proceeded to pull my hair out for a few hours while scanning the Captivate forums on the Adobe site for issues similar to mine. While I didn’t find anything useful regarding my full-motion recording issue, I did see a lot of posts about a bug caused by the latest Captivate update where clicking into a text caption with formatted text would cause the caption to either lose all formatting or apply the formatting to the entire caption text.  Notice how the one below lost both the bold and italic formatting when I clicked in to edit it:

Since this was caused by the latest update, I decided to reinstall and then stop the update process to see if that would resolve the issue.  It fixed both problems!  Without the update, I was again able to create full-motion recordings and edit captions without having to re-format them. But there’s a catch… Captivate does not allow you to turn off the updater, nor does it prompt you before downloading and installing.

Well, that didn’t stop me. You can easily hack your way around this issue by opening the Captivate folder inside your computer’s Program Files folder (usually C:\Program Files\Adobe\Adobe Captivate 3\) and destroying the updater library (AdobeUpdater.dll). Just make sure you keep an eye out for the next update, which should correct the text formatting and full-motion recording issues. I’m not sure if they can be applied manually – if not, we will all need to reinstall Captivate to add the updater back.

Hope it helps!

Tell Someone About This Post:

Don’t have much time to spend on this post today but I thought I would put something up regarding some Captivate bugs that I’ve experienced recently, and how I’ve worked either with them or around them:

Click boxes that can’t do simple math

Captivate click boxes give you the ability to specify an action to perform when a user clicks outside of the box a certain number of times. While building a quiz-type activity, I thought this would be a good way to invoke an error message whenever the student clicked on not-the-right-answer enough times (I set it to 2 times). The error message would then take the student back to the start of the activity to try again. Well, it worked, except that after getting a wrong answer on the first slide and cycling back through to the same slide, the click box reacted to clicking on not-the-right-answer a single time (instead of twice, like I specified in the click box’s properties). I haven’t figured out how to work around this – if you did, tell me about it in the comments!

Control strips that refuse to leave

A while ago, I put up a post recommending the use of a control strip to speed up the debug process for a Captivate project. In retrospect, didn’t that seem too easy? It probably was… I have tested a few projects since then, and I’ve found that one of my presentations simply refuses to relinquish its control strip. I tried disabling it in the Skin Editor, but the only thing I accomplished with that was to make Captivate behave unpredictably in terms of rendering the presentation.

Sometimes it would include a full control strip, and sometimes it would render the project with a blank gray area over where the strip should be, regardless of the settings specified in the Skin Editor menu.

I’m not too happy to report that the only work-around I’ve found for this is to re-activate the control strip, disable all the controls on the strip, and then deactivate the strip again so that Captivate decides to include it during rendering, all the user sees is a blank gray space with an Info button.

Anyway, that’s it for the bug report. Expect to hear from me again during the next few days as I document my upgrade to Captivate 3 – I know I’m way behind on this, but unfortunately I have to work with whatever the client provides. Anyway, I am looking forward to trading out all of the little quirks that I’ve gotten used to for a whole new set of bugs… bring ‘em on, and stay tuned!

Tell Someone About This Post:

The client that I currently work for requires all employees and contractors to be available on a proprietary instant messaging system at all times during working hours.

Unfortunately, mixing Captivate and instant messaging programs can cause issues with the auto-labeling feature during your capture sessions:

Not only can it get annoying when your captured slides show a callout for every time that you received a message, I’ve also found that Captivate 2 has a nasty tendency to crash about 50% of the times that an instant message comes in – this has cost me hours in terms of lost time and effort, so watch out! Of course, there’s no good way to tell if the issue is due to Captivate or the instant messaging app, but I suspect both of them are contributing. I’ve found a good number of confirmed bugs in Captivate when it runs by itself.

I now make a habit (with my manager’s approval) of “dropping off the radar” and shutting off all applications whenever I am about to capture a Captivate simulation. I suggest you do the same.

And hey, by shutting off Outlook you might just discover how much you enjoy ignoring e-mails.

Tell Someone About This Post:

eLearning Weekly has a love/hate relationship with Captivate. It’s fun to read about it, especially since they point out workarounds that might save me some time.

Mobilemind also has some tips on how to avoid breaking SCORM when using Captivate.

Ah… nothing is as beautiful as the majestic Captivate bug in its natural habitat!

Here’s a few other things I’ve learned about this wonderful tool (version 2 in particular):

• Don’ t waste your time trying to double up elements (imate-text, image-image, or text-text) on the same area. It confuses Captivate and just doesn’t work.
• Be careful (and do looots of testing) if you use lots of click boxes on the same slide… they tend to mess up when there are more than one or two.
• If you need to import an animation, turn it into a .swf beforehand to avoid problems. In the past, I’ve tried to use animated .gifs with mixed results.
• Run Captivate by itself – kill as many other applications and processes as you can to avoid crashes (iTunesHelper.exe is not an essential operating system process). Save your work often. Even though you should be doing both of these things already, it’s especially important when working with The Cap.

Stay tuned… I work with this beast on an almost daily basis so I’m sure there will be more tips coming!

[Picture of leaf-cutters by mariandy_gizfel.]

Tell Someone About This Post:

My current Shoap Technical Services assignment requires me to work with Captivate extensively. We use the tool to create walk-throughs of new systems and software, as well as web-based training packages that students can study independently, and at their own pace.

Normally, we’ll build the courses so that course navigation is part of the standard slide template that we use, like so:

This is handy since we like that students can skip back and forth through the slides, but the controls dissappear whenever a video simulation is shown… this way we keep students from skipping forward through the simulation and they have to at least pretend to watch it. This is great for course delivery, however if you are the person creating the slides and debugging the course, it can get very tedious and very boring, very quickly.

The solution is quite simple, even though it took me months to think of it.

Since Captivate allows you to “skin” your presentations with some pre-defined controls, I use the skin feature to my advantage.

Selecting Project > Skin… brings up the Skin Editor. I’m pretty sure you can guess what that does.

Clicking the checkbox next to Show playback control enables the skin – it will be shown over your presentation when you publish it. You can also use the Skin Editor to choose on which side of the presentation you would like the playback controls to be shown.

Now, when you render the presentation, it will have a nice control strip laid over the selected portion of the presentation.

I use this method when I publish presentations that I am going to review. Clicking and dragging the marker on the progress bar gives me an easy way to navigate through the simulations looking for spelling errors, issues with callouts fading in and out (or not doing it), timing problems, inappropriate mouse click sounds, and so on. And this way, it doesn’t take foreeeever.

Note: I used Captivate 2 for this article since it is what I currently have to work with. If you have a spare license for version 3 that they you don’t need for some reason, shoot me an e-mail ASAP! I’d love to take it off your hands…

Tell Someone About This Post: