Trainers Talk Tech

On July 11th, 2007 the term Crapid eLearning was introduced by Tom Kuhlmann from Articulate. He introduced the term in his blog post Myth 1: Rapid eLearning is Crapid eLearning. I love this article because it defends the tools and attacks the design. This is one my Thomas mantras - focus on the LEARNING part of eLearning. It also gave me a great new word I could use in casual conversations with my team!

For me, Crapid also means visually barren. Sure, you can have a great eLearning design doc, great objectives and some cool interactions and simulations, but if it looks unprofessional or amateurish, then you have some usability issues to overcome. Now, there are lots of folks who may disagree with me, but out of the box templates, buttons, ready made flash "interactions" all fall short of what a professional graphic designer can create. They may help you quickly put together a program, but the user may view the content in a bad light if the interface and visuals are shoddy. They may have a hard time seeing the diamond in the rough. Visuals must be stimulating and professional looking until they fade into the background and the content takes over. Think of it as a first impression - it takes a long time to get past a bad first impression, just like it may take a user a while to get past an ugly, awkward interface.

I've created Crapid eLearning. I've also created bad eLearning projects. Because clients want what they want and paid me to deliver it. I've worked hard to talk people out of design decisions or instructional choices that I didn't agree with, but because they are the client, I build it to match THEIR vision, not mine. I've also done Crapid work because the client just wanted to check a box and push the project off their to-do list.

In this blog, a little more than a year ago, I predicted an eLearning regression and others agreed with me. Now, a year later, using my own observations and interviews with participants at the ASTD TK 10, my clients and others in the industry, I believe it came to pass. eLearning software development companies are selling the heck out their software and upgrades are popping out like crazy. Instructional designers who don't know a thing about graphic design or coding are whipping out SCORM compliant programs with ease. Template sites and pre-coded sample bundles are popping up (yes...mine are coming too) on the web and people are buying them like beanie babies. It's now easier than ever before to develop eLearning and non-tech, non-graphic and non-programmers are doing it using these tools.

Now...here's my ethical dilemma. I've had it before in June of 09, but its back with a vengeance. At that time, I called it "Should I advertise the tools" and I was wondering if I should advertise that I develop in Lectora, Captivate and others. I received lots of interesting feedback on that one, and today I have the answer.

Yes. I should. And here's why: My clients now own them. My clients like them. It provides me with an edge. I can now offer high-end completely custom, partial custom or templated eLearning.

Just this week, I have two clients with real money who want me to develop within Captivate and within Unison.

My ethical dilemma: I don't want to develop Crapid eLearning because I will be using these tools. I have to convince my clients to create custom Flash elements they can drop into these tools. They have to allow me to take the time to create unique templates and interfaces and buttons and other elements to make it look custom even though its using an eLearning tool. In Captivate, I can be extremely creative with the tool. In Unison, I can, but I have to do some serious code cracking to bring it up to my level of what a "professional" eLearning program looks like. I need to take these tools to new levels. I need to push the envelope regarding software capabilities and be creative within the limitations of the tools so that I don't just quickly schlop the project together.

Or, I could just develop Crapid.

The opposite of professional eLearning is Crapid eLearning. However, as you read this, you or your company may have these tools installed. They may be installed on the very machines you are using to read this blog. My challenge to you is this: Follow my lead and don't create Crapid. Look at the work you admire and instead of saying "I could never do that with my tool" or "You have to be a good graphic person to do that" or "I can only do that with Flash" go out and LEARN to do those things. Take it to the next level. Don't settle on mediocre or Crapid. Maximize what you know about the tool. Call the software developers and get into the weeds to bend the software to YOUR will. Buy a good book on graphic design like The Non-Designer's Design Book or Graphic Design School so you can learn what makes graphics, fonts, colors and other elements look nice on the screen.

Even though I am now adding these tools to my professional designers toolbox (and kind of feel like a sell out), I am going to keep my head high and not lower my standards. I don't want to ever turn down business, but I don't want to damage my reputation as a designer by producing Crapid. I'll post samples to this blog as I develop so you can tell me if you think they are awesome or if I fell into the Crapid crack.

I was doing some work for a client and had to load in some .swf files generated by a 3rd party program. I admit it - I LOVE text effects. I like fades, but when the text can bounce or flip or swirl in, sometimes it adds a bit of snazz to the eLearning project. As long as you don't overdo it, I think the learner's get a kick out of the occasional bits of visual eye candy.

On my Mac, I use a program called Text-Osterone, from a company called Vertical Moon. The software allows you to create a bunch of editable special effects you can apply to text. The current version only seems to export to an AS 2.0 version .fla, so I export the file to a .swf and then dynamically load it in. (I am working ever so hard to leave AS 2.0 behind me...)

Of course, in AS 3.0, it requires a bunch of code lines to load the external .swf, but my solution below pares it down to the bare basics.

First, make sure the .swf you want to load is in the same directory as the .swf loading it. You can play with paths if you like, but for this code, just keep the whole shebang together.

When you want to load the .swf, add a key frame and then add the following code:

var swfRequest:URLRequest = new URLRequest("connect.swf");
var swfLoader:Loader = new Loader(); 

The first line sets up a variable called swfRequest and it points to the .swf you want to load. In my example, the .swf I want to load is called "connect.swf". The second line preps a variable called swfLoader to...well...initiate a load...(insert random inappropriate comment here)...

Next lines:

swfLoader.load(swfRequest);
addChild(swfLoader); 

This next line loads the connect.swf into the variable swfLoader. The addChild line plops the .swf onto the stage. That's it. Sure, its a lot more work than the old LoadMovie(); AS 2.0 command, but it does the job.

Now, if you want to place the .swf in a particular location on the stage, you can manipulate it's coordinates once its been loaded into your main .swf.

swfLoader.x=10;
swfLoader.y=120;

This sets the X and Y placement of the .swf after its been loaded in. Of course, you can place it wherever you want. Remember, that the X and Y coordinates are relative to the main timeline (if this is where you dropped this code) or relative to the coordinates INSIDE a movie symbol (if you drop this code into a movie symbol.) The final code looks like this (with comments added):

// Load the SWF into the Variable swfRequest
var swfRequest:URLRequest = new URLRequest("connect.swf");
var swfLoader:Loader = new Loader();

