Have Fun with your Flash Images!

November 24, 2009

Ever wanted to make your photographs a bit more “stylized” or look more like an illustration or cartoon? Here is a quick tip on how to use Flash to turn your bitmap images into vectors.

1. Import image onto the Flash stage.
2. Select the image.
3. Select Modify / Bitmap / Trace Bitmap.
flash_trace_menu
4. Adjust the settings as desired.
flash_trace_settings
Here is the details about the settings (From Adobe Tech Notes):

  • Color Threshold: The range is from 1 to 500. This setting determines the degree to which one pixel may vary in color from adjoining pixels before Flash interprets them as different colors. As you increase the threshold value, you decrease the number of colors.
  • Minimum Area: The range is from 1 to 1000. This setting determines the size in pixels of each shape generated by the trace. The lower the setting, the smaller the shapes generated.
  • Curve Fit: This menu has six settings that range from Pixels to Very Smooth. These menu settings determine how closely the edges between the individual vector shapes conform to the bitmap colors. The Very Smooth setting draws longer curves, while the Pixels setting creates many short curves.
  • Corner Threshold: This menu has three settings; Many Corners, Normal, and Few Corners. These menu settings control the degree a single curve can bend before breaking into two separate curves with corners. Many Corners will yield a smoother line.
5. Viola! Fun images that you can use to add a bit of style. You can also manipulate the colors and backgrounds.
Here are a few examples:
flash_trace_cash
flash_trace_super
flash_trace_faces
Check out our eLearning games and Flash interactions!

10 Design Standards to Create Better eLearning!

November 23, 2009

If you’re thinking about creating eLearning courses you’ve probably started to think about standards. eLearning content needs to follow standards just like classroom manuals and material. When content is standardized it makes it easier for the learner to understand and quickly process the content. They stop noticing inconsistencies and focus on what you’d really like them to – the meat!

Once you’ve come up with your own list of standards, make sure that everyone on the team has them (and lives by them). Don’t be soft. Enforce the standards and maybe even create some templates that are already “standardized”. You could also implement a final Q/A checklist that makes the designer complete a checklist that they followed each standard. After awhile following the standards will just become second nature.

Here is my list of 10 things that I’d include in my list of “standardized items”:
1. Bolding: Decide how to use bolding. To emphasize, as headings, for sections, to indicate actions?
2. Italics: Are hyperlinks italicized? What about names of documents, screens and systems?
3. Fonts: Choose 2-3 fonts and decide which one is for headings, body text, and possibly image design.
4. Colors: Find colors that contrast well. There are many different websites that help create color schemes and check contrast. Just a tip…stay away from lime and purple text.
5. Layout: Design 5-10 different layouts and let the team use them. This saves time because each page doesn’t have to be custom designed each time. It also trains the learner to know how to understand your pages. Consider using e Learning templates.
6. Grammar and tense: Are you talking directly to the learner? Past tense or present tense (maybe future)? Should you be formal or informal?
7. Images: Will your images have shadows, rounded corners, feathering, borders, reflections, be square?
8. Buttons: What buttons will you always use? You might need buttons for next, back, jobaids, exit, simulation, more info, tips, play, course evaluation, get help, FAQs, feedback, and replay.
9. Logos: What logos will you have displayed? Company, department, none?
10. Text Size: What size are the headings? How about the body text?

Bonus List:
- File types: What types of files are allowed and function in the course? (.mov, .swf, .avi, .png, .wmv, etc.)
- Icons: Create a library of standard icons such as: caution, checkmarks, notes, numbers, arrows, etc.
- Interactivity: How do you tell the user to do something? Click the XXXXX button or Click XXXX? Do you bold what action the user should take?
- Bullets: What shape of bullets will you use?
- Course player/GUI: Create a standard interface for all courses. This allows the user to get used to how to navigation and use the courses.

Even More Tips from the Comments Section…Thanks! (view comments below)
- Component names: What do you call parts of the screen? Drop-down menu or List box? How to you tell them to access these components? Select, click, choose, enter, type, etc.

- Capitalization: Make it consistent throughout. For instance, are you capitalizing button names (on the buttons and in instructional references — all lowercase, all caps, title case)? What about certain terms (and if so, which ones)?

