e-learning – Page 12 – The Logical Blog

August 5, 2014

Adobe Captivate 8: Custom Workspaces

by Kevin Siegel

From a new user perspective, one of the major complaints about Adobe Captivate has always been its cluttered user interface. There are so many panels and toolbars in Captivate (and most are open and visible when the program starts), some people feel that the program is more difficult to learn than other tools like Articulate Storyline and TechSmith Camtasia Studio.

People using Captivate versions 5, 6, and 7 have the ability to undock most of Captivate's panels and move them around the screen. Users can also save the location of the panels as custom workspaces (via Window > Workspaces > New Workspace).

While being able to customize Captivate's workspace is great, if you aren't careful things can quickly become a hot mess. I can't tell you how many emails I get from developers who can't find this panel or that. In almost every instance it turns out they either closed the panel by mistake, or moved it to a second display and forgot.

You can easily reset a Workspace (Window > Workspace > Reset) and get every panel back to its default location. However, many developers (even some with plenty of experience using the tool), don't know about resetting a Captivate workspace.

When Adobe released Adobe Captivate 8, the interface was totally overhauled–and simplified. To prevent new users from getting overwhelmed by Captivate's many toolbars and panels, toolbars have been consolidated and most of the panels are closed by default. To keep the interface from getting cluttered, it's now impossible to undock the panels. And, for the ultimate in interface simplification, you can no longer create a custom workspace.

The simpler interface is great for new users. But what about veteran developers who are upgrading from a legacy version of Captivate? As a long-time Captivate developer, I'll admit that I had a hard time navigating the new workspace. And I was upset with Adobe for taking away my ability to create a custom workspace. I understand that a simpler workspace is easier for new users… but I want complex. Give me back my workspaces!

If you're like me and you're missing the ability to customize your workspace, you'll be happy to learn that the option is still available… you'll just have to activate it.

In the image below, you can see Captivate's Workspace menu. There's really only one menu item: Reset 'Classic.' If you choose the Reset 'Classic' menu item, the Timeline and the Properties panel will hide (which is the default).

Adobe Captivate 8: Workspace menu before custom workspaces is enabled.

If you'd like to create your own workspace, open Captivate's Preferences dialog box (Windows users, choose Edit > Preferences; Mac users, choose Adobe Captivate > Preferences.) Select Enable custom workspaces/panel undocking.

Adobe Captivate 8: Enable custom workspaces.

Restart Captivate and you'll find that you can now undock Captivate's panels and move them around your display (just like legacy versions of the program). And if you choose the Window > Workspace menu item, you'll see that you also have the ability to create a New Workspace.

Adobe Captivate 8: Workspace menu after custom workspaces is enabled.

If you tire of your custom workspace you can, at any time, return to Captivate's 'Classic' workspace (which will always be available in the Workspace menu).

***

Looking for instructor-led training on Adobe Captivate? Check out our live, online, instructor-led Captivate classes.

August 1, 2014

eLearning: Create Icons Instantly with Iconion

by AJ Walther

Previously I shared some tips for creating your own great looking flat design eLearning. A recurring trend in flat design is the use of simplified icons in lieu of detailed drawings, images, or photos. Many icons can be found by inserting symbols or certain Clip Art images from within PowerPoint. Creating your own icons from scratch is also not terribly difficult. As an alternative, I'd like to share a fun (and free!) tool for quickly creating and customizing icons for use in eLearning.

Iconion is a free download that is still currently in Beta. After you've downloaded Iconion, you can choose from a large array of icons from four different icon font sets: Typeicons, Linecons, Font Awesome, and Entypo.

To create an icon, simply select an icon from the left of the Iconion window, preview it in the center panel, and then add a style from the right panel. The styles are many and varied and, in addition to looking great in your eLearning, would blend seamlessly with Windows and iOS. After you've chosen a style, you can make stylistic tweaks to fills, background colors, gradients, blurs, etc. From there you can save your icon to your desktop in a number of fully scalable sizes. Fast, easy, and great looking!

Here's an example of how I incorporated some icons from Iconion into the slide deck for an online training course here at IconLogic:

July 28, 2014

eLearning: Creating Flat Design Images from PowerPoint’s Clip Art

by AJ Walther

Want to design something that looks fresh and modern? You may want to consider Flat Design. Flat design is an aesthetic that rids the design of any three dimensional attributes. Generally, drop shadows, gradients, outlines, and textures are avoided. When gradients are used, they subtly fade from one color to a slightly different hue of the same color. It is common to see a heavy reliance on icons and banners with close attention to the color palette and font choice.

