The same high gloss magazines but with interactive elements. What a brand new experience!

Adobe announced that AIR would run on Android, and Adobe has already announced its Packager for iPhone tool that will allow Flash apps (including AIR) to run on Apple mobile platforms.

That is exciting! Can’t wait to leverage our existing AS3 skills to build native mobile apps for iPhone and iPad.

Flash, yesterday

Several years ago when Flash first made it’s debut, almost everyone who uses Flash are excited about creating the next flashy website, injecting the “wow factors” into every site they built by creating splash pages, lengthy flash intros, cheesy sounds, ambient or groovy background music with no “on/off” buttons, packing in lots of effects that either takes away too much of the users’ attention or having the user to wait too long for the website to load. Not mentioning weird interfaces and hard to use navigation systems which developers deemed “cool”. Though, I’m not denying the fact that I am guilty of some of the above mentioned in the early days.

Flash is Great But Prone to Being Abused

The great thing about Flash is that it is so versatile and flexible that you can build almost anything with it, websites, microsites, rich internet applications, games, mobile applications, desktop applications (AIR) etc, but the flip side of the coin is that Flash has been used irresponsibly by so many to make websites “as cool as possible” that it have earned some bad reputation over the years.

Loading Time

Take for example, when we speak to our clients about building their websites, they all share the same concern – loading time. Because that is the most apparent. Users don’t like to wait too long to interact with a site to start with as users have extremely short attention span today. Users these days have a queue of so many other sites to visit, news to read, blogs to follow, they have less reasons to wait another second. If you’re not convinced, ask yourself if you like to wait in a queue.

Among this common concern, bad utilization of Flash is more than meets the eye.

User Experience

In short, the user interface, the consistency of effects, the smoothness of transitions, navigation systems etc are some of the factors that contribute to the user experience. A layman can’t spell it out in details why they hate it, they just hate it. This makes user experience more of an “art” than a “science”. It’s the responsibility of the Flash developer to make sure they “don’t hate it”, by using Flash responsibly. Flash is resource hungry by nature, so don’t make it worse.

Keeping Flash Alive

Its the onus of Flash developers today to ensure the longevity of Flash. No more Flash intros without skip buttons. No more flashy and slow moving animations before the user can finally see the content. No more sounds without “on/off” buttons. No more launching a flash site in a pop up window from a splash page. No more launching the user’s browser into fullscreen mode without their consent. No more “experimental” or hard to use navigation systems that makes it hard for the user to learn, nobody likes to learn how to navigate a site anyways, when they use a door knob, turn on/off the lights, turn on/off the tap, they don’t have to learn in order to interact with it, so why do they have to on a website?

Splash pages

Think about it, do you really need a splash page? The whole purpose of splash pages was to inform users of the required screen size and it requires flash player to view the site, but you know what, who cares? Technology has been evolving faster than you can imagine, huge monitors are common these days, 1024×768 is the new 800×600 and 99% of internet users have Flash player installed. Lastly, please refrain from telling the user they need Flash Player 10 to view the site when it only takes Flash Player 8. And by the way, nobody likes to follow rules when using the internet, so please do your users a favor. Accommodate the user than have the user accommodate you.

Content Architecture

It is crucial to have a website planned out extensively in it’s skeleton form before anything else. Bad planning of a site leads to bad user experience, that is when users move their mouse to the top right corner of the screen and click the close button immediately.

As mentioned earlier, Flash is very flexible in terms of where you want to position elements of your site like buttons for example, but that doesn’t mean you can put them anywhere.

Flash Today

It has been several years since we have expressed our enthusiasm by releasing countless great or annoying flashy Flash sites, pleasing or pissing off countless others. It is time for us developers to grow up and to think more in the user’s point of view than our own.

Users these days are more content hungry than ever, leading to the rise of blogs that generates valuable content to meet user’s demands and at the same time monetizing their effort. This means more users are interacting with standards compliant websites more often than ever, giving them even lesser reason to learn how to navigate around a badly designed Flash site.

Being a good Flash designer or developer is more than just knowing how to script bells and whistles, it is how well the end user can interact with it that is the most important.

Here’s one that I developed for the movie 30 Days of Night (click on banner to replay) for Qais Consulting (I know, banner looks pixellated but this is what I call – compromise – for file size restriction), I would like to share with you my experience while developing this innocent looking banner which only weighs 29.7kb.

7 Points Checklist:

Here are 7 points to note when optimising your web banner. With this checklist, hopefully you won’t have to tear your hair out like I did. The final point I’m going to talk about using fonts which to me, is the most critical area of optimisation:

One more tip about developing your byte critical flash banner:

If you’re not sure which asset in your flash file is causing the increase in filesize, go to “Settings” at the “Properties” panel in Flash, click on the “Flash” tab and check the “Generate size report” checkbox. This will generate a text file listing all the assets that are used in your flash banner including their individual file size in Bytes, from there it’ll be easy to see who is the culprit at a glance.

I am guilty of spending too much time on designing and developing websites that I hardly spend much time on making them “search engine optimised”. Search engine is so powerful these days, people are reliant on it for almost all information they are trying to find. They don’t call anymore, they don’t ask, they search – and it is probably the fastest way into getting instant information.

Almost all of my websites are designed entirely in flash, they might be friendly to the eyes, but not exactly very friendly to search engines. This post a very serious problem especially when you’re relying on a website for your business. Clients wants sites to be in HTML and minimal flash so that it is searchable via search engines. Fair enough, moreover HTML can be deployed together with AJAX to minimise refreshes and put some life into the HTML pages by employing slight animation, but if you really love Flash like I do, you might want to SEO your full flash sites with – SWF Object

Benefits of SWF Object

1. It detects whether the flash player plugin is install on the user’s computer
2. If no flash player is detected, the same page that holds your full flash site will display alternative HTML content (note that the page will display “alternative content” and not bringing the user to an “alternative page”
3. The “alternative content” which you’ll design in the main page that holds your full flash site will also get picked up by the search engines making the page search engine friendly

5 Steps on using SWF Object (it’s easy)

1. Click here to go to SWF Object download page at Google Code
2. Download “SWF Object 2.0″ from the above mentioned site (SWF Object 2.0 is the latest available at the time of writing)
3. Copy “swfobject.js” from the folder you’ve downloaded (you need to unzip the folder from the zip file)
4. Paste “swfobject.js” into the same directory as your HTML page holding your full flash site
5. Go to the SWF Object HTML & Javascript generator page to generate a HTML page to embed your flash and include the most important “alternative content” (a.k.a. HTML content in case your audience don’t have flash player installed and at the same time making your site search engine friendly). The SWF Object HTML & Javascript generator page can also be downloaded as a HTML or Adobe AIR application via the same SWF Object download page at Google Code website.

And you’re done! I’ve made Hex search engine friendly by using SWF Object, see results! You can try it too and tell me if yours works.

*You might need to uninstall your flash player to test the alternative content without Flash Player Plugin, here’s where you can download the Flash Player Uninstaller. For more information and documentation of SWF Object, go to here.