HTML5 Banners

Imagine this scenario: Flash is definetely dead and it has been replaced by HTML5. I do not support this statement at all, but it could be.

So: What happens in that case with display Ads?

One the big advantages of Flash is that it is a program which can be used by many differente profiles, such as designers, animators and developers. In my work I give support to more than 50 creative agencies to make RichMedia Ads, the more of them are made with Flash. In my opinion all conventional banners are made by designers, and about the 50% of RichMedia Ads also, the rest need more developer/animation skills.

So, if the previous statement happens: What would creative agencies do?
To answer this we should go to the past. We must know that Flash was first a program for designers and animators, then, Flash progressed a lot, so many programmers also began to use it. And also many designers using Flash like me migrated and converted into designers-developers, what they called devigners.

But, to be honest, I don´t see these people moving to html5. Why? Because by now there´s not a wysiwyg program for html5, or is there?

Well, there´s a company called AdVine, Sprout, making something about this. This is called Sproutinc, the idea is this:

let´s see a video:

Sprout Studio Demo from carnet on Vimeo.

You can find more info about them in their website or in their blog

Also, Adobe has a word to say about this, as you can check in Adobe Labs 

Also you can have a look at their video channel on youtube

I see this more advanced than Adobe Edge

Analysis: Google Swiffy: Convert Flash to HTML

About a month ago we had from Google this extension presumely to transform Flash to HTML easily.

If you go to the website you can download it as an .mxp. I shall remind you that if you have more than one Flash version installed you could have a conflict with the Adobe Extension Manager. I had to unistall the previous version of it so as to run this extension.

Easy to install

Download the Swiffy Extension (.mxp file) and open it.Adobe Extension Manager will install the Swiffy Extension, making it immediately available to use from Flash Professional.

Export to HTML5 with one command

The new “Export to HTML5 (Swiffy)” item in the “Commands” menu exports your file to HTML5 and opens the result in your default web browser. Assigning a keyboard shortcut to this command makes it even easier!

Quick feedback

Information about the conversion process, such as features that are not supported by Swiffy, is shown in the “Output” panel, immediately after the export finishes.

So, you have it installed! And now?

Let´s make a simple banner with no Code, only timeline animation, with Actionscript 2 and exported as a .swf, you will have this:

Now, if you go to Flash > Menu> Commands > Export as HTML5 (Swiffy) you will have this advice first:

Later, your brower will open a new Tab, so if your .swf route was this:

whatever/300x250_timeline_animation_as2.swf

In my case: http://www.fernandocomet.com/blog/300x250_timeline_animation_as2.swf

Now you will have this:

whatever/300x250_timeline_animation_as2.swf.html

In my case: http://www.fernandocomet.com/blog/300x250_timeline_animation_as2.swf.html

And if you upload to a server and embed it

So, there´s no difference by now.

Let´s do this in Actionscript 3. You won´t have the Warning, and about the results:

Exported as .swf:

Exported with Swiffy as HTML5:

There´s no difference. I would even say that it´s easier in Actionscript 3 as there are no warnings.

So let´s try now with some code:

Do not try to do it in Actionscript 3, you will have this Warning:

Swiffy Flash Extension for Win v1.0.13 [Swiffy v3.6.1]

- Warnings -

Scenes are not supported.

ActionScript 3.0 is not supported.

In Actionscript 2 you can´t use blend modes.

The good news is that you can use Greensock library

For example in a banner in Actionscript 2 with this code:

[CODE]

import com.greensock.*;

import com.greensock.plugins.*;

function infiniteMovement()

{

textbanner._alpha=0;

TweenLite.to(textbanner, 1, {delay:1, _alpha:100});

TweenLite.to(textbanner, 1, {delay:3, _rotation:360, overwrite:false});

TweenLite.to(textbanner, 1, {delay:7, _alpha:0, overwrite:false, onComplete:onFinishTween, onCompleteParams:[4,bg]});

TweenLite.to(textbanner, 1, {delay:6, _rotation:0, overwrite:false});

}

function onFinishTween(parameter1:Number,parameter2:MovieClip)

{

infiniteMovement();

}