Many of us are working with shoestring budgets while creating eLearning. This means we are often relegated to the world of free clip art for our eLearning images. Here are a few examples of how clip art images can be reimagined into flat design. For these examples I just used shapes without lines, gradients, or shadows to create new, flat images resembling the original clip art images.

The great thing about flat design is that with careful attention to detail, most anyone can produce their own form of attractive flat design. All of the redesigned clip art images above took very little time, effort, and PowerPoint technical expertise. But, want to know a secret? You could even take an existing clip art image and bend it into your own flat design creation without building anything from scratch. Let's look at an example.

Find a clip art image that you like, but that could use a bit of help.
With the image selected, press [ctrl] [shift] [g] on your keyboard twice to ungroup the image.
Note: The first time you ungroup, you will be asked if you would like to convert the image to a drawing object. Click yes and then ungroup again.
Select and delete unwanted elements. Here, I deleted each of the black lines.
Working one shape at a time, right-click and select Edit Points to smooth each shape by editing its points. When possible, I like to get rid of as many points as possible and to set the majority of the remaining points as Smooth Points. For this particular image, I also adjusted the point of the tack to be pointier and extended the "metal" part so that the green section overlapped it.

Note: New to editing points? Check out this quick tip here.
Apply your color scheme to the image by selecting each shape individually, right-clicking, and choosing Format Shape.
If you're going for more of a Jony Ive look (a la iPhone's OS), you can take this a bit further by adding a subtle gradient to the shapes.
Integrate the image into your design.

Need some more flat design inspiration? Check out the Flat UI Design site.

July 23, 2014

Adobe Captivate 8: Geolocation

by Kevin Siegel

You can create an eLearning lesson that changes dependent upon where your learners are physically located. For instance, you can create a Captivate project for learners who live in the United States or Australia. While much of the course content is relevant to both Americans and Australians, thanks to Captivate's geolocation feature, learners in both countries will see unique, location-specific, information while taking the same course.

The first step to adding geolocation features to a project is creating the project as you normally would. In the example that follows, I've created a project for learners in Asia and the United States. (I created the project as a branching scenario… the first half of the project was for learners in the United States, the second half was for learners in Asia.)

Once you've created the project for both audiences, adding the geolocation features is very easy. First, choose Window > Mobile Palette to open the Mobile Palette dialog box.

Select Geolocation and then click the OK button.

Next, you'll need the Latitude and Longitude of the locations you'll use in your project. As I mentioned above, my two locations are Asia and the US. While determining Latitude and Longitude might sound difficult, I simply asked Google the following: "what is the lat and long for the united states?" The answer, rounded to whole numbers, was 38 and 77.

I repeated the same question for Asia (and ended up with aLatitude and Longitude of 48 and 86).

Now that you've got the Latitudes and Longitudes figured out, you'll need to create one variable for each location (via Project > Variables). When creating each variable, select Geolocation and you'll have access to a Lat, Long, and Accfields. The Acc value is based on how close you want the learner to be to the latitude and longitude location; it is based on meters. Think about the meters surrounding the area like a large circle. When building your course, consider starting with 1,000,000 meters, which will allow anyone within range to still be able to access the course.

The final step (besides publishing) is to create an Advanced Action (via Project > Advanced Action) and attach it to a Filmstrip slide.

Set the Action Type to Conditional actions and name the action GeoLocation.

Double-click the first column under the IF Statement, click the word variable, and select cpInfoGeoLocation.

Adobe Captivate: CpInfoGeoLocation variable

Note: The CpInfoGeoLocation variable ships with Adobe Captivate 8.

To the right of "is equal to," click the word variable from the drop-down, choose one of your location variables you created earlier.

Under Actions, double-click in the first column and chooseJump to Slide. From the next menu, select the slide in your project where you want your learner to end up. I selected the Asian branch in my project (I called it Asia Scenario).

At the bottom of the dialog box, click Else. Under Actions, double-click the first column and choose Jump to Slide. In the next column, choose your other location (in my case, it was the other branch I called US Scenario). Save the action (as an Action) and then close the dialog box.

Adobe Captivate: Jump to the other location.

Attach the GeoLocation Advanced Action to the first slide by selecting the slide on the Filmstrip. On the Properties Inspector, select the Actions tab. From the On Enter drop-down menu, choose Execute Advanced Actions and select the GeoLocation action as the Script.

Publish your lesson and post it to your web server or LMS like you would we any Captivate eLearning lesson. When users in Asia access the lesson, the GeoLocation script will automatically display the Asian content (and vice versa for US-based learners). In a word, that's awesome!

***

Looking for instructor-led training on Adobe Captivate? Check out our live, online, instructor-led Captivate classes.