Here’s a nice article on Legibility from Adobe Magazine.

I know that I’ve missed a bunch. What others would you include?

(Check out amazing eLearning GamesFlash InteractionsPowerPoint Backgrounds, and e Learning Templates)

Free online Flash Tutorials for eLearning Templates

November 20, 2009

We are pleased to announce our new Flash eLearning Template Tutorials website. This website is dedicated to providing you with useful screencast video tutorials. We will continue adding to it weekly, and as always…feel welcome to request a screencast if you need additional help.

Flash Tutorials Webpage

eLearning Templates

Hope you enjoy…

flash elearning tutorials site

Which is Best…Classroom vs Online Training?

November 18, 2009

eLearning is better than classroom training!

Ok…I’m just being sarcastic. eLearning is actually just different than classroom training. They both have their pros and cons. I want to list a few areas that are positive “pros” for eLearning.

Geography
At times you need to train people that are dispersed geographically. They may be in various buildings or working from home. You could send a trainer out to each area or you could have participants come to a central location. There would be considerable travel and time involved.
Online training could help. There would be no need for travel and each participant could save quite a bit of time and take the training in the office/home.

Trainer Resources and Scale
There are times when you have a big system roll-out or maybe even a company merger situation. When large roll-outs occur, do you have enough training resources? Do you have enough time to put a lot of participants through a classroom experience? Do you have trainers who are up-to-speed on the content?
In these situations online training may be able to supplement and/or replace classroom instruction. Online training could help take the load off classroom crowding. These courses can also go out to many users at the same time.

Maintenance
There are certain courses that seem to always be changing. The system is constantly being updated, the policies keep changing, and the product details are a moving target. How will these changes be handled? How will you update material? How will the trainers get the new knowledge? Will you need to retrain those who previously attended the course?
Online content can be changed once from one location. There is no need to get trainers up-to-speed and no need to reprint materials. You could also quickly create a “recent changes” course to send out to previous attendees.

Facilities
Training facilities are expensive. You may need computer labs, projectors, space, whiteboards, supplies, admins, and more. You also many need multiple building locations.
With online content the user just needs a computer. Now to be fair, there are some eLearning costs that we could consider as “facility”. For example, you need development software and possibly at learning management system (LMS) to launch and track the courses.

Consistency
There are amazing trainers in the world but they each have their own way to training and they don’t say the exact same this each time. Even trainers from the same company may be teaching different topics. Consistency is a concern with classroom content. If your content must be the same each time, then eLearning is a good choice. The course content and delivery is exactly the same each time.
Does the content and delivery need to be the same each time? Does the content need to be customized for different audiences?

Learning Styles
People learn in many different ways. Some like reading, others listening, and others watching. An online course can offer many different ways of learning. Images, audio, text, animation, case studies, games, etc. can engage learners.

As I said at the beginning of this post, classroom and online training both have their pros and cons. Some content seems to lend itself more towards one or the other. Do your research and choose the method that is best for your project/organization. (or maybe even use both)

What other benefits can you think of? Leave a comment.

(Check out amazing eLearning GamesFlash InteractionsPowerPoint Backgrounds, and e Learning Templates)

Spy Challenge eLearning Flash Game Template

November 17, 2009

Another great Flash eLearning game template from e-LearningTemplates.com.

This is a Flash based template that is super easy to update. Each template is fully customizable in Flash (we give you the .fla Flash source file). Made to work within most rapid elearning software (Articulate Presenter, Adobe Captivate, Rapid Intake, Adobe Presenter, PowerPoint and more).

BONUS: Reuse the templates over and over again in multiple courses…or even other websites and presentations.

demo

Specs:

Files included: .Fla and .swf
Requirements: Flash 8 or newer
File size: Final .swf only 144 KB
Output dimensions: 720×540

spy flash game1

spy2

spy flash game3
spy1

Flash eLearning Multi-Game Bundle #2

November 16, 2009

We have just bundled another amazing group of elearning flash game templates.

Visit e-LearningTemplates.com for additional details.

$225 Value! – 4 Games included in this bundle:

