Archive for the Tips and Tricks Category

Build a better login simulation

Lately, I’ve seen some awkward attempts at simulating a text field/activation button combination, such as one would find on a login page. On one such web page, the user types data in a couple of fields and then either presses Enter or clicks a button. I’ve seen some people develop three separate slides for this and use incorrect keys to proceed, actually training users to do something in simulation they would not do in a real system. You can simulate it accurately and all in one slide if you set up your Captivate interactions as follows:

  1. Put a Text Entry Box over the first field and instruct users to continue by pressing the Tab key (e.g. “Type me@me.com in the Email field, and then press Tab“). In the Text Entry Box’s properties, assign the Tab key to continue.
  2. Put a Text Entry Box over the second field, and instruct users to continue by clicking the button (e.g. “Type abc123 in the Password field, and then click the Sign in button”). In the Text Entry Box’s properties, do not assign a shortcut key. Especially avoid Enter, since that key is overridden by the browser’s controls. Do assign a button and configure it as transparent. Do enable the Password option, which makes the password appear as asterisks more like the real thing. Do enable the Cass-sensitive option, since most passwords are case-sensitive.
  3. On the Timeline, make sure the first field interaction ends before the second field interaction begins.

It is easier to understand what I am on about if you see it, so here is an example. The source file is here.

Create a password-protected portal

Here is a template for a simple Captivate movie that forces the viewer to enter a case-sensitive, unique password before proceeding on to a given web page. This can be handy for putting some rudimentary security in front of your training portal or client review page. Here is how it looks.

Fonts: A fix for fuzzy

A commonly expressed problem with Captivate 2 is that text used in transparent captions looks “blurred” or “fuzzy” in published SWFs. This is because of the way “font-smoothing” is applied. You can override this setting, however, by highlighting the text with the highlight color #C0C0C0, as shown here. In Captivate 4, you need only disable the Anti-alias Transparent Captions check box under Edit ~ Preferences ~ Project ~ SWF Size and Quality.

Controlling the browser window

One of our colleagues recently expressed a need to present a Captivate-generated SWF in the clean window, which is to say, without the browser’s buttons, Address field, Search field, and so on. There is a couple of ways to do this. The simplest is to use the Full Screen option when publishing. Slightly more difficult is to use JavaScript to open a window of a specified size and without the browser’s interface elements. Unfortunately, as we found out, Captivate’s Full Screen publishing option does not work if you have Sharable Content Object Reference Model (SCORM) enabled. So, scripting is required.

In case you ever have need of this type of script, I have put together some example files here. They include:

Sample.swf: This file contains a simple red box along with a button bar. Use the X button to close the window.

OpenFullScreen.htm: This is a Captivate-generated web page that I edited to include a script to open the SWF full screen. The script is commented out so you can copy and paste it into your own files.

OpenSwfFullPortal.htm: This is a scripted portal page that allows you to open your SWF in full screen mode via a link.

OpenSwfWindowedPortal.htm: This is a scripted portal page that allows you to open your SWF in a windowed mode via a link. If you reuse this, be sure to specify the correct Width and Height variables for your project.

I supply these files free of charge and without warranty etc., etc. etc. Hopefully they will save you some time if you encounter this situation, however!

Useful links

Here is a page of links useful to training developers and technical writers.

|