July 16, 2014

Adobe Captivate 8: Changing the Size of Responsive Layouts

by Kevin Siegel

As far as I'm concerned, the hottest new feature you'll find in Adobe Captivate 8 is the ability to create responsive eLearning. As I taught you a few weeks ago, by choosing File > New > Responsive Project, you can basically create and work on multiple screen sizes (called break points) in one project. When you publish the responsive project, the learner will automatically be served the break point appropriate for the device they're using.

If you've spent any time creating Responsive Projects, you've probably noticed that there are three breakpoints in the project by default: Primary (set to a width of 1024 pixels), Tablet (set to a width of 768 pixels), and Mobile (set to a width of 360 pixels). The default breakpoints are based on typical sizes of a laptop (Primary), iPad (Tablet), and iPhone (Mobile). However, you can easily adjust the size of the breakpoints.

To begin, open the CloudAir_SoftSkills Sample.cptx sample project that ships with Captivate 8. (On the right side of the Captivate 8 Welcome screen, click the Sample Projects/Tutorials icon.)

Adobe Captivate 8: Sample Projects icon.

The project is responsive. Notice the colored ribbon at the top of the canvas; this is a breakpoint within Captivate (a breakpoint is the point at which the layout changes size to accommodate a different screen size).

To change the width of a layout, select one of the three breakpoints and drag either slide to change the width.

Adobe Captivate 8: Change the width of a breakpoint.

See, I told you it was easy. Now for the height.

The option to adjust a layout's height is disabled by default so that you don't accidentally change it. Each layout's default height provides space for Captivate's playbar. If you are not going to use a playbar in the published lesson, you should adjust the height accordingly.

To begin, it's a good idea to change your magnification to 75% (View > Magnification). If you are too close to the canvas, you will not be able to see the new height you are about to set. I've found that 75% is almost always the perfect magnification for me, but you may need to fiddle around a bit to find the prefect magnification for your display.

In the upper right of the canvas, select View Device Height.

From the bottom of the canvas, drag the Height Adjuster (the yellow rectangle in the image below) up or down to change the device Height.

Note: The shortest you can make any device is 100 pixels; the tallest you can make any device is 1,000 pixels.

***

Looking for instructor-led training on Adobe Captivate? Check out our live, online, instructor-led Captivate classes.

July 11, 2014

Adobe Captivate: Removing Popups from Video Demos

by Kevin Siegel

I'm continuing to enjoy developing eLearning using the new Adobe Captivate 8. And the more I use this updated version, the more I find subtle improvements and new features. Take video demos for instance. I use the video demo recording mode frequently (it's the mode I use for the videos I upload to YouTube).

While recording a recent video, I noticed a new tab on the Video Effects Inspector: Popup.

It just so happened that I had recorded a video and had inadvertently captured a yellow tooltip (shown in the image below). I figured this would be the perfect opportunity to test the Cleanup button on the Popup tab.

On the Timeline, I positioned the playhead at the part of the video where the popup first appeared.

On the Video Effects Inspector, I selected the Popup tab
and clicked the Cleanup button.

On the slide, I drew a rectangle around the popup.

Note: When you try this at home, don't worry if your rectangle doesn't completely cover the popup. If your rectangle is too large or small at first, you can resize it using the resizing handles at any time. You can also drag the rectangle via its borders to move it to a different location on the video.

Once I drew the popup area on the video, a Popup object was added to the Timeline. I stretched the right edge of the Popup object to the amount of time I wanted it to remain onscreen on the slide; then I clicked the word Cleanup on the video.

And just like that, the area within the popup rectangle I drew was removed from the video.

***

Looking for instructor-led training on Adobe Captivate? Check out our live, online, instructor-led Captivate classes.

July 10, 2014

eLearning: Voiceover Audio That Will Keep the Learner’s Attention

by Jennie Ruby

How can you use your voiceover script to keep the learner's attention within an eLearning lesson? Here are the two most important factors: Make it proportional and make it conversational.

Make the Voiceover Proportional to the Action

In a recent informal test at a conference for instructional designers, the audience started waving and yelling "Stop! Stop!" after less than two sentences of voiceover text was read for one PowerPoint slide. Now granted, that second sentence was a doozy, weighing in at more than 47 words, but still. Two sentences? How short is our typical learner's attention span these days, after all? Probably much shorter than you think.

The learners we address with our eLearning projects are bombarded with information, often in the form of movies, videos, and television. Scenes change in modern movies approximately every minute and a half. But in a movie, even during that short time, something is continually moving on the screen.

