Skip to main content

Creating web content for use in Articulate

For those of you who are interested in exporting Captivate 5 SWFs for use in Articulate Presenter, there is an interesting dilemma preventing us from importing Flash Movies. We will address a workaround for the dilemma in this blog post. My hope is that this issue will become irrelevant as Articulate upgrades their standards, but for the moment it seems as though Articulate only recognizes Flash Movies written in ActionScript 2. The current design standard is ActionScript 3. ActionScript is essentially the code used to define the various flash components in the SWF. It was originally developed by Macromedia, but now Adobe owns it.

For those of you who are still using Captivate 4, the solution is actually fairly simple. When you publish your SWF file in Captivate, make sure that the settings are set to publish using AS2 (ActionScript 2). To import it, simply click on Flash Movie (in the Insert group of the Articulate ribbon) and locate your SWF file.

The Captivate 5 users will encounter problems, as there is no option to save using AS2. The only option is AS3, which Articulate does not recognize. What we are going to do is to create our own web content.

First step once you have your SWF content created, is to publish the content. (You'll notice under the Project Information tab, that the default ActionScript Version is AS3 with no options to change it.) Name your project what you would like and save it in your folder. Before you click Publish, make sure that under Output Options, the boxes for Zip Files and Export to HTML are unchecked (see below). You don't need the Zip and we are going to create our own HTML file. A quick note is that Articulate does not support any resolution above 720 x 540 at this time. Keep that in mind as you are publishing your SWFs.


Now open up explorer and browse for the folder that you just created. The default location for Captivate publications is:

C:\MyDocuments\My Adobe Captivate Projects\

Create a new folder called "Web Object" and put the SWF file in that folder. Once you are in the Web Object folder, you will need to create an html file called index.html. Prior to our retreat in September I emailed the team a file called index.html; if you still have that correspondence then just copy that file into your folder. If not then you will need to create one. Right click somewhere within the folder and click on New -> Text Document. Name that document index.html and then open it up in notepad. Copy the code below:

<html>
<body>
<object width="720" height="540">
<param name="movie" value="name of your file.swf">
<embed src="name of your file.swf" width="720" height="540">
</embed>
</object>
</body>
</html>

Make sure that the width and height values match the sizes of the published SWF, and that you replace "name of your file.swf" with the actual file name. I recommend doing this by right-clicking on the actual SWF file, selecting properties, and actually highlighting the file name, copying and pasting it into the text document. (nerd shortcut: you can also access a file's properties by simply clicking on the file and hitting F2). One time I created the html document, but I misspelled part of the name and the web object would not function right in Articulate, so I recommend copying and pasting. Code is particular like that.

So by now you should have a web object folder with a published SWF file and an index.html file. If you would like to test the html file, simply double click on it. It should open a web browser and play the SWF file (it will probably shove a security popup before it plays. Just click through it). At this point we are ready to import the content into Articulate. This part is so simple that I am not even going to explain how to do it; I will just show you an image of the import screen (click on the image to see it in better resolution).


The result is that your Captivate 5 project should appear fully functional in Articulate, and it should play the same way that a Flash Movie would. It is really not a complicated process, but it will be nice when Articulate is able to play well with AS3. As always hit me up if you have any questions

Comments

Popular posts from this blog

basic html tables

Hey all, I figure that I would expose you guys to the basics of creating tables in html. There are many ways to do this. The wysiwyg way of constructing a table would be to use the built-in eCollege table wizard, or to build a table in in MS Office or Dreamweaver. These methods offer limited customization, as is the nature of visual editors. In order to really customize every aspect of the table, you must have a working knowledge of the html used to create the table. The basic elements of a table are as follows: <table border="1"> <tr> <td>row 1, cell 1</td> <td>row 1, cell 2</td> </tr> <tr> <td>row 2, cell 1</td> <td>row 2, cell 2</td> </tr> </table> This is what the code for a basic table with a border looks like. And this is what that table would look like: row 1, cell 1 row 1, cell 2 row 2, cell 1 row 2, cell 2 The elements include table rows <tr> and table

SME Relationship-Building: Tips of the Week

A couple of things came to mind during some recent SME conversations that I want to share. You may be already doing these things, but I think it helps to put them down here for all of us to think about and discuss... Given our mandate from Nancy Davis to consult to our SMEs on pedagogical issues related to learning outcomes, FOs, etc., it's likely that we'll run into SMEs who are not used to spelling out their instructional rationales and strategies as specifically as we're asking them to, even if they are at some level "good teachers." I try to motivate them by noting that the coursemap is now viewed as much of a ‘document of record’ as the Prospectus and Syllabus are – so it needs to show the rigor and clarity of outcomes of a 'premier' e-learning experience. And if a SME's LO/FO/assignment connections aren't as Bloom-worthy as they need to be, let's communicate to him or her that "my job is to help your expertise shine through"

Encouraging student voice and video comments

Hey team, Won and I are at the Sloan-C Emerging Technology conference (#et4online), and I wanted to share some ideas with you all regarding the utilization of audio and video features in our discussion boards.  The presenter who inspired this post is Michelle Pacansky-Brock who wrote an ebook about VoiceThread. Her institution bought a site license so that students could make comments on VT via phone, ensuring that technology wouldn't be a barrier to student participation. My thoughts are that our online and most blended students have both computers with webcams/microphones and smartphones. I think that in Canvas we don't need to rely so much on VT to facilitate an audio/visual discussion, as these features are integrated into the learning platform. Michelle conducted research in her classes via surveys and discovered that when she as an instructor left voice and video comments, 97% of the students appreciated such comments. However, 75% of the students were unwilling