// Bring the SWF into the SWF
swfLoader.load(swfRequest);
addChild(swfLoader);

//Position the SWF
swfLoader.x=10;
swfLoader.y=120;

There are some other tutorials online, but I am a big fan of keeping things simple. If you need to load a .swf and position it on the stage, this ActionScript 3.0 code sample will work every time. Have fun!

I'm having such a dilemma and its driving me crazy. Here is what I'm struggling with: lately, several of my customers have asked me to create or bid on projects where they expect to be able to go in and edit the content, images and layout of the project after the launch. They want to be able to tweak every aspect of the project once its complete. However, they have no technical background and are not interested in learning the tech. As a result, I'm being asked to over-complicate the programming for ease of use later.

First example - a local area church has asked me to develop a web site for them that they can edit themselves. They don't want a CMS (even the free ones), they want to be hand coded. No problemo - I build it in CSS at a fixed width and height per the design from their team. After its built out and they want to start adding content, their editor (who picked up Dreamweaver specifically for this purpose), can't get the WYSIWYG screen to work with my hand coded CSS. Sometimes Dreamweaver, especially older versions, have a hard time rendering the CSS correctly in the WYSIWYG view. The code is solid and displays wonderfully in all browsers, but the client hates it and hates me because it isn't easy to edit in Dreamweaver. After a week of no luck with tutorials and phone assistance, I rebuilt it from scratch using old table code and layout techniques from 2005. They love it. It stretches how they want, its easy to add the content they want and they are super excited about their site again.

I, however, hate it and will not be adding it to my portfolio. It's filled with nested table tags, bloated JavaScript and is "old school" code that I rarely write anymore. However, the client LOVES it and loves me for making their lives easier. I have overcomplicated the "behind the scenes" so the WYSIWYG view works. What!!?

Case number two: I'm bidding on an eLearning project where the client wants all images but the interface to load dynamically and be stored outside the project, all video and audio to load dynamically and be stored outside the project, and all text and headers to be in XML and load dynamically at run time. OK...this is not rocket science, but in an effort to make their lives easier (they won't have to learn Flash to make edits), they are making it much more complicated to develop. It's so much easier to just dump it all into flash, export to .swf and deliver an HTML file and a .swf file and be done with it.

In an effort to avoid learning code or learning Flash, customers seem to be asking for "do it yourself" solutions, when I'm thinking that they should pick up a copy of Dreamweaver or Flash and learn it. It's much more complicated to dynamically load XML text than it is to type the text in the Flash interface. Now, there are very good reasons for using XML for text (I have another client who is going to offer multiple languages and wants to use the same .swf but load the different language XML which is cool), but for simple projects, why make it so complicated?

Couple thoughts:

1) They don't want to pay me to edit the files
2) They don't want to take the chance of me going away and not being around in 3 years when the files have to be edited
3) They expect lots of changes to the files
4) They expect to have to make changes in a speedy, real time fashion

I'm all about teaching a man to fish, but this kind of falls into the "just cause we can, we will." I am all about the straight line - get what you need accomplished in the easiest way possible. Learn Flash. Learn ActionScript. Who says editing an XML file is easier than editing a Flash file? Is this "Do it yourself" idea good for eLearning? Shouldn't it be "Learn the tool."

Am I alone here? Is this something I should just deal with? Since when do customers care about the intricate guts of a project, rather than its functionality, look and feel? Should I just grow up and understand that customers are getting more technical and are asking to "peek under the hood"?

Thanks for listening. Anyone else experiencing this?

It's that time of the year again, when Vegas calls the educational technologists out from their dark work rooms, and when instructional designers and facilitators alike decide to figure out this eLearning stuff and come out to Las Vegas for the ASTD TechKnowledge Conference.

This is going to be another great year with ASTD, and I wanted to let everyone know that I will be presenting three separate sessions regarding Flash CS4.

I'll be presenting a "Getting Started with Flash" pre-conference session on 1/26/10! Its a fun primer to get you up and running using Flash, but is targeted towards the eLearning professional. It's for the new learners, but will be a full day of Flash related fun. (Can you say "Flash Related Fun" ten times fast?)

Also, I will have two Creation Stations on Flash called "Flash Animation: Basics of Making Things Move" on Wednesday the 27th and Friday the 29th of January. This is a 90 minute hands-on session where you will learn the basics of symbols and tweening in Flash CS4. Yes, it's pretty basic, but will be a blast, especially if you are brand new to Flash CS4.

I'll be blogging and podcasting from the General Sessions and sometimes from the concurrent sessions I'll be attending.

I am coming into Vegas on Monday night and leaving on Friday afternoon, and I am usually walking the floor or expo when I'm not in session. Feel free to say "hello" if you see me wandering around! Also, I will be attending the "Meet to Eat"sessions in the evenings, so if you want to connect with me ~ I'd love to talk tech!

I have been hunting for a way to test my SCORM packages before sending them to my customers for review, and with the help of one of my clients, I found an excellent resource.

SCORM.com has an excellent tool called Test Track. It allows you to upload your SCORM .zip file into a working/testing location that gives you everything you need to evaluate and debug your SCORM packages. The link is:

http://www.scorm.com/scorm-solved/test-track/

I always get so freaked out when sending SCORM packages to clients without testing...the debug process can be a pain. This tool, which is FREE, found a silly "&" in my .xml which I was able to fix before sending the final versions to clients.

Did you catch that this tool is FREE!??!

SCORM scares and frustrates me, but this is an awesome tool from Rustici Software that made my life so much easier today. I set up my free account and will be living here as I develop eLearning for my clients. Thanks scorm.com!

I recently engaged in a debate with one of my colleagues regarding the virtues of building eLearning projects that take advantage of current technological bells and whistles vs. building your project to work on older technology. The point boiled down to the fact that the users are sophisticated enough to download and upgrade their browsers which will allow them to experience the cutting edge stuff, so there was no reason to not utilize bleeding edge.

I disagreed.

It's been my experience that the home and small business user adapts and upgrades their technology way before the typical business user. It is also my experience that web marketing folks, web design folks and eLearning programmers at large organizations usually have the best hardware and software. They are usually given lots of control when it comes to what's installed, and often given the ability to install whatever software they need.