On many kinds of eLearning products, there may be nothing moving at all, as a still slide rests on the screen or a still screenshot sits waiting for the next interaction. So with absolutely no motion on screen, how long can the audio drone on?

At the conference, the elapsed time was less than 12 seconds before the audience became impatient.

To some extent, the type of lesson will determine how much voiceover is proportional to each action. On a software demo video, a lack of action for as little as 7 seconds can have the learner shaking the mouse to see if the video is still running-even if the audio voiceover is continuing. During compliance training, on the other hand, the learner may expect relatively longer voiceover descriptions and recitations of rules.

But that doesn't mean learners will like it. Consider aiming to have something move on the screen, illustrate the point, or change in some way about every two sentences. You can achieve the right proportions by either adding visual elements or shortening the voiceover script.

Use Plain Language and a Conversational Writing Style

The writing style of your voiceover text will greatly affect how "listenable" it is. Long, academic-sounding, repetitive sentences will have your learner eager to move on quicker than short, plain-language sentences.

Test yourself: try reading each of the following paragraphs. Which one makes you want to stop reading sooner?

Example A: The capability for the creation of user-defined functions has been instituted with the current version. This capability is not entirely new but was previously available via pass-through to and from a custom module, which is a function of most programming languages. However, these modules did not allow this functionality to be embedded directly within another function, and this inherent limitation was a source of frustration to users.

Example B. In previous versions of the program, you could create a custom function, but only within an entire custom module. Now, you can embed your own custom functions directly inside another function. This means there are now countless ways you can use custom functions within your own applications.

With little change in the technical terminology and content, Example B will seem easier to focus on for most learners. The best writing style for a voiceover uses shorter sentences, addresses the learner directly, uses plain language when possible, and uses active rather than passive voice.

Instead of "The capability for the creation of user-defined functions has been instituted…"

Try this: "Now, you can create your own user-defined functions."

Instead of "This was previously available via pass-through…"

Try this: "Before, you had to pass your custom functions through a…"

Instead of "These modules did not allow this functionality"

Try this: "You can now do x"

Remember that the voiceover for a lesson is written for a voice. Make that voice conversational rather than academic in style. Make it proportional to the amount of action on screen and you'll keep your learners clicking painlessly through the lesson while remaining focused.

***

If you love Jennie's grammar articles, you'll love her classes. Check out some of Jennie's mini courses.

July 2, 2014

Adobe Captivate: Record Simulations Using Smart Shapes Instead of Text Captions

by Kevin Siegel

Text Captions have been available in Adobe Captivate since before Captivate was Captivate (think RoboDemo). While there's nothing terribly wrong with Text Captions, you're a bit limited when it comes to editing the way they look.

Take the Text Caption shown below for example. The arrow in the upper left of the caption is known as a callout.

You can control a few attributes of the callout (you can use the Properties Inspector to select from a list of pre-determined positions and you can elect not to show the callout). But if you want to fully adjust the callout (perhaps move it a bit to the left or right, or make the callout a bit longer), you're out of luck.

Many Captivate developers, tired of the limitations of standard Text Captions, have forsaken Text Captions altogether for Smart Shapes. In the image below, I'm using a Rectangle Smart Shape. The shape looks much like a Standard Text Caption. I can control its appearance via Object Styles. However, check out how I am able to drag the shape's callout by dragging the yellow square. You can't do that with a Text Caption.

Adobe Captivate: The callout in a Smart Shape can easily be adjusted.

Because Text Captions are really bitmap images, I'm not able to fully control how the captions look unless I edit the bitmaps using an image editing program. With Smart Shapes, you can control just about every aspect of the way the shape looks by combining options found on the Properties Inspector with Object Styles.

While there is much to love about Smart Shapes, a perceived downside to Smart Shapes is that you can't use them to automatically get captions when recording a Software Simulation. You'll be happy to learn that you can, in fact, use Smart Shapes instead of Text Captions during the recording process.

Display Captivate's Preferences (Windows users, choose Edit > Preferences; Mac users, choose Adobe Captivate > Preferences). Choose a recording mode and, from the Captions area, select Use Smart Shapes instead of Captions.

Adobe Captivate: Use Smart Shapes instead of Captions.

At that point, you'll be able to select the Smart Shape Type you'd like to use during the recording process.

Click the OK button to close the Preferences dialog box and you're done. The next time you record a Software Simulation, the project will automatically contain Smart Shapes instead of Text Captions.

***

Looking for instructor-led training on Adobe Captivate? Check out our live, online, instructor-led Captivate classes.

June 27, 2014

eLearning: Creating Accessible Content, Part 2

by Anita Horsley