infiniteMovement();

stop();

[/CODE]

The result in HTML5 once exported is this:

Use HTML just in case needed

For all those people telling again and again about Flash Dead or long live to HTML5 or talking like a chatterbox about the future of Social Media web, etc., etc. I say to you;

"Use HTML just in case needed"

Seriously, I´m tired of hearing the sentence "let´s use flash correctly", so I´m gonna give you my point of view about who decides when to use Flash and why.

When I began to work in the Ad Agency where I work now, the new CEO gave us a speech. He is a specialist in ecommerce and told us that he was very interested in SEO strategies. Once the speech was finished I went to have some words with him. I just wanted to know if I had to look for another job (yes, that´s right! I´m the Flashman!)

What happened? Well actually we´ve done some SEO but the queen of technologies here is Flash, and the rest are just behind it. You can´t imagine how many media plans, microsites, demos, richmedia we´ve done here (and on record time). This is the argue which I´ve seen more from Adobe against the unbeliever Jobs for not having FlashPlayer on the iPad: The browsing experience. Can you do things as Papervision? Can you move things as we do? Can you do Augmented Reality?

Later on a new technical director came to the Agency. He told me:

"- Listen, Fernando! We are gonna use Flash just in cases we need it!"

Really funny, even more when he has to give me a hand with Flash. I always answered:

"- We are an Ad Agency, if you don´t want Flash, go to technology!"

I´m talking about Advertising, in this sector my conclussion is that: Yes, it´s worth to make SEO, but this guys from SEO are not going to do the same as me with their JQuery libraries or so. Also you find account directors talking again and again about SEO, SEM, Google and so on. I have nothing against people working on SEO, but I have many things to say against those people closing their eyes at Flash, wherever they come from (creatives, tecnicians or account directors).

So let´s think about these three areas! I´ve been collecting all the twits related to this issue in my twitter timeline. From all the opinions about Flash, HTML5, Mr. Jobs and so, I choose the article from PixelBorne Why Flash doesn´t shuck!

There are some interesting points in this article, first one is related to the creative profile of Flash. There are some things which Flash can do and the rest of technologies can´t, except Silverlight but it´s not as popular as Flash by now.

Sometimes I find designers against Flash, Veerle Pieters for example, famous illustrator and against Flash. How is it? And illustrator who doesn´t like animation? Honestly, I can´t understand it. It is a very strange behavior. And this is not a single case, I don´t know if this responds to Adobe for changing the mild Flash profile user (from Flash for designers to Flash for programmers) with version 3 of the Creative Suite. Anyway, knowing the creative power of Flash, if a designer does not bet for it, there´s a mystery for me.

Second area: Technology.

It´s not only a fight against some creative directors, it´s also against a technical director. First we should be aware that Flash can work for web, but for many other technologies (desktop apps, widgets, games, video, RIAs, mobile devices, eLearning, Art installations, ads on Times Square, etc.) There used to be the against Flash thought in favour of Ajax, HTML and JQuery. There has been also another movement of Java programmers migrating to Actionscript 3 on the frontside (many of the to Flex). The question here is: What´s faster, making it with Flash or with HTML?

What´s expensive/cheaper making it with Flash or with HTML? It´s all about time and money?

So your agency sells something. It goes to the creative department, there´s an idea! Then it goes to the technical director. This is the million dollar question: Do we make it with Flash or with HTML? Beware! The enemy is at home! I´ve seen fights with this. Sometimes what the creative department proposes to do with Flash is made in HTML and obviously the result IS NOT THE SAME. They say websites have forms or need to be indexed. Drop a Shadowbox! Do you remember the times when we used to make two versions of a website, one in Flash and another in HTML? We also thought that blogs had died but I tend to think we´re going back again, at least for the device market.

Third area: Accounts/Sales.

a) "Against Flash" executives: They hardly ever realise when a site is made in Flash (haven´t discovered that you can check it with the right mouse button). Sometimes they say:

"- Ok, the web is nice, but is not searchable, indexable or servible."

