From the category archives:

Flash 8

7 Tips For Better Flash Customization

by Collado on August 8, 2008


Seems like Flash is on everyone’s mind lately, I get so many emails from new designers and do-it-yourselfers whom have purchased a flash template and lo and behold their saying “Please help before I pull the rest of my hair out!” Ouch, that hurts!

Generally speaking they’re having difficulties figuring out this new medium or just trying to make sense of the whole Flash environment. And who can blame them, lets face it Flash is nothing if not a little fickle.

Personally it’s over a decade since I first started fooling around with the stuff, still I do not consider myself by any means to be an expert, but try to share the many mistakes that I’ve made and the things that have helped me and hopefully that little bit on knowledge can help keep whatever’s left on top of your head where it belongs. I’ll admit to cutting some corners, but what you’ll get are 7 nuggets of prime Flash customization advice. With hidden features explained, myths exposed and tricks uncovered, these tips are all designed to address our most commonly asked questions with all the right remedies.

These are just my seven that I thought were the essentials, but maybe there are some you’d like to share, so if you would like to comment by all means, we love to hear from you, feel free to share your experiences leave us your comments. And as always should you wish to acquire more information about our template customization services simply jump on over to the contact form and let us know what you’re thinking.

1 – Flash is an Artful Dodger

Flash has a stubborn tendency for shutting downs always at the worst possible times, although, I must admit it does bear a knack for inspiring sympathy, you see Flash is always very cordial about it. For example it’ll say something like Flash has encountered a problem and needs to close, (cute little guy, poor thing), and that it is very truly sorry for the inconvenience, but there’s no time to waist, it must relieve itself at once. And me being the agreeable person that I am will simply click Ok and watch desperately as all my work just disappears never to be mentioned again. Of course there are lots of other good reasons for remembering to save frequently that one just so happens to be mine.

There are also several options that you can use to save a file: ‘ Save’, ‘ Save As’, and ‘ Save and Compact’. When you save a file, Flash does not analyze all the data before creating an optimized version of the document. Instead, the changes you make to the document are appended to the end of the .fla file’s data, which shortens the time it takes to save the document. When you select ‘ Save As’ and type a new name for the file, Flash writes a new and optimized version of the file, which results in a smaller file size. When you select ‘ Save and Compact’, Flash creates a new optimized file and deletes the original file.

Caution: When you select ‘ Save and Compact’, you cannot undo any changes you made before you saved the file. On the contrary if you select Save when working with a document, you can undo changes made prior to that save point. Because Save and Compact deletes the earlier version of the file and replaces it with the optimized version, you cannot undo earlier changes.

Remember to use ‘ Save As’ frequently and to type a new file name for your document after every milestone in your project if you are not using version control software to create backups of your .fla file. If you encounter major problems while working on the document, you have an earlier version to use instead of losing everything.

2 - Stop Tinkering And Listen

Before we do anything we first need to carefully install all the fonts that came with the template. Otherwise Flash is going to hit us with a “Missing Font Warning” alert message. That means that we have not installed all of the fonts included in the package, and that could result in a host of other issues. Here’s what we need to do.

1 - Choose “Start > Settings > Control Panel” (Note: In Windows XP, chooseStart > Control Panel“)
2 - double-click on the “Fonts” folder
3 - choose “File > Install New Font
4 - in the Drives list, select the drive and the folder containing the fonts you want to install
5 - select the fonts to install. To select more than one font, hold down the “CTRL” key and click each font
6 - click “OK” to install the fonts.

Quick Tip! A simpler way to install new fonts is simply to drag and drop all the fonts you want to install onto the “Fonts” folder located within the Control Panel directory.

3 – Putting your text in there

First we should open our “.fla” file from our web design template package in Macromedia Flash. Then if not already open we’ll open the symbols library (hotkey “L”) and browse through it to find the symbol containing the text we want to modify.

Edit text

What’s nice is that all symbols that contain text have appropriate names such as “Company Name” or “About Us” and we can also see them in the preview window at the top of symbols library panel. If we’re unable to see the text for some reason we’ll probably need to change movie background to a different color other than white, as white text on white background stands invisible.

Symbols Library

To do that, we’ll need to choose Modify/Document… from the top menu and change background color in popup window.

Once we have what we’re looking for we want to double click the symbols icon to show text symbol in main workspace window. Then we’ll simply double click that text with “Selection Tool” or single click it with “Text Tool” (hotkey “T“) to edit the contents.

4 - Changing images in Flash

A: Open your source “FLA” file in Adobe Flash and press “F11” to launch symbols library. To perform search of a needed image symbol will be easier if you sort them “by kind” simply by pressing “kind” tab at the top of symbols list. You’ll see that all bitmap symbols are grouped now at the top of the whole symbols library.