Not so for the rest of the organization. The sales teams, engineering teams, financial teams and other folks in the firm are not so lucky. On their first day, IT usually goes back into the closet, blows off the dust and pulls out an older machine for them to use. After all, it doesn't take much computing power to run MS Office and a web browser.

That's generally where the problems occur. The designer creates a multimedia masterpiece that the user cannot experience as intended. Did you know that the cool and interactive Flash demo requires the processing power of the host computer to make it run? Yes, after the .swf is downloaded to the user's machine through the browser, it still requires the processing speed of the user's computer to run correctly. This means older, slower, computer :: clunky Flash presentation.

And, the first thing that gets sacrificed in the Flash presentation is animation frame rate. Flash prioritizes the audio track before the animation, especially if you stream rather than event program your audio. What this means is that the audio track plays perfectly, but the animation stutters and hacks between keyframes to keep up.

Also, don't forget bandwidth issues. At last count, as much at 63% of home users have high speed connections. Most businesses do as well. However, if you forget that almost 40% of the users don't have it, you are losing almost half your audience! If you rely exclusively on large video and swf files that take forever to download, your learners are not learning...they are watching the %loaded figure slowly creep up.

Even though users have the opportunity to upgrade their browsers, many IT groups refuse to give admin rights to their users and frequently lock down software installation. Some IT groups lock the computer to a certain operating system and browser version. User's don't have the option of installing new technology, even though its readily available.

In my book, Technology for Trainers, I talk about an instructional design methodology for the creation of eLearning. When building eLearning for an organization, either the one you work for or for a client, you need to perform a technology review. What computer systems do they use? Operating systems? Connection speed? Average user's processing speed? Do they have the ability to install plugins? What is the current Flash plug in version? What is the current browser version? Do they have speakers? Higher end video cards? Can they save files from the web to their computer? Do they have a LMS? These are all questions that have to be answered before you build.

If you have an eLearning requirement in place and your learner cannot meet that requirement because of their technology sitting on their desktop, you have lost and frustrated that user. Also, you have put them in the uncomfortable place of being non-compliant with the learning initiative. You must perform a technology review in order to ensure that every user has the capability to see and experience your eLearning.

Does this mean you may have to design your course around IE 6.0? Yes. Does this mean you cannot use the new CSS anonymous table elements for layout? Unfortunately, yes. If your client is standardized on IE 6.0, you may have to dump CSS all together! Does your client have remote locations still using dial up? If yes, then you have to dump multimedia.

In conclusion, I must quote Ian Malcom, the Chaos Theorist who said "...your scientists were so preoccupied with whether or not they could, they didn't stop to think if they should." Just because we can do a thing, doesn't mean we should. Stop and think about your learners and ensure that your chosen eLearning technology will run on their systems, and that it is a learning opportunity they can experience. Don't be afraid to use old technology or design methods as an added insurance policy that it will work on your end-user's machine. Don't be afraid to abandon a technology if it won't work well for your users. Use the right tool for the job, but be sure your learners can learn from it.

I love Flash. In my opinion, regardless of skill level, Flash CS4 is still the best overall development tool for eLearning. Yes, I am a fan of some of the eLearning suites, but for me, developing from a blank slate where anything is possible is a wonderful thing.

When I first started out, however, a blank slate was scary. I was clueless on where to begin let alone best practices. Coming from a web background, I knew how to design for the web, but to use Flash as the main development platform opened up a wide range of choices. Over the years, I've narrowed down my development methods to three option. Everything I currently design follows one of these three methods.

Method One: HTML Pages
For SCORM based projects and for very large projects, I use a simple strategy of creating Flash "pages", attach it to a single HTML page and then link all those "pages" together. This allows me to use HTML linking to move from page to page, and results in very small Flash files. A single "screen" or concept appears on each "page", and the user moves from HTML page to HTML page. The benefit to this method is that the file sizes are small and SCORM tracking can be easily implemented. The downside to this is that you have to be very creative when passing variables from HTML page to HTML page and that there are a TON of files to keep track of. Each "page" consists of a single HTML document and single .swf file. I would say 25% of my current development uses this methodology.

Method Two: One Large .SWF file
My most popular method is to create one large SWF file that has the entire eLearning program contained within it. I use each frame of the movie as a single "page", and use lots of embedded movie symbols on the timeline. Even though users are moving from frame to frame, using movie symbols allows me to cram lots of content onto each of those frames. The benefit is that it is really easy to edit and implement, but the .fla file gets huge if you have lots of media. Also, Flash CS4 chokes on embedded movie symbols (on my Mac only it seems...) I compensate for the larger .fla files by externally calling the video and audio files and keeping them out of the final .swf. SCORM can be a pain to implement (especially if you want to track each module as a separate SCO), but its possible with some hard work. About 70% of my eLearning is built using this method.

Method Three: One .SWF that Loads Additional .SWFs
I used to build the majority of my eLearning using this method, but AS3 has made the strategy code intensive. Rather than fight it, I've adopted my methods and learned some workarounds, but this is still a great methodology used by developers. Basically, a single .swf is loaded in a single HTML page. This single .swf file contains navigation elements and the basic interface for the eLearning project. At launch, the single .swf loads a second .swf file, displaying content and information. As the user clicks on different pages and modules, the second .swf file is replaced by new .swf files as the user navigates through the project. The benefits include smaller overall files, faster load time and sleek user experience. The down side is that this loading and unloading used to be easy in AS2, but is a chore in AS3. Also, similar to method one, you have lots and lots of .swf files to keep track of.

These are the methods I use every day to build my programs for my customers. I'm sure that there are others out there, and I'd be interested in hearing those! Let me know what you think!

Quick Note: If you liked my Podcast interview with Roger Courville, then you will love his new book: The Virtual Presenter's Handbook. The book just got released and is available for you to purchase.

If you are looking to improve your ability as an online facilitator, or if your company is considering bringing synchronous learning to the firm, this book is fantastic.

A full table of contents is available here!

You can get more info and order the book by clicking here!