I wonder how many meanings of the words they use do they know. They should read Todd Perkins. One more: for example, el Farmville, the game where you are hours and hours playing... Is it made in Flash? Yes my friend... Is it searchable? is it indexable? is it servible? Game is life my friend!!!

Another point here for Flash: Games and porno sites warranty the future of this technology (great!)

b) ProFlash executives: I like this people. They really love Flash. They discover pageflip effect (yes, we know it´s about 10 years old) and want it for the customers. They discover video on the web, everything is video! Discover a widget, let´s do a widget! A game on social media. Let´s do games! YES YES YES, this is the interactive orgasm!

c) Just executives.

They are centered in strategy. Don´t want to sell Flash anyway, so you can´t talk to them and explain about technology.

Back to our topic: So, who decides where and when to use Flash? The budget? The timing? the creative director? The technical dept? The executives? The customer? The CEO? Who has the power in your study/agency/consultancy?

The one who has the power, does he decide? Steve Jobs has power, but you can´t be authoritarian on technology or technology will eat you...

These ones also have power, see what they say about Flash:

And you? Do you have the power? Do you have what it takes? Do the right thing as me! If you see a piece which does not worth Flash and is made in Flash, tell them. And if you see a piece not made in Flash which has to be done with it, tell them again!

Apple, Adobe and Google, are you playing?

Lastly I´ve been collecting all twits related to iPad, iPhone, FlashPlayer, the future of Flash, HTML5 and so on, well, there are much more, it´s clear

Actually, I made a survey in TwtPoll with the question: Why iPhone and iPad don´t have Flash?

I tried not to be tendencious (there are options to criticise anyone), results are to come but you can make a prospection about them. We will comment the conclusions in March.

Anyway, my opinion has changed a bit after readding all these twits. But now I´m interested in talking about the strategy of these three companies Apple, Adobe and Google.

So I begun to draw and made three schematic graphs. Game is life!

1. The prisoner´s dilemma.

Let´s think on collaborative strategies or not. Three players: Apple, Google and Adobe. Each one with its products. I reminded when I studied statistics and Game Theory. Taken from wikipedia: "If we assume that each player cares only about minimizing his or her own time in jail, then the prisoner's dilemma forms a non-zero-sum game in which two players may each cooperate with or defect from (betray) the other player. In this game, as in most game theory, the only concern of each individual player (prisoner) is maximizing his or her own payoff, without any concern for the other player's payoff".

Indeed this is a reduccionist point of view, but very amusing cos there would be cases to collaborate or not. For example, if you see the graphic:

- Case 1: Everyone collaborates.

- Case 2: Google says no.

- Case 3: Apple says no.

- Case 4: Adobe says no.

- Case 5: Google and Apple say no.

- Case 6: Apple and Adobe say no no.

- Case 7: Google and Adobe say no.

- Case 8: All of them say no. It´s war!!!

The question here is to know where we are, who is interested in collaborate and why.

2. Colaboration strategies.

Other point of view: Every player has its strategy, and there are some areas where players can collaborate or not with the others.

For example (see graphic):

- Area 1 Google and Adobe collaborate with Nexus 1 via Open Screen Project.

- Area 2: Google and Apple. for example HTML5.

- Area 3: Apple and Adobe. The products of Creative Suite, plugins, etc.

- Area 4: Places where all of the can collaborate (or not).

3. The platform problem.

Last point of view. To resolve the future of the web, the future of flash, the future or whatsoever. Well, it´s too soon to say anything. We don´t know how players will evolve.

Anyway: Three players: Apple, Google and Adobe. To be or not to be. Some say "kill the browser!", some "kill Flash", others "let´s RIA!". Statistics say about the rising of web access from mobile devices. Not only that, but also take into account the business model of the apps, new future devices (iPad or whatsoever as a TV + internet (a successful one)).

To be frank, don´t know if it´s serious enough to compare languages with tools (my apologise for objectice instead of objective). Green colour means OK, yellow means ?

Imagine now you are a developer. Most of us used to be multidisciplinar devigners, some moved to Ajax, some to CSS, others to RIAs, Actionscript or so.

What´s the question? Which is the language with more future? Which is the most difficult? Which one will give you more money?

Are you playing?