Adobe FLash Publishing Settings Window

Bitmap Symbols in Library

Browse these symbols to find symbol your want to substitute. You can see symbols preview at the top of symbols library. When you have found necessary bitmap symbol double click the icon on the left of it as to see the symbol properties window.

Adobe FLash Publishing Settings Window

Bitmap Properties

You’ll see image preview and options there. Check the image size. It looks like 284 x 423 pixels at 32 bits per pixel. To make your image fit the original effects and animation the best way your image must be exactly the same size as in the original image.

You can resize or crop your image using Adobe Photoshop. Open your image in it using “File/Open…” from the top menu. To resize or crop choose “Image/Image Size…” or “Image/Canvas Size…” accordingly. Then save image using “File/Save As…”, for using it in flash choose one of the following image formats: “JPEG”, “GIF” or “PNG”.

Press “Import” button on the left and browse to location of your image file.

At the bitmap symbols properties window you can change the image quality. Make it lower to reduce published file size. Now you should publish your flash movie.

Quick Tip! You can actually publish your movie directly from “Publish Settings” window, see “Publish” button at the bottom. Or you can publish it from every point of Adobe Flash by pressing “SHIFT+F12″ hotkey.

5 - Making The Contact Form Work

This is a real common question but I think I already covered it in detail over on another post so I’ll just give you the link. http://foamers.net/blogger/archives/45

6 – Duplicating symbols

There are times when you need to make customizations to an instance of a symbol without editing the original so that those changes don’t reflect in any other instances of the symbol on your template or affect the symbol in your Flash Library. For example you might want to add a whole new page or you may need to add an extra button etc. Thats when duplicating a symbol comes in handy because it lets you use an existing symbol ( any item in the library) as a starting point for creating a new symbol.

Open your source “FLA” file in Adobe Flash and press “F11” to launch symbols library. From library, what we need to do is right-click (Windows) or Control-click (Macintosh) the symbol, select Duplicate Symbol and give the duplicate symbol it’s name.

Adobe FLash Publishing Settings Window

Symbols library

Next, drag the symbol unto the stage and give it an instance name. Note an instance name and a symbol name are tow totally different things. Meaning, that while there may be two or more instances of the same symbol with the same name “symbol 1”, each instance must have assigned a unique identifier (e.g. instance name) for all ActionScrip reference purposes.

To edit the symbol, you simply double click the symbol to access it in the Main Area. Then double click the text area and enter your own slogan. Once you edit a symbol, Flash updates all the instances of that symbol in your document. You can customize all other Flash elements by repeating these simple steps.

7- SEO for my Flash Template

Can Flash really be made to be search engine friendly? Surprisingly the answer is yes in fact all you have to do is follow these 3 simple steps.

Step 1: When you are finished customizing and or coding your Flash template, go to File -> Publish Settings. Click on the HTML tab and check the “Detect Flash Version” option. You should set this to the lowest possible version that supports the code used in your movie (ActionScript 3.0 cannot be lower than version 9).

Step 2: Open up the HTML file in the HTML text-editor of your choice. You will notice that there is a section of JavaScript code that detects the users Flash Player version. If they have a version equal to or higher than the version you specified in your Publish Setting in step 1, the Flash .swf file will play as planned. You will also notice that there is a place in the js code that reads something to the effect of “var alternate content = “”.

If the user has an older version of Flash than specified in step 1, then this content will be displayed instead via JavaScript (remember to escape quotes in the variable using backslashes). This is where you can include the Flash movie’s content in HTML, and it is completely readable by robots and site crawlers.

Step 3: “What if the user’s browser does not support JavaScript?,” you might ask. Well, that base is covered too. Just under the JavaScript section discussed in step 2, there is an opening and closing tag. You can also put all of the alternate (HTML version) Flash content in between these tags. This serves as a second fallback for Flash.

In summary, if the user does not have Flash, or the version of Flash is too old, then the alternate JavaScript content you defined will try to display instead. If the user’s browser does not have JavaScript, then the “noscript” content will display. Moreover, you have the HTML version of your content being read and indexed by the site crawlers twice! This content can also be styled using CSS like a traditional web page. You can even go so far as to use the same CSS stylesheet to style your Flash and your HTML, but that is a lesson for another day (see Stylesheets, Flash and XML for Dummies).

This article was recently dugg so if you’d like to show your support I’d really appreciated.

Special thanks to Aaron Waldon for #7

{ 0 comments }

The Best Flash Site Templates Ever!

by Collado on July 26, 2008


Back in the day, if you had told me some little animation app would catch on as quickly and as suddenly as Flash. I would have said you were an idiot. And if I had told you that Flash would become the design and development community’s number one tool you probably would have said I was an idiot in return.