These are Flash based templates that are super easy to update. Each template is fully customizable in Flash (we give you the .fla Flash source file). Made to work within most rapid elearning software (Articulate Presenter, Adobe Captivate, Rapid Intake, Adobe Presenter, PowerPoint and more).

BONUS: Reuse the templates over and over again in multiple courses…or even other websites and presentations.

Specs:

Files included: .Fla and .swf
Requirements: Flash 8 or newer
Output dimensions: 720×540

multi_game2

Why Use eLearning Templates in Your Course?

November 16, 2009

Are you developing online training content (eLearning)? Do you want to save money and time? Are there multiple members on your team and you need everything to be consistent? Are there varying levels of technical expertise on the team?

These are just a few questions that we come across while building online training content. Using templates to build eLearning can address many of the questions above. Before discussing a few points let me describe what I mean by eLearning templates.

Templates can include many different assets. Many common ones are PowerPoint master slide layouts that have many different pages ready for you to insert content. There are also various tools that create template interfaces and GUIs for courses. E-learning templates can include buttons, icons, color schemes, images, quizzes, games, and more. Basically they can be used over and over in different projects. Now let’s discuss a few benefits.

Save Time and Effort

Wouldn’t it be nice to have the interface, page layouts, buttons, icons, colors, and the most often used components of an online course ready to go? Right there on your desktop and ready to drag and drop into place?

Having templates ready to goes means that you don’t have to waste time re-creating the same pieces for each course. This can be very valuable for those who may not have a strong background in multimedia. It could take a novice designer a long time to create a flash movie or design an asset that an expert could do in minutes. Also, the quality will be very different.

Another huge plus is that the designers can now spend time focusing on writing good material and less on how to make a button look pretty.

Consistency

Many organizations want their online courses to be consistent. They should have the same colors, look/feel, quality, etc. no matter who the individual designer was. Templates can help achieve this desire. Designers have a base to work from and are all using the same files.

You can also develop a template interface player. This would ensure that learner always have the same navigation options on each course. You could also standardize where links to job aids, outlines, bookmarking, and other features appear. The learner become familiar with navigating your course and doesn’t need to waste time trying to figure that part out. They can jump right into the training.

Technical Functionality

Are there certain requirements that your Learning Management System has for courses to function properly? Are there guidelines that the IT department has? Templates are a great way to build a file that works within all guidelines and then to share it with the entire department. As designers use the template is cuts down on troubleshooting time trying to determine why something isn’t working. That effort has already been done and only needs to happen once.

Move Beyond Your Talent

There are some amazing multimedia designers that can create some great content for online training. Not all instructional designers are good at creating multimedia. Templates can be created to add a lot of professionally designed interactivity and games to courses. All you have to know how to do is edit the template and then you can add content that is beyond your skill level to create on your own.

Increase Output and Creativity

I touched on this earlier but e learning templates allow designers to spend time on what they do best…writing course content. Templates can allow you to spend project time on the “meat” of the course and not on the “administrative” parts. This has two consequences: 1. You can spend time thinking of creative ways to make your course interesting and 2. You can build more courses in a shorter amount of time.

I hope that this article gave you a few ideas around how eLearning templates can help you and your team.

If you would like to see some templates here are some examples:
eLearning Flash Template Interactions
eLearning Games
PowerPoint Backgrounds

Flash interactions and activities

eLearning Flash Games

Create Click Alerts in Flash

November 12, 2009

In this post I show you how to create a button with a “click alert” on it which is a slight animation that indicates to the user that they should interact with the button. The click alert will also gray out after being clicked.

You can use this tutorial to create flash eLearning interactions that indicate to the user that some action is needed. (hey you….click on me!) Also once they’ve clicked on it, you must have it visually change so that they know they’ve already been there.

Here’s the click alert example that I’ll show you how to create:

1. Create a movie clip with whatever animation you want as your “click alert”. For example in this sample alert I’ve created a red circle with a small rotating outline. Notice that the animation goes from frame 1 to frame 20 and then has an action that sends it back to frame 1. Basically I put a frame label named “home” on frame 1 and on frame 20 I put gotoAndPlay(”home”); so that it loops.