I am finishing up a series of web based eLearning projects where video segments play a major role in the delivery of the content. My client did not invest in a super expensive video camera, lights or sound system, but the video elements look good and the content more than makes up for the lower production quality. The challenge has been that each elearning project uses 6-8 video segments and I received 30 .MOD files all at the same time. How can I rapidly develop this eLearning with so much video to edit?

The .MOD files are the pure video files that get downloaded from the video camera's hard drive to your local computer. They are huge based on the amount of video recorded. My workflow for the conversion process is this:

1) Convert the MOD to MOV
2) Put into iMovie to edit out start and end content, and add fade to black at the start and finish
3) Convert the MOV to FLV

On my Mac, I convert the .MOD file to the .MOV file using an incredible piece of freeware software called FFMPEGX. It does a great job of converting the files and has a huge set of preset conversion settings. It reads a ton of formats and exports to a ton of formats. Its truly amazing bit of software for the Mac.

Why convert the .MOD to .MOV? Because I want to do some quick and dirty video editing and on my Mac, iMovie won't bring in the .MOD files. If I had the camera, I could download direct, but I don't so I have to convert. Also, the .MOD to .MOV conversion takes the file size down by 50%! A 30MB .MOD file is a 14MB .MOV file. For web distribution, the smaller the better.

In iMovie, I upload all my .MOV files and then do the simple cuts and video fades. iMovie is great - it allows me to tweak color, brightness and other simple settings without cracking open the serious video editors. When I am done, I export out of iMovie using Quicktime and reduce the overall screen pixel size. My client sends me large video segments and I have to reduce them down to a more web friendly size. Doing it out of iMovie using Quicktime allows me to have yet another file size reduction. The 14MB video file is only 4.8MB now!

Then, I open up Quicktime Pro on its own to convert to .FLV. For some reason, a straight export to .FLV out of iMovie doesn't work for me, so I open up Quicktime directly to convert to the Flash video file. Converting from the .MOV to the .FLV is also yet a fourth reduction in overall file size. The 4.8MB .MOV file is now a 3.1MB Flash video file. WOW! From 30MB .MOD to 3.1MB .FLV in about 20 minutes.

Why don't I use the Adobe FLV Video Converter instead of Quicktime Pro? For me and my system, it takes twice as long to convert using the Adobe product than Quicktime Pro. When I am on a deadline, an extra 5 minutes per conversion can save me hours. As someone who stays up until the job is done, that can mean the difference between going to bed at 11 and going to be at 2:00 am!

This video process is quick and dirty and inexpensive. This "mini studio" I have on my Mac costs less than $150. iMovie comes with my iLife on my Mac, but I upgraded to iLife for $79, Quicktime Pro is $29.99 and FFMPEGX is FREE! That's a ton of video editing power for a little bit of money. Does it look professional? You bet! Is it the best solution for all situations? Nope. For longer video segments (these project segments are 2-3 min in length) then the big boy applications will be the ticket. But, for these quick video jobs, the "mini studio" is all I need.

In the past week, I've received three emails regarding linking to MS Word Docs and PDF files from within a Flash movie. It's relatively easy, but the differences between doing it in ActionScript 2.0 and 3.0 are significant.

In ActionScript 2.0

In ActionScript 2.0, linking to a file uses the

getURL

function. Now, normally you'd use the

getURL

to launch a web page or open a new browser window by attaching the following code to a button symbol:

on (release){
    getURL("http://www.thomastalkstech.com");
}

This tells Flash that when the user has clicked on and released the mouse button, launch the web site in the same browser window. If you wanted to open it in a new window, you would need to append the command like so:

on (release){
    getURL("http://www.thomastalkstech.com","_blank");
}

The addition of the target variable (_blank) tells the browser to open in a new window.

Because the .swf sits in an HTML file, it thinks its part of a web site. Regardless of whether or not you have the files sitting on a web server, when you launch the .swf it runs in the browser. This means that the files that sit in the same directory as the .swf are accessible using the

getURL

function.

So, if you had a .pdf file on the web server and you wanted to link to it from your Flash movie, you would use this code:

on (release){
    getURL("myCoolFile.pdf","_blank");
}

and Flash would link to the PDF from within the Flash movie. Absolute and relative pathing work as well, so if you had stored the .pdf file in a directory called /pdf, you could use this code:

on (release){
    getURL("/pdf/myCoolFile.pdf","_blank");
}

IMPORTANT NOTE: The pathing in the Flash file needs to be from the HTML file holding the .swf file. It gets confusing and frustrating, but if you path the ActionScript from the HTML file holding the .swf, it will find the document without a problem. It used to kill me because sometimes I'd path from the .swf, then move the .swf to a new directory and it would mess up my links. If you use root relative pathing it won't be an issue, but if you use relative pathing, be sure to path from the HTML file holding the Flash.

You can link to any file using the getURL code outlined above.

In ActionScript 3.0

Of course, in AS3 they had to go out of their way to make it more difficult...instead of three lines, its now seven lines of code. Again, not difficult, but more details need to be added to launch the URL.

First, create a new variable for the URL. We are calling the variable 'request'.

var request:URLRequest = new URLRequest("http://www.dwebstudios.com");

Then, create a button instance and call it whatever you'd like. In the example below, the button's name is called myButton. You are going to create the function call for myButton using EventListener.

myButton.addEventListener(MouseEvent.CLICK, goWeb);

So, we've created the listener to launch the function goWeb, so we create that next:

function goWeb(event:MouseEvent):void {
     navigateToURL(request, "_blank");
}

So, the entire code block is:

var request:URLRequest = new URLRequest("http://www.dwebstudios.com");

myButton.addEventListener(MouseEvent.CLICK, goWeb);

function goWeb(event:MouseEvent):void {
     navigateToURL(request, "_blank");
}

To link to a document, replace the variable in the URLRequest object with your .pdf name or file name and it will launch as expeted. The same rules apply for the target string and pathing as in AS2, but the entire code block is longer and more dramatic.

var request:URLRequest = new URLRequest("myCoolFile.pdf");

myButton.addEventListener(MouseEvent.CLICK, goPDF);

function goPDF(event:MouseEvent):void {
     navigateToURL(request, "_blank");
}

So that's it! I hope this helps!

P.S. If you want to link to an email address you use the same code as above in AS 2 and 3 but you replace the object with 'mailto:yourMail@yourEmail.com'.