That’s what makes Flash such an amazing program. Not only did this small animation app come

full circle, but it led also to the creation of some of the most groundbreaking, incredible and right down crazy cool websites you ever did see.

Through my work at premier template customization site (http://foamers.net) I’ve worked with a number of different clients and projects to attain their unique online presence through the template customization process.

Briefly, the template customization process is the method where with we customize the look and feel of the website template and then merge it with your own content files to create a website that’s both unique and can adapt to each individual client’s needs.

And so, over the years I’ve had the opportunity to see and work with both the best of the best and worst of the worst Flash template ever. The top 5 templates of all time are not easy to compile, but since I’m a firm believer in the notion that you, me, all of us have the ability to teach ourselves anything just as long as the inspiration and desire are there, my attempt focuses primarily on website templates which not only brought us some amazing visuals, but that also generously taught me so many neat new tricks.

Do you agree with my selection? Do you think I’m being too uncritical of the ones I’ve picked, or which one do you think is the best? Lets talk about it – add comment


Number 5

I really like the whole two toned very retro atmosphere here and specially the little mp3 player at the bottom because I can take that whole movie clip and reuse it on any other projects. Template No. 20164 is an original design by author Oldman. Ever since it’s release date it has had 1 download. And there’s even a non-Flash version also included with this template.


Number 4

This one really blows you away. It’s a perfect example of what Flash 8’s all new filters were created for. I love how the animation transitions perfectly smooth, and the blurring on the big numbers for each page its really neat also.

And not only do you get the source FLA files, but also all of the PSD files are available too so you can look at all the different layers, filters and masks that went into the making. Template No. 18708 is an original design by author Maxwell. Ever since it’s release date it has had 1 download.


Number 3

There’s nothing really too fancy about this one maybe other than that whole panoramic slide with the scene effect. What I really like about it is that the author made full use of vector graphics, as well as some very useful ScrollPane components. Template No. 18668 is an original design by author Modlin.


Number 2

Perhaps the most radical innovation in Flash as far as website templates concern is XML Flash Sites, this is just one I choose only because it came with a gallery but there’s lots more and they all come equipped with a system that allows you to edit its content without having to use the Adobe Flash software.

So you don’t have to learn any Flash you simply edit the template’s content from a text editor; so if you’re just starting to learn about Flash and would like to see hands-on how Flash and XML work together this is the perfect way to play around and start getting your hands dirty. Template No. 20234 is an original design by author Cowboy.


Number 1

Drum roll, please… “Straight in at number on!” Ok, here we go… the best Flash template ever is Template No. 20361 an original design by author Hugo and one of the true innovations in cutting-edge web design! It’s based on ActionScript3 and made with the PaperVision 3D engine (An open source 3D engine for Flash), which features an impressive 3D interface as well as a wide range of other really neat stuff.

Just like the method used in XML Flash Sites this one allow you to circumvent the need to modify FLA source files whenever you need to change some text or move stuff around etc, etc.

{ 2 comments }

Flash Technology Enhances Search Results (I Don’t Think So!)

by Collado on July 11, 2008

Poster Child total nubieUp till now search engines (Google, Yahoo! etc) weren’t ever able to crawl Flash files and when they did end up indexing some it was never completely free from error. So if you wanted to built a website and actually have people find it, then it made sense to do without the Flash. Nonetheless Flash still became very trendy among developers because of its knack for, shall we say, overlooking the obvious and putting together very unusual websites.

However a couple of days ago Adobe joyfully announced their teaming up with search industry leaders to “dramatically improve search results of dynamic Web content and rich Internet applications (IRAs).” Better late than never, I guess.

Adobe also says it’s “providing optimized Adobe® Flash® Player technology to Google and Yahoo! to enhance search engine indexing of the Flash file format (SWF) and uncover information that is currently UNDISCOVERABLE by search engines.”

Sweet! Now that Adobe has finally admitted (despite arguments to the contrary) that SWF format has never been properly index by anyone of the search engines (or that its always been pretty much crap) that should finally shut up all you evangelical Flash pushers and feens clamming Flash is the holy grail of the Internet. Shouldn’t?

So has Adobe really done what its says its done? Frankly I’m not sure. Adobe claims that this stuff will provide more relevant search results and rankings for RIA content. And in a separate blog post, Google also seems to affirm that claim stating that they’ve already launched a “Flash indexing algorithm”, which will result in better search results. Well, before you all start heading to Starbucks and buying each other those skinny soy decaf lattes, the real questions is, how much better is this as opposed to plain old static HTML text and what are the confines?

They say that in the land of the blind the one eyed man is king, similarly if up till now flash files were not being indexed whatsoever, then the fact that there’s been a little progress may indeed be called “better”, but Flash indexing algorithm or not there’s still a lot of reasons why you should never go for a 100% flash-based website.

Yes Google can now discover and index text content in SWF files of all kinds etcetera, etcetera, but there’s some limitations. For example, Googlebot does not execute some types of JavaScript. Which means that if your webpage uses JavaScript to load a Flash file. Guess what? They may not be able to discover and index the contents of that file.


Google has also admitted they “can’t attach content from external resources that are loaded by your Flash files.” In other words so if your Flash file loads another file - such as an HTML file, an XML file, or another SWF file – what their saying is that they might index the contents of those files, but they won’t consider that content to be part of the content in your Flash files. That doesn’t sound very impressive, does it? What then? The Flash indexing algorithm does exactly what it sounds like it does NOTHING, other than the rendering of incomplete documents and the dramatic equivalent of inaccessibility.

Generally speaking when designing sites for my clients, I tend to make my content driven Flash applications run off of external XML files that are read at runtime. That way even a novice web developer with no understanding of Flash can have the functionality of editing their website’s content in notepad, and not have to recompile the swf file. Are you seriously suggesting not attaching the contents of those files to the rest of my Flash file? Seriously? Are you kidding? What the f$#@ are you talking about!

Does Adobe really expect us to believe that this will provide more relevant organic search rankings? Listen, I want my Flash files to be indexed just as much as the next guy and while this is a welcomed and important step in the right direction on the part of Adobe there’s still a lot of work to do.

So, if you do decide to use Flash (God help us all), do it in moderation and remember while Google can index the content of Flash files, other search engines wont. On that note, don’t forget to provide text equivalents of these files to help other search engines crawl and index your content.

{ 0 comments }

Should I go for a Flash based Website

by Collado on April 13, 2008

business woman deciding on flash vs htmlThere are now a myriad of platforms, applications and programs used in making our website templates dynamic. In addition to plain old HTML there are also CSS(Cascading Style Sheets), SSI(Server Side Includes) and PHP (Hypertext Preprocessor) just to name a few. In addition Flash animation is also used to accentuate the elegance of our Flash site templates. Making the decision to use our template customization services will definitely save you a lot of cost and effort however there is one other thing you’ll want to consider. And that is, which customization package should you choose? In other words should you go for a Flash based Website or is it more practical to stay with HTML? In the following article the author examines some of the pros and cons of using Flash vs HTML. For a more in-depth discussion on this particular matter see also - Top 10 things Flash developers don’t want you to hear

Flash-based sites have been a craze since the past few years, and as Adobe compiles more and more great features into Flash, we can only predict there will be more and more flash sites around the Internet. However, Flash based sites have been disputed to be bloated and unnecessary. Where exactly do we draw the line? Here’s a simple breakdown.

The good:

Interactivity
Flash’s Actionscript opens up a vast field of possibilities. Programmers and designers have used Flash to create interactive features ranging from very lively feedback forms to attractive Flash-based games. This whole new level of interactivity will always leave visitors coming back for more.

A standardized site
With Flash, you do not have to worry about cross-browser compatibility. No more woes over how a certain css code displays differently in Internet Explorer, Firefox and Opera. When you position your site elements in Flash, they will always appear as they are as long as the user has Flash Player installed.

Better expression through animation
In Flash, one can make use of its animating features to convey a message in a much more efficient and effective way. Flash is a lightweight option for animation because it is vector based (and hence smaller file sizes) as opposed to real “movie files” that are raster based and hence much larger in size.

The bad and the ugly:

The Flash player
People have to download the Flash player in advance before they can view Flash movies, so by using Flash your visitor range will decrease considerably because not everyone will be willing to download the Flash player just to view your site. You’ll also have to put in additional work in redirecting the user to the Flash download page if he or she doesn’t have the player installed.

Site optimization
If your content was presented in Flash, most search engines wouldn’t be able to index your content. Hence, you will not be able to rank well in search engines and there will be less traffic heading to your site.

Loading time
Users have to wait longer than usual to load Flash content compared to regular text and images, and some visitors might just lose their patience and click the Back button. The longer your Flash takes to load, the more you risk losing visitors.

The best way to go is to use Flash only when you absolutely need the interactivity and motion that comes with it. Otherwise, use a mixture of Flash and HTML or use pure text if your site is purely to present simple textual and graphical information.

About the Author
About Design9x.com
With extensive experience Design9x a leading Professional Web Design Studio delivering high Quality and Affordable Web-based Solutions. Design9x specialize in Search Engine Optimization (SEO), Internet Marketing Website Development and Consulting to increase Traf

{ 0 comments }