click_alert2
2. In your animation movie clip create one frame at the end of the animation that is a “clicked state” frame. So in other words, what will this click alert look like after a user clicks on it? In my sample it grays out and the animation stops. (frame 21) I added a color tint of gray to create mine.
click_alert3
3. Drop the movie clip on your timeline and give it an instance name. (I used “clickalert”)
4. Create another layer (below the layer with your alert) and insert any button that you want. I used a document icon with the words “Course Summary”.
click_alert1
5. Add the action script to your button to launch the url, document, or go to a specific movie frame and to have your click alert go its “clicked state”. 

Below is the code I used on the button. (Only use the click alert code and one of the other snippets. Don’t use both the getURL and this.gotoAndStop.

on (release) {

//Start Behavior – This code launches a document or url

getURL(”http://www.yoursitenamehere.com”,”_self”);

//End Behavior

//This code goes to and stops at a certain frame of your flash timeline (this example uses frame 50)

this.gotoAndStop(”50″);

//End Behavior

//This code goes to a movie clip with an instance name of clickalert and goes to (and stops) at frame 21 within that movie clip. That is the frame that I created as my grayed-out frame.

this.clickalert.gotoAndStop(”21″);

//End Behavior
}

Here are some eLearning Flash Templates that use click alerts:
Grunge
City Ray
Clean Corporate
Pulsing Dots

Best Practices for Creating Online Courses

November 11, 2009

There are many things to think about when creating eLearning. There’s no way that I can mention all of them in this post but I’d like to mention a few that come to the top of my mind.

Course Outline / Storyboarding

  • Know the audience
  • Find good SMEs
  • Always create an outline of the course
  • Storyboarding allows you to structure content flow
  • Decide what knowledge/skills need to be taught first
  • SMEs can take a glance at the flow and content
  • Content creating will go more quickly. (it’s faster than creating content and then starting over)

Text

  • Learners scan, they don’t read
  • Keep it simple
  • Don’t introduce too much information at once (chunks)
  • Use bullets/lists
  • Avoid font color
  • Use bold and italics sparingly
  • Talk to learners or not (choose a style)
  • Formal or informal verbiage

Example: Bad

These are challenging times for the financial services industry.

Increased competition, recent uncertainty in the markets, and increasing expectations are just a few of the challenges we face as we seek to strengthen relationships with our clients.

Example: Good

These are challenging times for the financial services industry.

As we seek to strengthen relationships with our clients, we face:

  • Increased competition
  • Market uncertainty
  • Increased expectations

Consistency

  • Font (Headers, body)
  • Colors (text, images)
  • Grammar (tense, spelling, etc.)
  • Bullets
  • Image placement
  • Introduction pages, end of lesson, test launch, evaluation, etc.
  • Interface and navigation
  • Job Aids and reference material
  • Formatting of list of steps
  • Hyphenated words consistent (i.e. on-line vs. online)

Image Selection/Design

  • Learners scan text and often look at images first
  • Can learners understand your page by only looking at the image?
  • Make them meaningful. (not gratuitous images)
  • Explain the process visually
  • Import the.png, jpg, gif into PowerPoint for best quality
  • Can part of the text on the page be in the image?

Tests/Assessments

  • Ensure that the questions are answered
  • Decide an appropriate number of questions based on the needed score to pass
  • Will you have a pool of questions?
  • Should the questions be randomized?
  • Submit after each question vs. submit all at once
  • Quizzes vs. tests

Quality Review

  • Always click through the finished course before and after the final upload to the LMS
  • Have someone outside of your area click through the course
  • Don’t test the course on the same computer that it was created on

I hope that the previous list helps get you thinking while designing online training.

(Check out amazing eLearning GamesFlash InteractionsPowerPoint Backgrounds, and eLearning Templates)

Flash Interactions Pack: Grunge

November 10, 2009

Included in this PACK are over 30 amazing Flash based templates that are super easy to update. Instructions are included within each of the files. Each template is fully customizable in Flash (we give you the .fla Flash source file). Made to work within most rapid elearning software (Articulate Presenter, Adobe Captivate, Rapid Intake, Adobe Presenter, PowerPoint and more). Reuse the templates over and over again in multiple courses…or even other websites and presentations.

demoe-Learning Templates

grunge flash interaction

grunge flash interactions

grunge flash game interactions

Next Page »

Powered by Olark