AS 2

on (release){
    getURL("mailto:yourMail@yourEmail.com");
}

AS 3

var mail:URLRequest = new URLRequest("mailto:yourMail@yourEmail.com");

myButton.addEventListener(MouseEvent.CLICK, goMail);

function goMail(event:MouseEvent):void {
     navigateToURL(mail);
}

This past week I finished up my last ASTD Essentials Webinar Series and again had a "virtual" room full of highly engaged, highly interested learners. It was interesting hearing from this group: they are all going to be the eLearning Obmudsmen I commented on in an earlier post. As I was going through the software examples and demos, I started getting some really good questions about process. I have a standard routine that I use when building my eLearning project from scratch, and I thought that it might be of benefit to my reading audience.

After meeting with a client and getting my first installment check (!), we start the following process:

1) Instructional Design Phase

Some of my clients have at least an outline of the content to the site, some have complete storyboards, but most are somewhere in between. Its my team's responsibility to take what they have and build out a storyboard for their review. We use a PPT based storyboard to document screens, activities and simulations in a way that makes it easy for the client to see how their program will function and flow.

Read more »

I've been working with some print designers on making the transition from print to web media. I realized that many instructional designers may be facing the same situation, so I thought I should post about the differences between designing for print display and designing for web display.

The main difference between the two media is the way in which size and dimensions are measured. For print, the units of measurement is points and inches - on the web, its all about the pixels.

For your print work, you measure out your page size (8.5" X 11") and you know that a 4.25" image will take up half the page width and display at exactly 4.25" wide. On the web, you don't have that level of control. You have to set your picture to display at a certain size (400 pixels wide), but that's about all the control you have about the way it displays.

Let me talk a little bit about pixels for a second... A pixel is a single square of color, arranged on a grid - it is the smallest unit of measurement on a computer screen. The challenge we face as designers is that that the actual "unit of measurement" changes size based on the computer screen used to display the image.

Your typical computer laptop displays at 1280X1024. Do you ever wonder what that means? That means that there are 1280 pixels going lengthwise on your laptop screen, and 1024 pixels going along the height of the screen.

You probably know that the higher "resolution" is better, but all you are doing when you increase resolution is increase the number of pixels that are crammed onto the screen, resulting in smaller graphic files and smaller text and icons. Also, you may experience a distortion of your images on monitors that are working hard to display at a higher or lower resolution than "native" because it has to compensate for resizing the pixels.

An image that is 400 pixels wide will take up half the screen size on a monitor set to 800X600. An image that is 400 pixels wide will take a little more than a third when displaying on a monitor at 1024X768. The same image file will display differently depending on the computer screen that displays it.

That can be very frustrating to designers used to the concrete measurements of print. It is almost impossible to set a screen layout to display "a 1 inch border around the outside of the main content on the page." Instead, its possible to say display "a 100 pixel border around the outside of the main content on the page." That can be set easily, but know that depending on the user's machine and resolution settings, those 100 pixels will take up a lot of space, or just a little.

If you are a print designer, getting used to the abstract medium of pixels over exact measurements can take a bit of time. Know that getting it to look perfect on your screen can create a mash up of ugliness on a different screen. Experiment with different resolutions to ensure your final product looks close to your final vision.

Of course, users can change their browser settings to display different font types, turn off images and flash objects and disable link functions when surfing into your pages, but that's a topic for another time!

While conducting the ASTD Essentials webinar this week, I encountered a bit of a shock. Well, perhaps shock is too strong a word, but I definitely got rattled a bit. Let me tell you what got under my skin.

Part of my first day of training is a big session on my idea of an eLearning development "Dream Team":

• Project Manager: The project manager is responsible for ensuring that benchmarks are hit and that everyone is working together to create a fantastic finished project. This person should create a project plan to make sure that time lines and responsibilities are visible to all and that everything runs smoothly.
• Instructional Designer: The ID is the person who is a training professional and has taken the time and energy to follow an instructional design process to come up with the training program. This person creates the templates, storyboards and diagrams necessary to facilitate training through the electronic medium.
• Graphic Designer: The graphic designer is the person who creates all the graphical elements of the eLearning program. This person makes the buttons, the background pictures, and anything else that isn’t explicitly textual.
• Multimedia Designer: Sometimes called the “New Media” designer, the multimedia designer is the person who is responsible for creating and editing digital movies, programming Flash movies, or working with 3-dimensional animation software to create simulations and other effects. Many times, the Graphic Designer and the Multimedia Designer are the same person.
• Developer: This person receives the information and training program information from the instructional designer, the graphics from the graphic designer and the multimedia from the multimedia designer and programs the training.

Read more »

One of the most frustrating things for me to learn in AS 3.0 was being able to find my movie clips in the code. I usually work on a single Flash timeline with lots of nested movie clips that make up my elearning: Frame 1 has an intro movie clip, Frame 2 introduces the course, etc.

My frustration with AS3.0 is that I couldn't figure out how to control my main movie from within my nested movie symbol. For example, in Frame 1, my intro movie plays, and then ends on a screen that explains the learning objectives. There is a big "Start the Training" button, and when the user clicks on it, the ROOT of the Flash movie advances to frame 2, where a new movie symbol plays.

Not that hard right? Old ActionScript code:

_root.play();

Not any more. I'm stubborn...I want AS 3.0 to work like AS 2.0. Suck it up buttercup, it won't. The reality is AS 3.0 doesn't see the "stage" or even the "timeline", relative to the objects. Think of it this way...in AS 1.0 and 2.0, objects added to your movie existed on the timeline, and Flash knew where they were at based on where on the timeline you placed them. They were "happyBall instance on frame 1 of the main timeline(root)."

In AS 3.0, movie clips just "are". Very zen like, I know, but in AS 3.0, they are defined as themselves. It doesn't matter where they are on the timeline - their identity is not connected to where they are placed. So, trying to add "root" to an AS 3.0 object is like trying to tell a book to go back to the printing press where it was created. Can't do it on its own - it has no awareness of its location.

