October 2015 – The Logical Blog

October 30, 2015

Adobe Captivate 9: Altered States

by Kevin Siegel

In the past, if you wanted to present multiple versions of an object to learners as they interacted with the lesson, you needed to add multiple objects to the slide, hide them, and then use advanced actions to make visible objects hide and hidden objects appear.

I'm happy to report that Adobe Captivate 9 now supports multiple states, allowing you to develop interactive content easily without using multiple objects or the "hide and show" technique mentioned above. In addition, using states allows you to clean up what would otherwise be a cluttered, complicated project Timeline.

Here's a simple example of how easy it is to use states. In the image below, I've added a standard button to a slide.

I'd like the button to look different when learners interact with it. For instance, I'd like the button's text color (currently dark red) to change to white when learners roll over the button.

With the button selected, I went to the Properties Inspector and clicked State View.

At the left of the Captivate window, the Filmstrip is replaced with the Object State panel. By default, there will always be three states: Normal, RollOver, and Down. You can add as many states as you can imagine by clicking the New State button. Because I want to change the way the text looks when learners roll over the button, I'm going to edit the existing RollOver state.

After clicking the RollOver State, it's a simple matter of visiting the Properties Inspector, Character area, and changing the font color to white.

Changing the appearance of the text in its hover state

I could change more attributes of the button of course, but in this instance the font color was all that I wanted to be different. From the toolbar, all that's required now is to click Exit State.

If you followed along with the steps above, preview your project and test the state by rolling over the button.

Keep the following in mind when working with states:

Any object can have multiple states
Interactive objects have in-built states
You can customize the states of static and interactive objects
Buttons and smart shapes have in-built states with associated styles

***

Looking for training or help with Adobe Captivate? Check out these awesome live, online Captivate classes.

October 27, 2015

Writing and Grammar: Myriad vs. Myriad Of

by Jennie Ruby

Educated writers (according to a small and not random survey of my acquaintances) think myriad is an adjective and should only be used as such:

He had myriad reasons for wanting to graduate early.

Myriad birds rose from the lake at dawn.

Captivate lets you import myriad graphic formats onto a slide.

But the most I can find any authority saying about it is this from Bryan Garner in the Oxford Dictionary of American Usage: "The more concise phrasing involves using this word as an adjective, not as a noun." He says it is "better" to use myriad as an adjective, but does not go so far as to say that using it as a noun is actually wrong.

The Greek root word for myriad is defined both as "countless" and as "10,000."

If you think of myriad as meaning "countless," you have to use it as an adjective:

We have countless toys no longer used by our children. [you can't say "a countless of"]

We have myriad toys no longer used by our children.

But if you take the underlying Greek meaning of 10,000, then you can use myriad as a noun, but it makes more sense to add the s, like this:

Dozens of cars were parked in the small lot.

Thousands of cars were manufactured in our town.

Myriads of cars packed the interstate. [Tens of thousands of cars…]

Webster's defines myriad as either 10,000 or "a great number," and scoffs at those of us still thinking it is wrong to use myriad as a noun, and then says this:

The noun myriad has appeared in the works of such writers as Milton (plural myriads) and Thoreau (a myriad of), and it continues to occur frequently in reputable English. There is no reason to avoid it.

So, I guess we sticklers for the adjective can lighten up a little–it is acceptable to use myriad as a noun. Sigh.

October 26, 2015

eLearning: Wireframing 101

by Sally Cox

One of the most important steps in building an eLearning course is the "wireframing" process.

What is Wireframing?

Wireframing is the process of conceptualizing the navigation that will be used for each of the lessons in your course and working out as many kinks as possible before you begin to build the project.

In the example below, there are three simple sections notated. While the example focuses on eLearning, the concept could easily apply to a web page, flyer, newspaper, or magazine layout. To be clear, I'm not talking about specific course content here, nor the specific design; I'm referring to the overall placement of page elements.

The "Header" is the first thing the learner or user sees, so it needs to be something that will, at first, draw them in and then keep them interested. The "Body" is the main part where most of the content resides. The "Footer" is where information is placed that is of lesser importance, i.e., disclaimers, copyright info, and alternate text links.

Why Wireframe?'

Wireframing is a key part of the process in building an interactive course. You must plan each click your user might take and what the outcome of that click will be.

The wireframe below shows some simple navigation that houses "Home," "Our Team," "Services," and "Contact." You can see from the image that this wireframe depicts what the user will see when they press the "Services" button.

By planning all these details out ahead of time, the production time and cost is greatly reduced and so is the error margin.

How to Wireframe

In my experience, the best way to create a wireframe is sketch it out on a simple sheet of paper. At first, I wasn't a fan of paper, but I was told that using paper was the most fluid way to begin a design. I had to retrain myself to sketch on paper but I now see the advantages.

After sketching my ideas on paper, I use Adobe Illustrator and redraw the concepts digitally (especially if I'm going to present the concept to a client). I must stress however that you don't have to be an illustrator or use fancy programs to create a wireframe… simple rectangles and lines will work just fine. You just want to ensure you have mapped out every aspect of the course navigation before you begin to produce it.

Which Applications Should You Use to Wireframe?

There are a variety of applications you can use to create Wireframes or wireframes. Here are a few:

A piece of paper
Adobe Illustrator
Adobe InDesign
Adobe Photoshop
Microsoft Word
Microsoft PowerPoint
Apple Keynote
Online services such as Blueprint, Balsamiq and Omnigiraffe

I use Illustrator because it's a regular part of my workflow, but I recommend PowerPoint to most people who are just starting out. Everyone has PowerPoint, it's relatively easy use, and you can build your wireframe quickly.

How to Begin Wireframing

The image below shows two wireframes. One uses white background boxes and the others are filled with gray. I prefer the bottom one because I am a visual thinker and the gray helps me understand the regions more. However, both are correct.

The image below shows two different treatments for a navigation bar.

In the first example, I used separate boxes to indicate buttons and I grayed out the one that the user has pressed. In the second example, the buttons are all connected so I showed it a slightly different way. Both are correct.

How complex or simple you make the wireframe is up to you. Here is an example of a very complex wireframe. Notice the different shades of gray used to designate hierarchy.

Final Thoughts

Keep your wireframes clean and organized. Show things as close to scale as possible, and label items as you go. Work out all the details at this stage, and production will be a breeze.

***
If you'd like to attend some awesome 3-hour mini courses that focus on eLearning, check these out.

October 23, 2015

Great Training and Free eLearning Assets? That’s Awesomeness!

Attend our multi-day Adobe Captivate, Articulate Storyline, or Studio 13 courses and receive a free, one-year subscription to the eLearning Brothers eLearning Templates for free. (That's a $499 value!)

Learn more.

October 23, 2015

Adobe Captivate 9 Hot Fix: Update Fixes Several Known Issues

Adobe recently posted a fix for Captivate 9 that, according to Adobe, addresses the following issues in Adobe Captivate 9.

Conditional actions get converted to standard actions in upgraded project
Operands in advanced actions appear blank in upgraded project
Autoshape buttons fill and stroke is not retained during upgrade
Effects are not played fully in SWF, when the effect duration is less than the default effect duration
Result slide does not show up for a captivate project with more than 45 random question slides
TAB Order dialog throws Error #2046 on Mac OSX 10.10.5
Distortion issues (objects with in-built states appearing to jump) that occur when responsive projects containing objects with in-built states are opened

Click here for more information and to download the fix.

October 18, 2015

Articulate Storyline: Animation Painting Anyone?

by Kal Hadi

The Animation Painter in Articulate Storyline 2 lets you create perfect Storyline animation effects for one object and then quickly copy those animation effects to other objects. Here's how:

Create an animation effect

Select the object you want to animate.
Click the Animations tab.
Click the star icon for the type of animation you want to add (entrance, exit, or motion path).
Select an animation effect.
The default duration of entrance and exit animations is 0.75 seconds while motion paths default to 2 seconds. To change duration, enter the required time in the Duration field. (The duration ranges from 0.1 seconds to 59 seconds.)
Select Effect Options to choose options for entrance and exit animations.
Select Path Options to edit the path options for motion path animations.

Use the Animation Painter to Reuse the animation

Select the object animation that you want to use
On the Animations tab, click Animation Painter
Click any other object (or objects) in your project to apply the effects

Note: To apply the same animation to multiple objects, click the Animation Painter twice to lock it in the "on position." When you are finished painting, click the Animation Painter once to unlock it (or press the Esc key).

***

Looking for training or help with Articulate Storyline or Studio? Check out these awesome live, online Articulate classes.

October 16, 2015

“Adobe Captivate 9: The Essentials Workbook” Now Shipping

We are proud to announce that our newest book, "Adobe Captivate 9: The Essentials Workbook" has begun shipping.

This book is a self-paced training manual that teaches the core Adobe Captivate skills needed to create interactive eLearning and mLearning content.

By following step-by-step instructions, you will learn how to create a soft-skills lesson from scratch. You'll also learn to record and produce software demonstrations and interactive training simulations.

By the time you finish working through this fast-paced book, you'll know how to control the mouse pointer and add such standard objects as text captions, images, characters, assets from the eLearning Brothers, and highlight boxes. You'll be able to record, import and edit audio, and further enhance the learner experience by adding interactivity via click boxes, buttons, and text entry boxes.

Have you already created content using Microsoft PowerPoint? Don't throw that presentation away. You'll learn how to import existing PowerPoint content into Captivate.

Last, but not least, you'll learn to publish your project in SWF and HTML5 formats so that your content can be uploaded to a web server for consumption on virtually any device, including the iPad, iPhone, and other mobile devices.

Order here.

October 12, 2015

Social Media: Gathering LinkedIn Recommendations

by Sally Cox

My colleagues know that I am a fanatic about LinkedIn. It's my top source for work; and when I hear people complain about it, I always think, "What could I do to help them strengthen their LinkedIn profile?"

One of the most powerful features of LinkedIn is the ability to collect recommendations on your profile. If you take the time and effort to set up your LinkedIn profile correctly, it becomes your online resume. And recommendations are an important part of that. Instead of a leather portfolio filled with letters of recommendation, in today's world recommendations are part of your online LinkedIn profile. Let's take a closer look.

Ask for Recommendations

It's perfectly acceptable to ask a colleague for a recommendation. However, it's customary to return the favor so if you don't feel comfortable recommending a colleague, don't ask them to recommend you.

Here's how to ask for a recommendation. Go to your LinkedIn profile (you've already signed in at this point), then choose Profile > Edit Profile.

Hover over the arrow next to View profile as and choose Ask to be recommended. This allows you to select someone in your Connections list to send them a message.

This navigation bar appears with several options. Notice the heading Recommendations. Under Ask for recommendations, LinkedIn suggests connections but I ignore that. I choose from the list of connections below that navigation bar.

You'll also see an option to choose which company/role you wish to have them recommend you for.

Here are a few tips for gathering recommendations:

It's acceptable to send a message and ask them to recommend you for a certain skill or role. I once had a colleague recommend me on LinkedIn by emphasizing how "fun" I was to work it. I politely thanked them for their recommendation but asked them to edit it, and focus on my project management skills (which he did).
Don't recommend anyone you would not trust to work for you. Your reputation is in play here; so friend or not, if they aren't a good candidate–don't recommend them!
Don't send 150 requests for recommendations in one day. When people recommend you, it leaves a time stamp. Fifty in one day looks suspicious and recruiters notice things like that.

***

Want to learn more about LinkedIn? Come check out my live, online 3-hour LinkedIn mini course. Among other things, you will learn to build a strong LinkedIn profile and tons of other awesome LinkedIn tips and tricks.

October 8, 2015

Publishing Adobe Captivate Projects: SWF, HTML5, or Both?

by Kevin Siegel

If you attend our Adobe Captivate Beginner class, you will learn how to publish projects as SWF (for desktop users) and HTML5 (for mobile users).

Publishing in Captivate takes your source content and outputs it into a format that can be consumed (viewed) by the learner. Currently, the most common way to publish a Captivate project is as a Flash SWF, an excellent solution because SWF files provide the best multimedia experience for your learners. In addition, SWFs can be used by the vast majority of the world's desktop computers, laptops, and browsers. Your learners do not need Captivate installed on their computer to use an SWF, but they do need a modern web browser and the free Adobe Flash Player. According to Adobe, the Flash Player is installed on the majority of the world's computers.

Of course, SWFs have a problem. Learners using a mobile device that does not support Flash such as the iPad, iPod, and iPhone (that's millions upon millions of potential learners), cannot use SWF content. When trying to access SWF content, those learners will be met with a warning that SWFs are not supported. The only way around the warning is to use a supported device (meaning, those learners will have to access the eLearning content via a desktop or laptop computer… which might not be convenient or even possible).

As an alternative to SWFs, Captivate allows developers to publish content as HTML5. Lessons published as HTML5 play on any computer or mobile device that supports HTML5, including the Apple mobile devices.

A student in a recent Captivate class asked the following question: "If SWF's aren't supported on all devices, but HTML5 is, why not just publish HTML5 and do away with SWFs?"

That's an awesome question. While HTML5 may one day completely replace SWF, today is not that day. SWF is still a very popular multimedia format. And lots of cool Captivate effects that work great as an SWF simply do not work as HTML5. In addition, older web browsers don't support HTML5. A desktop learner using an old web browser would get a message saying that their browser doesn't support HTML5. (The reverse problem that a mobile user would have when attempting to access an SWF.)

One simple solution to the old browser issue would be to ask everyone to upgrade their web browser. Simple? Hah! Because many private users, companies, government agencies, and educational institutions aren't in any rush to upgrade their web browser technology, it's not a viable solution at all.

So which publish format should you choose, HTML5 or SWF? For some developers, the answer is both. However, if you publish both formats separately, you'll have to provide two published lessons for your learners… SWF and HTML5 versions. Then you'll need to tell your learners to choose the best format. Great… except many learners won't know which format they're supposed to choose, which is only going to lead to confusion.

Wouldn't it be great if could publish a Captivate project as both SWF and HTML5, at one time, and then let the learner's device (not the learner) determine the appropriate output to use based on its capabilities? That solution would be perfect… so let's do it!

Open Captivate's Publish dialog box (File > Publish). From the Output Format area, select both SWF and HTML5 (enable both options).

Publish the project (when the Publish process is complete, there's no need to view the Output). Minimize (Hide) Captivate and then open the folder containing the published assets.

The assets folder will contain a combination of the SWF and HTML5 output files. If you've published SWF or HTML5, you're likely familiar with the output files. However, now that you've published both outputs at the same time, there's a new start file in the folder: multiscreen.html.

If you make multiscreen.html the link for learners to click when accessing the lesson, desktop users who have Flash will automatically be served the SWF version of the lesson. Learners who are using devices that do not support Flash will automatically be served the HTML5 version of the lesson. How awesome is that?

***

Looking for training or help with Adobe Captivate? Check out these awesome live, online Captivate classes.