In the first article in this series, I discussed the definitions for Section 508, the amendment to the Rehabilitation Act of 1973, which requires all Federal agencies (typically schools and government institutions) to make information technology accessible to people with disabilities.

I also discussed the use of assistive devices that provide a way for people with seeing, hearing, or dexterity challenges a way to communicate and train using technology. People who have visual impairments use assistive devices such as Jaws, Window Eyes, and HAL. They also use screen magnification and braille displays/keyboards. People with hearing impairments need visual representation of auditory information such a closed captions and graphic displays. People with mobility impairments may need alternative methods to moving through your eLearning content, such as keyboard shortcuts.

The goal of creating accessible eLearning is to enhance your lessons by ensuring that all learners can master the instructional material and meet the learning objectives. When learning is accessible to all types of learners, you are not only complying with regulations, but you are reaching a larger audience.

Designing eLearning to Include 508 Compliance Standards

Most learners retain information through seeing, hearing, and doing. Keep that in mind when creating eLearning courses. It's relatively easy to ensure that a person who cannot see can hear your course content by adding narration and using accessibility text for images (also known as ALT text). However, the more challenging component to eLearning is keeping the lesson interactive.

When creating interactive eLearning, it's important to include accessibility that all learners can use. All learners need to be able to easily identify and select interactive screen objects. You should ensure you are using a tab order for any interactive components. And you should always provide meaningful feedback in your lessons… and offer remediation if necessary.

Here are a few general tips to Instructional Designers to improve effectiveness of accessible eLearning:

Use accessible online help (programs such as Adobe RoboHelp and MadCap Flare allow you to create Help Systems that adhere to Section 508 standards).
Alt (alternative) text for images, tables, and graphs (any purely visual object). For the visually impaired, Alt text is read aloud by assistive devices.
Use contrasting colors for learners who are color blind.
If you're using a slide-based eLearning development tool like Adobe Captivate or Articulate Storyline, name your slides. (The slide names are read aloud by assistive devices.)
Set a tab order for every interactive object (for keyboard accessibility)
Include keyboard shortcuts for all interactive objects (again, for keyboard accessibility).
Be consistent when adding slide-to-slide navigation.
Use tool tips. (Tool tips are read aloud by assistive devices.)
Use Closed Captions for learners with hearing disabilities.
Provide Printable versions of your course materials (for learners with hearing disabilities).

Watch for my next article which will cover a step-by-step accessibility eLearning plan.

***

If you'd like to take a 3-hour deep-dive into the best practices for creating accessible eLearning, check out Anita's live, online course.

June 18, 2014

Adobe Captivate 8: More is More

by Kevin Siegel

Last week I told you about the great enhancements you'll see in Adobe Captivate 8 when it comes to image buttons. This week, I'm going to show you a few more improvements that I think you'll love.

Sample Projects/Tutorials

The first thing you'll see when you start Captivate is the Welcome screen. From this position, you can create a new project, record a software simulation/demonstration, or access recent projects. But take a look in the upper right of the Welcome screen and you'll see an awesome addition: Sample Projects/Tutorials (shown below, it's located in the upper right of the Welcome screen).

Granted, the icon to access the projects and tutorials is easy to miss; but once clicked, a dialog box opens and you'll have access to some really nice sample projects. The sample projects are shown first, followed by several tutorials.

Adobe Captivate: Sample projects and tutorials

If you have already opened or created a project, you will find a Sample Projects/Tutorials icon via the top of the Captivate window (to the right of the Help menu).

However, clicking the icon from here is different than clicking it on the Welcome screen. If you click the icon while in a project, you'll be taken online to Adobe KnowHow, where you'll find some free and pay-for-access training videos.

Characters and Agents

I love the Characters feature added to Captivate a few years ago, which allows you to insert images/guides within a project. And I was delighted to see that not only did Adobe keep Characters in Captivate 8, they've added quite a few. To add a Character, choose Media > Characters. Select a Category, select a character, and then double-click a pose to insert the character onto a slide.

Lastly, check out the Speech Agents (via Audio > Speech Management). Previous versions of Captivate included five Text to Speech Agents. You'll be happy to see that Captivate 8 bumps that number up to seven. New to the team are James and Yumi. I was particularly impressed with how good James sounded… a nice upgrade from Paul (sorry Paul). And Yumi covers you if you need audio for Korean eLearners.

***

Looking for instructor-led training on the top eLearning tools? We offer live, online training on Adobe Captivate, Articulate Storyline, Adobe Presenter, and TechSmith Camtasia Studio. We can also bring the same great training onsite to your facility. Interested? Contact us for details.