After searching around the web, and finding a ton of different solutions (some of which seemed overly complicated, especially the ones that said to replace

_root

with just

root

...doesn't work...nice try), the kind developers at Yahoo found a working solution. It goes back to the day when you were able to identify anything based on its location, relative to the root. The code looks like this:

MovieClip(this.root)

So, in our example, in the movie clip, we have a button that advances to the next frame of the main timeline. There is a movie with some text and a button (named clickMe) in it. In the Movie clip, you would add this code:

clickMe.addEventListener(MouseEvent.CLICK, goClickMe);

function goClickMe(event:MouseEvent):void {
	MovieClip(this.root).play();
}

You can control the main timeline from within movie clips using that bit of code.

I hope this helps you as much as it helped me. Maybe its no longer a best practice to embed ActionScript in movies that control other things besides that movie symbol, but for a guy like me that wants to move from AS 2.0 to 3.0 quickly, I'm going to hang my hat on these little tricks to help me rapidly develop my projects.

Oh...and if you want to download a sample to see this in action click here. Its a Flash CS4/AS 3.0 file that shows you the controls I'm talking about.

I spoke to a group recently about multimedia development for eLearning, and the importance of story-boarding your eLearning project came up. We moved from storyboarding multimedia and animation elements to the entire project. Do I think it is important to storyboard your eLearning? Yes. Do I think you have to grind out every detail in a storyboard? I think it depends on two things:

1. The relationship between the storyboarder/designer, the deveopler and the sponsor
2. The experience level of the developer

Read more »

The next edition of the Trainers Talk Tech podcast is here! The topic of this podcast is synchronous learning. You can call it synchronous learning, web seminars, webinars or even edu-marketing, but I was fortunate enough to interview an expert in this area: Roger Courville.

Roger is a trainer, blogger at TheVirtualPresenter.com, and principal of 1080 Group, an independent training firm that helps companies learn and optimize online presentations and webinars. Together with his co-founder, they have created one of the industry's first independent curricula to teach trainers how to organize and accelerate their synchronous training and edu-marketing efforts.

Listen to it here:

Subscribe to the Trainers Talk Tech podcast here:
http://dwebstudios.hipcast.com/rss/trainerstalktech.xml

During the podcast, Roger and I talked about various books, websites and vendors. Below are the links:

Roger's Resources

• Roger's Blog: www.thevirtualpresenter.com
• Roger's Company: The 1080 Group
• Roger's Toolkit: www.webseminartoolkit.com
• Roger's Tips: www.webseminartips.com
• Follow Roger on Twitter: 1080group

Synchronous Learning (Web Seminar) Software

• Microsoft LiveMeeting
• WebEx
• Acrobat Connect Pro
• Acrobat.com
• Dimdim
• Yugma
• Elluminate
• Saba Centra
• Citrix GoToWebinar

Books

• Work Naked: Eight Essential Principles for Peak Performance in the Virtual Workplace by Cynthia Froggatt
• Little Red Book of Selling by Jeffrey Gitomer

PowerPoint Tips

• Guy Kawasaki's 10-20-30 rule
• 5X5 rule of PowerPoint - no more than 5 words across, and five lines down

Please enjoy the podcast and subscribe if you like it! I'm going to be accelerating the frequency of the casts to one every two-three weeks instead of monthly. I have my next interview lined up for the first week in March!

Thank you for reading and listening...I hope you enjoy the podcast. Also, a sincere thank you to Roger for sharing your expertise and experience.

Berrett-Koehler Publishers, with whom ASTD and I have an ongoing copublishing relationship and who recently helped ASTD develop the digital version of the Handbook, will be publishing all of the chapters of the ASTD Handbook for Workplace Learning Professionals as stand-alone digital whitepapers as part of a series they’re calling Fast Fundamentals. I'm Chapter 23: Authoring Techniques and Rapid eLearning!

The Fast Fundamentals series will have a dedicated page on the Berrett-Koehler web site, the centerpiece of which will be a unique search engine that will allow readers to find a digital whitepaper on a specific workplace challenge. This page is currently in beta-testing - take a few minutes to try it out!

After you click on the link and the home page opens, choose a Topic from the menu. A list of Challenges will pop up. Click on a Challenge, and a Solution—a list of whitepapers—will appear. Click on one of whitepaper options, and the first page of the whitepaper is revealed with an option to purchase the content. To try out this unique whitepaper concept click here !

Berrett-Koehler will be adding explanatory text and the ability to search by author name and by title of the whitepaper soon. The scheduled launch date for this service is February 19th.

The Fast Fundamentals whitepapers will sell for $3.95 to $9.95 depending on length, but for the first week—from February 19th to February 27th—Berrett-Koehler will be selling them all for the special introductory price of $.99 each. The book is huge - it retails $139.00 and has 49 chapters... but look - if you want to buy the entire book via this introductory price it could save you some serious money. The book has less than 50 chapters...that means for this 99 cent special, you can get the whole shebang for less than $50.

If you want to save some trees, this could be a great opportunity to pick up the whole book at a substantial discount. Here is the link again.

If this is your first time reading a web page, then let me introduce you to the upcoming generation that is causing everyone, everywhere to pause a moment and reflect. The generation is called Gen Y, or Millennials, and anyone born between 1981 and 2000 falls into that category.

Gen Y have been described as:

• Eager
• Impatient
• Type A stress machines
• They cannot make decisions on their own - they rely on their network of friends for input
• They are not loyal to any firm - the view themselves as perpetual independent contractors
• They have unrealistic expectations from the workplace - they adapt their work to fit their lifestyle
• Have an "everyone wins" mentality - they want a ribbon for 14th place
• They have an intimate relationship with technology

Read more »

This tutorial was my presentation at the ASTD TK 08 show in San Antonio Texas. While running the creation stations at this year's conference, many people asked me about the materials I used for last year's session. Yes, the main interface is CS3, not the current CS4, but ActionScript hasn't changed. Therefore, this manual can be very helpful if you are making the bridge to AS 3.0 from AS 2.0, or you want to just get started with AS 3.0.

Foundational ActionScript 3.0 with Flash CS3 for the Online Learning Developer
ASTD TK 2008

Module 1: Communicating with ActionScript
Module 2: Using and Writing Functions
Module 3: Basic Interactivity
Module 4: Decision Making
Module 5: Text and Text Fields
Module 6: Video and Audio
Module 7: Creating Online Learning

In Module 7, I have created two (2) sample AS 3.0 eLearning interfaces that can be used to easily drop in content. The first one (Template 001) is a single .swf file and it is a time-line based, "menu on the left" driven course. It is a single file which is quick and easy to use. Functions included in interface 001:

• Clicking on a button and going to a URL
• Clicking on a button and going to the next frame
• Clicking on a button and going to a previous frame
• Dynamically pulling data about frame position and total frame numbers
• A movie clip code changing properties of the parent movie

The .fla and .swf code is in the module 7/template001 directory.

The second interface is a bit more advanced. It consists of a single .swf file containing the menu and interface elements. However, when the user clicks on the menu, it dynamically loads the new module .swf files into itself. I used to use this technique in AS 2.0 all the time:

loadMovieNum

It was my favorite function!

Unfortunately, they killed it in AS 3.0. This template contains the code for building eLearning using AS 3.0 that mirrors the functionality I used to enjoy in AS 2.0. Functions included in Interface 002:

• Clicking on a button and going to a URL
• Clicking on a button and going to the next frame
• Clicking on a button and going to a previous frame
• Dynamically pulling data about frame position and total frame numbers
• Dynamically loading new .swf files into the main file
• Independent controls existing inside of a loaded .swf
• A movie clip code changing properties of the parent movie

The .fla and .swf code for the start page and all the additional pages is in the module 7/template002 directory.

This course took a lot of time and work to complete. I offer you these two templates so that they can potentially shave a ton of time off of your eLearning development, or provide you with code snippets to use in your own projects. Please feel free to download and use as you see fit.

However I ask you:

1. Please don't mass distribute in your office - don't make a ton of copies and give them to all your friends
2. Please don't use it to teach a class - don't download it and then use it as your own course materials
3. Please don't use download it and then distribute it off of your web site
4. If you found it useful and it saved you time, please add a comment to this page - it helps my SEO
5. If this was crazy helpful and it saved your bacon at 3:00 am, please consider a donation. It encourages me to continue posting these types of tutorials and helpful files, as well as creating new ones for your use as an eLearning developer

Thanks and enjoy the tutorial! And if you donate, thank you very much for the contribution!

Download the file - 23 MB zip file

Since the ASTD TK show, people have been hot on these three software packages: Articulate, Captivate and Lectora. On my webinar series, with email and via twitter, people have been asking me about these packages. Here is my summary of each - I actually replied to someone on LinkedIn about a month ago. Here is a copy of that interaction.

Read more »

Leo Lucas is an eLearning consultant who has made a series of SCORM templates that are inexpensive and easy to implement. I talked about his site at ASTD TK all last week, and I wanted to link to his site from here. I spent about $500 here and it has saved me hours and hours of work around simple SCORM implementation.

Thank you Leo!

Visit the software section for Flash, HTML and developer toolkits which make SCORM less painful to implement.

http://www.e-learningconsulting.com/

As always, ASTD put on a great show in Vegas. I am looking forward to following up with all the new people I met and learned with. I cannot wait until '10!

I had three sessions I conducted: Two Creation Stations and a Tech Intensive. I have to say that the Tech Intensive was a blast. I had about 80 people in the room, and we talked at length about the Adobe CS4 Web Suite. 90% of it went well, but I had one SoundBooth snafu and one Flash ActionScript 3.0 snafu. Before the session, I said to myself that I'd create an interaction using ActionScript 2.0 because I know that cold, but then reminded myself that I made a pact to only program in ActionScript 3.0. I know how to get things built, but some of the calls are still new to me. I forgot to add the

(event:MouseEvent):void 

to my function call. Grr...Oh well. We laughed and got it working when I finally relaxed enough to think clearly. Building a site in the privacy of your office is much different than building in front of a room of learners!

Here are links to my materials from the sessions. If you were not able to attend, I understand! Here are the materials in PDF format:

Creation Station
Flash CS4: Get a Taste of ActionScript 3.0 Hands On! : PDF File

Tech Intensive
Integrating Adobe Creative Suite to Maximize E-Learning Development
PDF File
PowerPoint File

Also, if you attended my Tech Intensive, you remember that we built a "New Hire Orientation" online guide for Tommy Gun's Garage, a dinner theater and "speakeasy" out of Chicago. I thought you might like to see what I built for the client.

View the comp here.

Its just the prototype in a flat Photoshop file, but you can see what a little time and attention can do for good web design.

Thanks for talking with me, laughing with (at) me and having a great time in Vegas at the ASTD TK show.

Now, go build something cool!

P.S. I haven't forgotten to put the David Pogue Web 2.0 list up from the first day of the conference...It will be up soon...

Our first Trainers Talk Tech podcast is here! The topic for this first podcast is online social networking. I had the pleasure of interviewing Jenna Papakalos, President of JRMP Enterprises, an expert on the topic of social networking. During this session we talk about Facebook, LinkedIn, MySpace and Twitter, and how the HR or Training professional can start creating an online network of people.

Listen to it here:

Subscribe to the Trainers Talk Tech podcast here:
http://dwebstudios.hipcast.com/rss/trainerstalktech.xml

During the podcast, Jenna and I talk about various books and websites. Below are links to everything we discussed:

Websites

• Facebook
• LinkedIn
• MySpace
• Twitter

Books

• I'm on Facebook - Now What by Jason Alba and Jesse Stay
• I'm on LinkedIn - Now What by Jason Alba
• Never Eat Alone by Keith Ferrazzi and Talh Raz

Please enjoy the podcast, and if you like it, then please subscribe. I plan on interviewing movers and shakers in the eLearning industry, as well as create solo broadcasts.

Thank you for reading...I hope you enjoy the podcast, and thank you Jenna for sharing your expertise!

I'm very excited about ASTD TK 09 this year. I'm looking for some new ideas and new ways of thinking and programming, and I hope that you will tune into my daily reporting from the conference. I plan on writing each day, providing you with "on the scene" details, information and opinions.

Also, I am happy to be presenting on Wednesday, Thursday and Friday morning. I will be sharing my presentation notes and materials on this site. I have a fun ActionScript 3.0 primer and an analysis and demonstration of the Adobe Creative Suite 4, specifically Flash, Dreamweaver, Photoshop, Fireworks and Soundbooth. I know...the eLearning Suite just came out...why don't I feature that? Two reasons:

1. ASTD already published the conference materials
2. My MacBook Pro can't run Captivate or Presenter without Parallels and an installation of Windows. My Mac Pro has the Windows "Virus" installed on it, and I just cannot bear to subject my mobile silver brain to that kind of abuse.

More news: Tomorrow morning, I am recording the first edition of the Trainers Talk Tech's Podcast. I'm interviewing an expert in the area of electronic social networking. I'm interested in her opinions about the trend and the methods and implications for the eLearning developer. Look for links to the podcast links soon.

I've noticed a trend on the social networking groups, and when I talk to people at the conferences I present at: trainers and instructional designers are freaking out again. I mean nervous, edgy, freak outs about eLearning. In 2000, training and development people were losing their minds because they believe that the sky was falling and eLearning was going to steal their jobs. They were convinced that they would be replaced by a screen and a mouse. Nothing was further from the truth, as eLearning has grown into a tool that is used as a part of an overall training strategy.

Most of the eLearning in 2000 was awful, text driven stuff created by tech people who didn't care about how people learn. They wanted to exploit this new technology and throw everything up against the wall and see what stuck. We have developed best practices we are using today because of all the crazy things developers tried early on, myself included.

But, that has changed. Good eLearning is hard to create, not always from a programming perspective, but from the design perspective. Tools have been created to rapidly develop, but the amazing, interactive custom stuff still takes lots of time to plan, design and build. Which brings me back to my first question : why are people freaking out?

Read more »

Before the year was up, I had the opportunity to host the training technology section of a one day conference hosted by our local ASTD chapter. I was given an opportunity to attend the entire day, and recently I had cause to dig up the materials from that day.

The first session of the day was called Brain Gym for Trainers, presented by Patti Templin. Patti was an enthusiastic speaker (for 8:30 am, she was better than a cup of coffee) who presented her topic on Educational Kinesiology - Brain Gym. I was skeptical at first, but then I started thinking about a problem we have as eLearning developers, and how something like a Brain Gym could be incorporated into an online program.

First, a Brain Gym is a series of body movements that enhance the learner's experience of "whole brained" learning. By performing these body movements, students are able to access those parts of the brain inaccessible to them, changing behavior and learning. To learn more, visit the Brain Gym web site. The research is amazing!

The motions are simple and rather fun. There are 26 distinct movements that help "jump-start" the brain. I know...it seemed a bit far fetched to me, and in the moment, I felt the same way. However, the more I thought about it, and yes, did it in the privacy of my office, I found myself more plugged in to my work.

Then, because I am hopelessly plugged in (I'd be a BORG if I could), I started thinking about how to incorporate these "brain gyms" into eLearning? Should there be a specific intro page with directions:"Now, before we begin, let's engage your brain. Stand up, spread out your arms, and..." Would the adult learner do it? "Welcome to Interviewing for Success. Before we begin, grab your ear lobes..."!

But what about creating learning for the K-12 group? This research has originally targeted that group, so why not incorporate the Brain Gym strategy into online learning dedicated for that group? We should be focusing on the transfer of knowledge, and if one or two brain gym activities kick off the eLearning project, what's the harm in that? I think it would be a kick if a computer lab full of students suddenly stood up and started stretching! Would it have an impact on the eLearning program they were about to take? I think so. If you develop for the K-12 audience, contact the Brain Gym people and see how you can incorporate it. I really think it could take your projects to the next level.

Unfortunately, I do very little work in the K-12 area...not because I don't want to, but because I don't have clients in that space. Am I willing to add Brain Gyms to my programs, targeting adults? Not yet. Is there a good reason NOT to? Not really...maybe I don't want to fly too far out of my programmers' comfort zone. Can I sit in front of a client and confidently pitch Brain Gym? No. I don't feel like I know enough about it. Could be a little more research time is in order...

I received a note from one of the participants in my webinar series that went something like this:

"I've attended your webinar on eLearning software and it was great. But really, how do I get started. What do I do first."

Well, let's start at the start as Dr. Seuss might say.

Building eLearning for web distribution requires a knowledge of web technologies. Forget the training part. Forget the learner for just one second. If you REALLY want to get started you need to set up a web page and web hosting. Here is my recipe for setting up a web page:

Read more »

I have been fascinated by the Joomla and Drupal development environments for a long time. I just never took the plunge and learned either. In my business, I do all the design work, the graphic work and the multimedia work and if the back end programming gets to sticky, I turn it over to my developers.

Joomla and Drupal have created web applications that become your content management system and back end plug in system. Anything that makes the back end programming less painful is great for me. If it is great for me, then I'm sure that it would be great for eLearning developers who are intimidated by this web stuff.

So, last night I took the plunge and launched www.myelearningguru.com as a Joomla installation. I picked up a good book on Joomla (Beginning Joomla) and installed on my new web host. I did nothing to it yet, so if you visit it, you can see the standard installation files. Keep visiting, because I hope to blog about the changes there, as well as talk about my experiences with Joomla.

What do programs like Joomla and Drupal do for the eLearning developer? Well, hosted content management, over 100 plug-ins and integration with standard web technologies make me envision the rapid development of internal training portals. For companies that don't want to invest in a LMS or SharePoint platform, maybe these tools can be used in that situation. However, as I work with the tool, I will undoubtedly come up with lots of ideas. From a strictly LMS perspective, I will be talking about Moodle soon, but because I don't want the My Elearning Guru site to be purely LMS, I thought I'd try Joomla. Maybe I could have a Drupal site, and then have a Moodle installation to run the demos on the same site? If I try that, I'll be sure to let you know.

Well, wish me luck. Visit www.myelearningguru.com often and you can witness the development of a Joomla site and a Joomla learning experience all rolled up into one hot mess!

Let's say that you are a stand up trainer who has been hearing about this elearning stuff for a while, but never took it seriously. Or, perhaps you have been hearing about it and realize that you need to start getting into it. Or, most likely, you are in the unique position of being a training professional who is now getting the added responsibility of building eLearning. Oh...and it needs to be done next week!

Aaahhh! What do you do?

Read more »