Nov29th

Thermo turned to be a Catalyst

Nicolas Antille Flash/Flex Read on

Neither Thermostat nor Thermonuclear, just Thermo. Adobe Thermo. A weird name for a product that many have been waiting for. It was introduced at Adobe MAX Chicago in 2007 but apart from a few screenshots and one or two videos, it was hard to find detailed information about this "upcoming" software.

At that time, Sean Corfield wrote a good summary of Thermo.

Starting with a Photoshop PSD file, Thermo imported this and converted it to MXML. Design elements can then be selected and with a simple right-click they can be converted from artwork to Flex controls. The automatic inference of design-time data sets so you could test UI interactions with "real" data was very impressive.

Mark Anders, vice president of engineering for Adobe, also told this.

Thermo, which is in the early stages of development, is built on the Flex Builder development environment, a tool the company already offers to help bridge the gap between developers and designers. Flex provides workflows developers can recognize to render visual parts of the application so it's easier for them to add visual elements to an RIA. Designers using Thermo don't have to write code for their applications, but they can choose to view the source code and see it in a Flex Builder editor that they can work with if they want to, Anders said.

Rejoice (should we ?) for it is called Thermo no more. From now on, it's Adobe Catalyst. The name isn't bad considering it will speed up project developments (hopefully !).

Waiting for the release, you can already drool over the video that Adobe published on their Labs website.

As it seems focused on Flex, I wonder what will become of Flash itself as Catalyst will fill the gap between graphic designers and flex developers but not between graphic designers and flash developers.

An early release of Catalyst was available to those attending MAX at San Fransico but it's still gone public. You can signup on Labs if you want to be noticed of the release.

For more concrete samples, go take a look at the Catalyst team blog.

Jul6th

Google Search reaches out to Flash content

Nicolas Antille Flash/Flex Read on

In my previous article about RIAs and SEO, I talked about a solution to expose HTML pages through XSL transformation of dynamic content. I also mentioned an attempt of Google to crawl Flash content, inefficient as it could only read static data. Well now the situation evolved and looks very promising.

Adobe, with it's recent "open mania", has lifted the SWF (and FLV) format specifications and created the Open Screen project on the fly to help Adobe increase the Flash Player embedding into various devices (anything with a screen basically). Following this, Adobe has been working in cooperation with Google in order to make Flash more indexable by search engines.

Pros

Google was given a special version of the Flash Player so that its indexing robots could retrieve data directly from a SWF. The player just behaves like a standard human user and accesses data, writes it in a comprehensive robot-language and gives it back to the robot. So Googlebot is now able to crawl dynamic data !

Soon Yahoo will follow in the venture and probably other vendors as well.

Here are a few articles you'll want to read :

Google sums it up with this short news :

Now that we've launched our Flash indexing algorithm, web designers can expect improved visibility of their published Flash content, and you can expect to see better search results and snippets.

Cons

Ron Adler and Janis Stipins from Google relieve the designers :

Basically, you don't need to do anything. The improvements that we have made do not require any special action on the part of web designers or webmasters. If you have Flash content on your website, we will automatically begin to index it, up to the limits of our current technical ability.

So they say. Oh wait. Perhaps it's not that simple. There are two important problems. Ron and Janis said there are still three technical limitations, two of them being the following.

1. Googlebot does not execute some types of JavaScript. So if your web page loads a Flash file via JavaScript, Google may not be aware of that Flash file, in which case it will not be indexed.

If you're a Flash designer, you'll immediately think of SWFObject which is actually based on Javascript. Lots of Flash web sites use it. We don't know whether it is of a type that won't be executed by Googlebot.

2. We currently do not attach content from external resources that are loaded by your Flash files. If your Flash file loads an HTML file, an XML file, another SWF file, etc., Google will separately index that resource, but it will not yet be considered to be part of the content in your Flash file.

It is a major problem because a lot of ActionScript developers use a light SWF files that loads the rest of the application on demand. Sections are often broken down into several modules, sometimes meant for re-usability (an Object Oriented convenience).

Searchability

Andrea Hill wrote some interesting thoughts on this topic.

Another major challenge in opening applications up to search is being able to direct the searcher to the relevant section within the experience.

I couldn't agree more with that. There is a huge difference between RIAs and HTML in that the RIAs aren't accessible automatically, you have to decide what is to be accessible. Adobe's answer is in the SWF Searchability FAQ (listed above) :

To generate URLs at runtime that reflect the specific state of SWF content or RIA, developers can use Adobe Flex components that will update the location bar of a browser window with the information that is needed to reconstruct the state of the application.

For complex sites that have a finite number of entry points, you can highlight the specific URLs to a search spider using techniques such as site map XML files. Even for sites that use a single SWF, you can create multiple HTML files that provide different variables to the SWF and start your application at the correct subsection. By creating multiple entry points, you can get the benefits of a site that is indexed as a suite of pages but still only need to manage one copy of your application. For more information on deep-linking best practices, visit www.sitemaps.org/faq.php.

With all this in mind, it is not safe yet to think Flash web sites will be indexed easily. Google is already working on the limitations of the Googlebot and I'm looking forward to hearing news of their progresses.

Jun22nd

Are you Singularity ?

Nicolas Antille Flash/Flex Read on

What is Singularity ? It is a (huge) web conference, scheduled on October 24-26, 2008. This event is organized by Aral Balkan, an active fellow in the Flash community, and he's planning to gather thousands of people for this large-scale video streaming conference. The speakers list is already impressive.

Update on 23 July 2008 : "Reserve your tickets today. Early-bird tickets to Singularity are just $99 USD (inc. VAT) until the end of August."

Singularity sneak peek

A site teaser has been released some days ago on Google app engine. As Aral wrote :

You can sign up for the site, which will go live in July, and register your interest in the conference[...]

Even though it's a web conference, it does not mean it'll be free. The attendees will have to buy tickets that will be on sale on July 1, 2008 with the launch of the new site. The pricing is still unknown but Aral said it's affordable.

Can’t make a certain session? No worries, it’s all recorded. And attendees have exclusive access to the sessions for six months, at which time the recordings for the 2008 conference will be released under a Creative Commons license for the benefit of all and to form a time capsule defining Web ’08 as presented by our amazing line-up of speakers.

If you want to hear some words of him, the Télévision Suisse interviewed Aral while he was attending the LIFT conference some months ago.


Jun18th

3D engines for Flash

Nicolas Antille Flash/Flex Read on

I've been following from afar the progresses in 3D engines for Flash for some years. Recently I wanted to dive in the Z dimension, be it fake nevertheless. So here's an overview of the current situation.

The good

Performances

Until the likes of Papervision, dynamic 3D rendering was rarely used in Flash websites. The latest Flash Players brought some consequent changes upon processing speed. Hence it allowed some 3D engines with reasonable performances to peek their nose in the community.

3D engines give an extra dimension to creativity, though they aren't fit for complex scenes yet. Even the Alternativa engine has its limits, those of the Flash Player. It's been a few years since the community asked for hardware support so that we can get rid of some slow performances. Well, with the Flash Player 10, you will be able to choose different display modes like normal, direct and GPU. You have to be very careful if you decide to set the GPU mode.

These modes in general should be considered still in beta, there may be a lot of bugs until possibly Flash Player 11 so use caution.

This quote is by Jody Brewster who gives some precious Flash Player 10 GPU acceleration tips on his blog.

Gimme the sources

Most of the 3D engines in Flash are free, both for personal and commercial use. And most of them are open source (except Alternativa, to my knowledge).

The bad

Looks

3D engines also mean an extra dimension of complexity, and increased risks to make bad visual designs. This can lead to an "UGH" factor where the 3D looks either dull or slow or complicated.

It usually holds true that the bigger the scene, the slower and laggier. Same goes for details and the amount of objects on the scene. Your bitmaps may also look very jaggy or aliaised so you will loose the "smooth" graphics factor. You can always try to make up with nice 3D motions.

Do not expect your 3D to look as smooth as a 3D video render from a software like 3DSMax. Depending on the engine, you might as well endure backface culling problems, basically meaning some polygons of your 3D object won't show up when supposed to do so.

Flash 3D display problems

In the image above, you can see a part of msnbc Spectra. You can easily distinguish that the text on the violet panel is weirdly distorted with the Papervision engine. The "wow" effect is here but this visual bug makes it a little less impressive. FIVe3D would have been commandable here as it displays fonts using the vector API of Flash. That "detail" aside, Spectra is still a very nice example of a good 3D user interface.

Update on 23 July 2008 (by Seb) :

The reason for that distortion is that the FlashPlayer can only perform skew transformations on bitmaps; in order to get any kind of 3D stretch we need to resort to using this hack.

Things are however improved with FlashPlayer version 10 - we now have the ability to do proper 3D perspective stretching on bitmaps, and so this horrible distortion should be a thing of the past.

Overkill

You have seen it coming, why not build 3D Flash banners ? A 3D engine (in activity) consumes a lot of CPU power. Think twice before going all out with a super-3d-banner-of-the-death which plays continuously heavy 3D stuff. Who said common sense ?

Hack and slack

In the end, Flash is still not ready for 3D. The Z dimension is now affordable thanks to the devoted work of some flashers but their engines are built on a weak platform, that is the Flash Player. It still cannot handle bitmap processing quickly, which is the biggest barrier to 3D. Alex Cove (author of the 2D physics engine APE), asks "does it always have to be a hack ?" truthfully. Is Adobe waiting for some miracles from the community to move on to 3D ? Flash Player 10 is a beginning to this but it doesn't even include Z-sorting so you end up doing it manually...You end up taking Away3D and waiting for the Flash Player 11 patiently.

Still, Adobe has been listening a tad bit to the community's requests (business obliges), as Macromedia did in the past. Changes like that take some time, especially for the Flash Player which wasn't meant for 3D in the first place.

3D real time engines

Sandy

Sample : Telenor Body Language, Sandy demo

Originally, the project had several members but it is bit of a rundown now, with only one member left, Thomas Pfeiffer.

Sandy is not to be overlooked however. It's the first open source 3D engine and it has some very powerful features with light rendering.

Papervision

Samples : Audi Rhythm of lines and msnbc Spectra

Papervision rose with a better communication and is backed by some notorious Flash personalities. All that Sandy didn't have.

It's by far the most famous of the 3D engines available, and one of the most complete too. It is available at version 1.5 on the blog's download links. The next Papervision 2, called GreatWhite, is in beta currently and only available on SVN repository.

Away3D

Sample : Fifa Street 3

It is considered as an extension of Papervision, though the two authors had to rewrite a lot of the base classes. The project is hosted on away3d.com.

Away3D still lacks documentation a lot. From what Rob Bateman said, this will be solved soon.

As announced in an article on Papervision's blog, Away3D is planned to merge with Papervision GreatWhite. Update on 12 July 2008 (thanks Seb) : Papervision has by now integrated a part of Away3D's features. Both projects are still on going.

Fifa Street 3

WoWEngine

Sample : technical demo

Jerôme Birembaut developped the WoWEngine and nicely made it available to everyone on his blog.

This engine is very interesting because it mixes some bases of Sandy with an extension Jerome wrote of the 2D physics engine APE. The result is a 3D engine with physics features like collisions, cloth and rope simulations to name a few.

It is very likely you'll use this engine if you want both 3D and physics interactions within your application.

Alternativa

Sample : 3 demos on their website.

This engine is a killer. It is developped by a russian team. They're invited at the coming Adobe MAX at Milan, in december (2008), one extra reason to attend this huge event.

Alternativa has been publicly released but it is free for personal use only. Licences must be purchased for commercial use. You should take a look at what this engine can do. One word for them : Отлично !

FIVe3D

Samples : FIVe3D homepage itself which includes 5 samples

Mathieu Badimon wrote a small 3D Engine as "an open source code for the conception of interactive vector-based 3D animations". The FIVe3D homepage is a good implementation of the engine.

This engine relies upon the Flash Player to handle vectors, rather than bitmaps with the aforementionned engines.

One of its strengths, aside from being very light (10KB), comes from the way the engine handles fonts. With FIVe3D, you can use any font you want to any size without barely any aliaising or ugly text artifacts you might see in Papervision. A good choice for titles and headers. The little shortcoming to this is that you have to use additional font data (stored as an AS3 class). It is fortunately generated automatically by the tool Mathieu provided on the FIVe3D web site but it still weighs around 50KB for simple fonts.

FIVe3D render sample

Update on 23 July 2008 (thanks Seb, again) : attempting to render a lot of text with FIVe3D will result in a framerate drop due to the heavy calculations that the vectors imply for the Flash Player.

What engine shall I pick for my project ?

You don't necessarily have to choose only one 3D engine. You can easily use multiple engines, each for a different use. This point was discussed last month at the AUGG (Adobe User Group of Geneva) meeting about real time 3D engines.

So for instance you could make some intro with large titles with FIVe3D, then display some simple textured objects with Papervision and constraint them physically with WoWEngine. Even among the samples listed above, there are certainly some cases where several engines were used together.

Not to mention many projects don't rely on sole 3D but also blend some videos of 3D renders as you can see in the Fifa Street 3 sample.

Can I import 3D models ?

Yes you can. Sandy, Papervision and Away3D can import Collada files to display complex meshes (read less simple than just a sphere or a few boxes).

Some 3D softwares can't export do not have a built-in exporter for Collada files yet. If you want to export using this format, you'll certainly find some free exporters since Collada is an open standard based on XML.

Another possibility is to use the AS3 Geom Class Exporter either for 3DSMax or Blender. It will generate .as files and the advantage is that the engine won't have to parse the file since it's ActionScript already.

Isn't Flash CS4 going to wipe out those engines ?

No it isn't. If ever Adobe adds a fully fledged 3D platform within the Flash Player, the 3D engines of then will adapt and make use of its new benefits. Some engines like FIVe3D might be in direct challenge with the next Flash CS4 features. However I don't think Flash CS4 will be released before late 2008 and it's not even sure if the so-called "3D" features will be as easy to use for coders as what's available currently through open source projects.

Is it worth it to go 3D finally ?

Without a doubt, yes it is ! Just imagine : you can dynamically render basic 3D. For instance, the amount of CoverFlow components for Flash/Flex has exploded thanks to those 3D engines listed above. A proof that simple and effective UIs are also relevant in 3D sometimes.

And it is not limited to commercial entertainment websites at all. Embedded user interfaces are yet another market you can target. The InteliSea application presented last year at MAX 2007 includes some simple 3D to display the sea state for a boat. Another proof you can make "serious" applications with 3D (and sometimes it might be mandatory).

I will talk in a further article about GIS (Geographic Information System) and 3D with Flex. It'll be a nice follow-up.

Jun5th

RIA, SEO and deep linking

Nicolas Antille Flash/Flex Read on

This post is an analysis of the current situation about those entwined matters, quite uselessly controverted I dare say. The technology I'll focus on is Flash/Flex but it applies for Silverlight and other platforms as well.

In this article, when I talk about different "views", I mean different technologies used to display some content, be it Flash, Silverlight, Java FX, etc.

Content crawling

Earlier practises

The idea of presenting a multiple views (or aspects) for some content isn't new at all. It has been a common practise for a some web agencies to develop two websites for their clients, one in HTML and one in Flash. The very purpose of that is to be (supposedly) accessible to 100% of the web users and also to be search engine optimized.

The Flash view would provide more interactive content to the visitors on broad band whilst the HTML website would be focused on clarity, quick information look up and accessibility. Building a Flash and an HTML website for the same content (more or less) involves duplication of similar work BUT different skills. Such a strategy consumes more time and more people, more resources. In return, you can optimize your HTML view for search engines and page ranking for the benefits of the Flash view.

The huge advantage of this is that your dynamic (and static) HTML content is crawled by search engines and you can propose a redirection to the visitors who may like to browse the Flash view instead.

Recent evolution

Ever since Google and other search engines were able to look into .swf files, some people have thought "fine ! all the content within my Flash website will be indexed !". They need to know what is static and dynamic content. They also need to know the very basic thing : how an RIA works.

Static content is embedded content, you find it in the resulting file, .swf for Flash or Flex. Dynamic content is loaded from external sources like databases, so data is NOT in the application itself.

Most of the RIAs work dynamically. Search engines CANNOT index dynamic content, meaning directly from the databases. What do search engines see when they look into my Flash web site then ? Almost nothing. They can see the title and description and a few static things in the Flash library. That's all.

Nowadays

It is often the case currently that Flash web sites remain in Flash alone for the HTML view is a loss of time compared to its development cost. With the rising of RIAs on the web, more people are looking for SEO solutions.

A recent trend among Flash and Flex developers is to talk about some ultimate SEO weapon called XSLT. It's actually not a big deal. However, we can use it to make what was a huge bother before : a second view of the same data model.

First of all, XSLT works on XML documents and is quite powerful to transform them into any result you need, like HTML. In most cases however, the web site's data is stored in a relational SQL database so it's an extra step to retrieve data and transform it into XML to then feed it to XSLT. And logically, you'd use the same XML for your RIA but it's not mandatory indeed.

Even though XLST transforms data, you still have to write and test the whole thing and XSLT is quite touchy, there's no room for errors. Depending on the complexity of your output, it may be quite a pain. The point is that it still consumes less time than the former HTML view development I discussed about BECAUSE the raison d'être of the HTML version for RIAs is not the same anymore. The XSLT output is meant for search engine bots and accessibility.

If you look at the HTML view from the current XSLT implementations, it's very simple, even without layout sometimes. Standard users without the Flash Player wouldn't want to surf on such plain and boring HTML. So why isn't it focused on those users ? Because it would be the same as the former solution. The purpose of the XSLT implementation here is to provide an average solution, a first step towards SEO for RIAs on the web.

To my knowledge, there aren't many websites with such an implementation yet. A "reference" in the matter is the Flex directory. If you display the HTML sources, you'll see numerous div layers containing the directory data.

Deep linking

Talking about deep linking a few years ago was only a mean to emphasize that Flash websites just couldn't do it.

The solution has come with Actionscript's ExternalInterface : anchors handled by Javascript for deep linking.

Currently, this method is more and more used in Flash and Flex web applications for it's quite easy to implement. As stated above, deep linking is achieved through HTML anchors. Why is that ? Because anchors avoid the browser from reloading the window, thus restarting your whole web application. However, anchors aren't the perfect answer to the problem.

Consider this deep linking example :

HTML web site : www.yoursite.com/article/roundup-is-lethal

RIA web site : www.yoursite.com/#article/roundup-is-lethal

Obviously, the first URL is better. There's no workaround at the moment but it's a little sacrifice considering you can deep link an RIA. How it works ? Javascript listens to changes in the URL and notifies the RIA if something happens. The RIA can also call a Javascript method to update, or rather rewrite the URL when the RIA state changed.

Talking about Flash, there is a nice library called SWFAddress that provides you with those functionalities (for Flex, there is also a built-in library). Be aware that implementing deep linking in an RIA must be planned. It is not a lot of work but you have to decide what will be deep linked or not and architect your application accordingly.

Search engine bots

Detection

The strategy above requires to detect search engine bots. You need to know who's coming on your web application in order to serve either HTML content or the rich application itself.

There is no absolute mean to detect every single search engine bot because there are thousands of them. So you will probably use a smaller listing of the most important search engines bots on the web.

Fake user agent

Ineluctably, the ways to detect the real user agent of a given visitor aren't perfect. The motto for security related matters is to minimize most of the critical weaknesses, not to build the perfect defense. It is possible to verify the identity of a user agent to some extent, and that will be sufficient for most of the evil and violent crawlers. You can do it with DNS lookup and MySQL caching for instance.

Search engine optimization

Cloaking

First of all, I saw a lot of talks about cloaking when it comes to provide both Flash and HTML views of a website. It is often used to introduce the killing line "it could get you banned from Google !!".

I even found a redundant post among several SEO sites that happily emphasize that SWFObject is considered “dangerous”. If that statement is true, many Flash websites have a problem as SWFObject is famous right now. However, those alerting posts you can read are all dated from 2007 and many things change in one year so it might not be dangerous anymore.

Google bot (I don't know for the other bots) dislikes that we hide content, be it by css or like SWFObject does, by using DIV layers to hide the HTML under the Flash layer.

Nevertheless, if your content in HTML matches what you can find in your Flash view, there shouldn't be any problem. But you're still at risk.

Rumors and gossip

As I was looking up the web for insights about Flash and SEO, I read on Google's forum some comments whose author sometimes doesn't know what he/she's talking about, hindering the discussion about how to better designs so that RIAs can be search engine optimized.

It is a fact that human beings dislike changes. It is also a fact that people often do not seek further than what is affirmed. They like an idea or not and if you confront them, they will fight for it. In case of the SEO community, talking about Flash and SEO will never fail to generate a few worthless comments like "consider using gifs instead of Flash".

To the people who still do not understand and keep thinking about the current situation as a war between HTML and Flash, I'll write this : given a situation, a context, a full-flash website or RIA is a relevant answer to a problem, as it might not be in another situation. That's all there is to it.

It's no use telling "Try to use Flash only where it is needed". You can find this very "advice" on Google's website but it's quite stupid to write that under the "Best use of flash" title. The same statement about "using something only when needed" is valid for everything anyway.

RIA and search engine

With the spread of RIAs, search engines are likely to collaborate with Adobe and Microsoft as Google did with the Adobe Search Engine SDK. It's merely the beginning of a new era of visual content though. Some day, I believe search engines will provide support and crawl dynamic content, with the collaboration of both the data holders and indexers. On top of this, video contents are spreading on the web. Indexing their content (not only their titles as Dailymotion, Youtube and the likes do) is going to be one of the next challenges for search engines too.

Accessibility

Upsetting matter

Why talk about accessibility now of all times ? It's not totally off-topic. SEO is a kind of accessibility for search engines after all.

As a part of the talks about ergonomic designs in Flash, accessibility is something everyone knows but vaguely. You can easily find a few people who argue that screen readers can't read Flash content, the bottom line being "Flash is bad, make your website in HTML because it's accessible".

First of all, Flash does have accessibility features. However, they're often ignored because it's even less likely designers will care for the blind people when their application is more visually-oriented than HTML websites.

Blind people

We had a meeting one month ago with the president of the Swiss Federation of the Blind and Visually Impaired. He showed us how he, as a blind, "sees" the web. He got a screen reader and it was my first time listening to one such equipment. I was stunned. The voice was fast, so insanely fast that anyone but a trained ear like his could understand.

So he went on and told us many HTML websites aren't properly accessible to blind people.

Take for instance those ugly HTML web sites that pile texts and news everywhere possible in the layout. Even at an alien-like voice speed, the screen reader seems to talk without cease. Better yet : the menus in Javascript. Let's assume we have a complex menu with a hundred buttons nested in categories. They are hidden by javascript and show up only on rollover/click on a category in the main bar. On the other hand, the screen reader reads the HTML so it tells the whole hundred buttons' label. Unbearable.

Then he went onto some Flash websites and although the screen reader had to wait for some animations to end, it enumerated the buttons and the content correctly. It is not an idyll though. HTML is still more supported by screen readers in general.

Conclusion

You can optimize your RIA for search engines with the solution discussed above. It increases accessibility as well because you expose HTML to the crawlers and people who don't have the RIA plugin. Nevertheless, bear in mind that its primary objective is not to be a replacement of the RIA itself.

Update 1 on 24 June 2008 : If you want to test an example with code, Ahmet wrote a nice article about this concept, based on what he found in the Flex directory. There's even a schema. :)

Update 2 on 6 July 2008 : The situation has evolved quite a bit, with Googlebot attempting to crawl dynamic data. You might want to read my article about that.

Apr20th

Ma’at, première partie

Nicolas Antille Comic books, Paintings Read on

Lorsque j'ai vu la couverture, elle m'a attiré d'emblée. En deux mots, originalité et expérience. Voici Ma'at de Simon G. Phelipot.

L'introduction est une baffe. Normal me direz-vous, le visuel ici est léché comme il se doit. Je n'avais encore jamais vu une série de peintures, en parties abstraites, dans une bd de la sorte. Et le résultat est énorme. Mais tampérons un peu.

Ma'at - couverture

Ma'at, première partie, couverture (sans titre ici) provenant du blog de Simon

Scénario

Les Japonais ont une longueur d'avance en matière de style post-apocalyptique et peuvent parler d'expérience vécue. Les stigmates sont encore visible actuellement, largement projetés dans divers mangas. Voici la recette : prenez les bombes atomiques et le choc psychologique qu'elles ont causé. Ajoutez à cela une montée en puissance des technologie et une fascination pour la robotique futuriste. Il est question ici des robots d'apparence humaine, ceux qui inspirent tant d'artistes, philosophes, physiciens et j'en passe. Faites revenir le tout et ajoutez le déclin que cela engendrera peut-être : conflits hommes-robots, reconnaissance du Moi des robots, utopie, désillusion et décadence humaine. Faites bouillir et mélangez le tout avec l'ouverture forcée des pays à la fin de la Guerre Froide, lancant une ère de design graphique sans précédant. Vous obtenez le manga post-apocalyptique japonais dont "Blame!" incarne la quintescence.

Simon s'est visiblement inspiré de ce genre de scénario. De par la situation politique et économique, Ma'at ressemble à un futur plus ou moins proche, celui de 2093 selon la bd.

La seconde inspiration vient de la problématique de Ma'at : l'expérimentation scientifique sur sujets humains. Je pourrai encore digresser longuement sur le sujet mais je m'abstiendrai. Les expérimentations "scientifiques" sur des êtres humains vivants (contre leur gré dois-je le préciser ?) n'appartiennent pas qu'au passé et sont toujours d'actualité.

Beaucoup d'oeuvres se basent sur ce concept pour justifier les capacités surhumaines du ou des héros. Interviennent alors les scientifiques obnubilés par leurs recherches, les politiciens vicieux et prêts à tout pour écraser ce qui ne leur plait pas, les militaires instrumentalisés et obéissants et forcément, face à tout ce mauvais monde, la poignée d'amis du héros. Si tout cela relève du cliché (et malheureusement souvent vérifié), c'est la manière de mélanger tout cela qui est déterminante. Dans Ma'at elle est correcte, sans plus.

Peinture digitale

Simon joue bien des couleurs dans ses illustrations et la mise en page créative met en valeur le tout. On se laisse surprendre par chaque page tournée.

Les décors ne sont pas au niveau architectural des Cités Obscures ou de Blame, mais de bonne facture en général. Si Ma'at a des inspirations partiellement asiatiques pour le scénario, le design graphique lui est bel et bien européen et en couleur, ce qui le différencie largement des mangas en noir et blanc.

Les personnages de Ma'at sont souvent (toujours ?) inexpressifs, bouche close, et j'ajouterais : dans un stéréotype d'attitude cool qui manque de naturel. C'est d'ailleurs le pilier principal des mauvaises bds et mangas, qui sont malheureusement légions (ô surprise). Mais ce n'est pas si grave ici et s'explique en partie par l'incapacité de parler d'Isis. Je pense cependant que les personnages secondaires manquent de profondeur, emprisonnés dans leurs traits placidement funèbres (Flaubert), trop raides.

Il y a deux autres détails que j'ai relevé. Premièrement, certaines images sont de temps à autres trop floues, problème inhérent aux images digitales. Deuxièmement, il y a des différences notables entre les visages de face, de profil et en 3/4 d'Isis. En somme, Isis n'est parfois plus Isis. Avec l'expérience, cela changera sans doute dans les prochains tomes.

Conclusion

J'ai mis beaucoup de temps à lire cette bd car je savourait chaque page. Il est d'ailleurs difficile de faire autrement. Le lecteur est placé dans une contemplation froide, celle d'Isis en grande partie. Paraxodalement, c'est dans cet état que contrastent beaucoup les émotions et la puissance qui se dégagent du récit, des images. Les petits chagrins cités ci-dessus n'enlèvent pas grand chose à cette oeuvre et j'attends avec (im)patience la suite !

Ma'at représente peut-être un avenir de la bd, débordant des frontières classiques. Et c'est tant mieux. Si vous êtes en quête de nouveauté, n'hésitez plus.

Le blog de Simon et les galeries sur son site Resonance Art vous donneront un aperçu suffisant de son style.

Mar27th

Victor Hugo - Dessins visionnaires

Nicolas Antille Paintings Read on

For the english speaking people, this exposition is in Lausanne at the Fondation de l'Hermitage so if you happen to come over here and have two or three free hours, I recommend you go take a look. This article from artdaily.org is enough of an introduction if you want some details beforehand. It's actually a direct translation of the same article in French, without the practical information, on fondation-hermitage.ch.

Sans transition, place au Français.

L'exposition

Elle durera jusqu'au 18 mai 2008 à Lausanne à la Fondation de l'Hermitage. On y découvre Victor Hugo sous des aspects très variès, tantôt par ses dessins, tantôt par des photographies qui lui donnent une dimension plus proche de nous. Il y a aussi toute une partie dédiée à la perception d'autres artistes sur Hugo par le biais de caricatures. Ce sont dans les sous-sols que la vie au quotidien d'Hugo est exposée : des photos de famille, des intérieurs de sa Hauteville House qu'il a modifié et de ses obsèques immenses sous l'Arc de Triomphe, des lettres ouvertes dans une écriture parfois illisible, de vieux appareils photos et autres.

Le combat

Victor Hugo a milité pour les droits de l'Homme à une époque où cela semblait être inapplicable en France. Lors du coup d'Etat de Napoléon Bonaparte en 1851, il a essayé de soulever le peuple de Paris sans réussite et a dû s'exiler, proscrit par l'Empire, d'abord en Belgique puis dans les îles anglo-normandes de Jersey puis Guernesey. Il n'est revenu en France qu'en 1870, après dix-neuf ans d'exil, lors de l'instauration de la République. C'est pourtant dans cette période qu'une nouvelle phase de ses oeuvres s'est ouverte, plus forte et prolifique en dessins, recueils poétiques et romans (Les Travailleurs de la mer, Les Misérables, L'Homme qui rit, ...). Il avait compris le pouvoir de l'image et a utilisé ses aptitudes au dessin, tout comme son Verbe, afin de servir ses idéaux politiques et sociaux, ce qui lui a été reproché par certains artistes qui ne voulaient pas mélanger art et politique. Hugo a été caricaturé dans nombre de journaux de l'époque en France.

Victor Hugo le justicier (caricature du Pétard)

Caricature de Victor Hugo par Alfred Le Petit, Le Pétard n°40, 1878

Lors du jugement d'un criminel, les gens pouvaient intervenir en tant qu'orateurs et c'est ce que fit Hugo pour défendre un condamné à mort suite à une tentative de meurtre. Il a demandé l'emprisonnement à perpétuité de l'homme jugé plutôt qu'une exécution barbare. Il n'a été soutenu que par deux voix dans l'assemblée. La caricature ci-dessus ironise l'utopisme naïf d'Hugo quant à l'éradication du crime. Les ailes d'anges et la couronne affublées au prisonnier enchainé sont la finalité du justicier, absurde dans ses habits de victoire rouges. Je me suis demandé si le prisonnier aurait eu un meilleur sort dans un emprisonnement à vie qui est peut-être pire que la mort elle-même. Une interdiction de vivre et de mourir, de quoi rendre fou...

L'homme-océan

On connait plus les oeuvres littéraires ou la vie mouvementée de Victor Hugo que ses dessins. Victor Hugo n'a pas fait d'école d'art ou de dessin et c'est en autodidacte qu'il a dessiné, en majorité à la plume et lavis d'encre brune, expérimentant à son gré les projections d'encre sur papier. Victor Hugo considèrait que le dessin est un prolongement de l'écriture.

Victor Hugo - Ma Destinée

Victor Hugo, « Ma Destinée », 1867, plume et lavis d’encre brune, gouache sur papier vélin, 17,4 x 25,9 cm.

Dans cette marine, on peut distinguer un bateau porté par une gigantesque vague. Hugo disait aux marins de la Manche :

"en proie aux événements comme vous aux vents, je constate leur démence apparente et leur logique profonde ; je sens que la tempête est une volonté, et que ma conscience en est une autre, et qu'au fond elles sont d'accord ; et je persiste, et je résiste, [...] et je fais mon devoir, pas plus ému de la haine que vous de l'écume."

Une vaste gamme de ruines ont été dessinées par Hugo, un de ses sujets de prédilection.

Victor Hugo -

Victor Hugo, "La Tourgue en 1835", 1876

Les Travailleurs de la mer

Après la sortie de ce livre, Hugo a édité une série de trente-six dessins s'y rapportant. Ce ne sont pas des illustrations du livre mais des travaux parallèles qui ont été un outil de travail, une inspiration pour l'écriture. Hugo ne voulait pas qu'on s'intéresse trop à ses dessins car il redoutait la concurrence que ceux-ci feraient à ses écrits.

De 1830 à 1835, Hugo a dessiné beaucoup de caricatures, pour le plus grand plaisir de ses enfants, et des visiteurs de l'exposition ! Il a ensuite délaissé ceci et n'a repris la caricature qu'en 1864

La nuit, quand il tonne, si l'on voit des hommes voler dans le rouge des nuées et dans le tremblement de l'air, ce sont les sarregousets. Une femme, qui demeure au Grand-Mielles, les connaît. Un soir qu'il y avait des sarregousets dans un carrefour, cette femme cria à un charretier qui ne savait quelle route prendre : "Demandez-leur votre chemin ; c'est des gens bien faisants, c'est des gens bien civils à deviser au monde". Il y a gros à parier que cette femme est une sorcière.

Les Travailleurs de la mer, caricature

Victor Hugo, Les Travailleurs de la mer : « Figure que font les paysans quand ils voient les sarregousets », plume, pinceau et lavis d’encre brune

Certaines créatures, plus ou moins fantastiques font parfois irruption dans les dessins d'Hugo. La pieuvre, sujet d'épouvante pour Hugo est décrite dans un passage (la fin m'a fait rire !) à son nom :

Une forme grisâtre oscille dans l'eau ; c'est gros comme le bras et long d'une demi-aune environ ; c'est un chiffon ; cette forme ressemble à un parapluie fermé qui n'aurait pas de manche. Cette loque avance vers vous peu à peu. Soudain, elle s'ouvre, huit rayons s'écartent brusquement autour d'une face qui a deux yeux ; ces rayons vivent ; il y a du flamboiement dans leur ondoiement ; c'est une sorte de roue ; déployée, elle a quatre ou cinq pieds de diamètre. Épanouissement effroyable. Cela se jette sur vous.
L'hydre harponne l'homme.
Cette bête s'applique sur sa proie, la recouvre, et la noue de ses longues bandes. En dessous elle est jaunâtre, en dessus elle est terreuse ; rien ne saurait rendre cette inexplicable nuance poussière ; on dirait une bête faite de cendre qui habite l'eau. Elle est arachnéide par la forme et caméléon par la coloration. Irritée, elle devient violette. Chose épouvantable, c'est mou.
Ses nœuds garrottent ; son contact paralyse.
Elle a un aspect de scorbut et de gangrène ; c'est de la maladie arrangée en monstruosité.

Victor Hugo - La Pieuvre

Victor Hugo, Les Travailleurs de la mer : « La pieuvre », plume et lavis d’encre brune

En savoir plus

Cette courte émission de la TSR parle un peu de la vie de Victor Hugo et de l'exposition à la Fondation de l'Hermitage.

Les dessins d'Hugo figurant dans cet article proviennent du site de la bibliothèque nationale de France mais il y manque la quasi-totalité de ce qu'on trouve exposé à Lausanne, où se trouvent plus belles oeuvres en ce moment. Le site de la bibliothèque est néanmoins très intéressant, vous pourrez y découvrir d'autres dessins de Victor Hugo et des explications détaillées de sa vie.

Mar22nd

First steps with PureMVC

Nicolas Antille Flash/Flex Read on

After a first leap into design patterns driven development with pixlib in AS2, followed later by an implementation of Cairngorm, I decided to look for AS3 frameworks so I browsed the web and found this article talking about a so-called PureMVC. I disliked the name at first (as if it matters !), not to mention the article wasn't praising the framework at all. It made me curious. I had to try it.

I took a look at the puremvc's diagram and wondered if I had missed something essential in my learning of design patterns since I had never thought this far seen such an implementation of MVC. I got the big picture thanks to the documentation and samples on puremvc.org. I really appreciated the noteworthy efforts put in documentation. The best practices document is maybe one of the most useful documents that answered (some of) my many questions as everything was hazy in the beginning. Also, I have come across 10 tips for working with PureMVC which is very useful.

For a time, it was good. Problems appeared later on.

Abstraction

This framework motivates me because it helps (forces) thinking a level above in terms of abstraction. Notwithstanding this, it is still cloudy in my mind. I often have found myself wondering what to do. For example let's say I have a section of a website, SectionMediator, that wants to populate its view with a list of buttons whose data is loaded into SectionRemotingProxy. Let's suppose all the classes I talk about below are registered to the ApplicationFacade. My options :

  1. Sending a Notification (without body) that the SectionMediator listens to, then retrieves the SectionRemotingProxy and gets the data it needs from the proxy by accessing it directly
  2. Sending a Notification, whose body is an Array of ItemDataVO (variable object), that the SectionMediator listens to, then use the array of variable objects to populate its viewComponent
  3. Sending a Notification that will trigger a Command which will retrieve both the SectionMediator and SectionRemotingProxy instances so as to get the data of the latter to transmit it to a method of the former. Basically, the command does the job of updating the SectionMediator's viewComponent.
  4. Mixing options 2 and 3 : send a Notification whose body is the VO that will trigger a Command that needs only to retrieve the SectionMediator and feed it the variable object from the Notification's body.

Option 3 augments loose coupling but is that really the best choice ? I read that Commands should be used as much as possible and a Command should know the least possible the classes it's using. So Option 4 might as well be my choice. But wait ! It's actually a complication of Option 2...which in turn is a complication of Option 1. Am I back to the beginning ? It may be so.

I still don't know what is my choice. I'll experiment some more and see what happens.

Mar21st

GMap and Yahoo Maps for Flash CS3

Nicolas Antille Flash/Flex Read on

I thought it was a very nice move from Yahoo to provide the community the free Astra project. I wanted to try their components, especially the YahooMap component because I wasn't satisfied with the AFComponents's GMap I used in some AS2 projects.

GMap shortcomings

I've come across several problems with the GMap component.

  • The component is provided in an .mxp without sources and that led to the same problem as for the TXEFF component
  • GMap can be animated and that's very cool to zoom, pan with the map scaling and moving smoothly. Ok the fun stops here. Even though the concept is nice, it forces the component to preload tiles from different depths so that the zoom animation does not zoom on empty tiles. Same goes for panning. In AS2 there is no way to force a loader to stop loading something. GMap is in AS2. Loading too many tiles + can't stop loading the useless tiles = whoops !
  • GMap connects to proxies on afcomponents.com not on google.com. That leads to problems such as really slow loadings.
  • GMap was sometimes refused imagery because Google blocked it upon too many requests.
    "Too many requests from the same ip is interpreted as an automatic request, which makes it unable to bypass google's security system"

GMap is a good component though. It is rather well documented and the forum is a big help for in-depth information search. It helped me not wasting time on drawing ugly maps on Illustrator (because maps weren't something affordable for small/medium clients not so long ago). However, the lack of control upon the component and its inherent complexity makes it sometimes go haywire.

YahooMap in Flash CS3

Now let's talk about YahooMap. I read rather quickly that there was a YahooMap component for AS3 so I downloaded it and what the hell ? It's a Flex component. This is quite a problem since I'm on a project with Flash CS3. A quick google search and I found Josh Tynjala's blog with an interesting solution.

Two good things about this. First I learnt about ApplicationDomain and how you can access to classes loaded dynamically from a swf. Second, I learnt that a .swc component is actually an archive file that you can decompress with something like PowerArchiver. I downloaded his code and files and integrated this concept in my current project. Then came the time when I wanted a custom marker on my map...

Custom markers for YahooMap

The problem with Josh's temporary solution (they're going to make a Flash CS3 component of the YahooMap soon) is that you have to browse the YahooMap documentation and find out how the classes are related, then import them dynamically and see what happens. It was a little struggle to understand how a Marker is built. I read somewhere that the markers are extensions of Sprite. Basically, for a custom marker you should extend the SimpleMarker or SearchMarker class, or implement the IMarker interface in your custom class. ARGH ! The former is impossible since you cannot extend a non-existing class (remember YahooMap's classes are loaded dynamically from the library.swf). The latter would take too much time when I just want a custom image to show instead of the SimpleMarker.

This little ugly hack removes the graphics that the SimpleMarker generates and lets you add your own images/shapes/whatnot.

// We cannot strong type "marker" here
var marker = new SimpleMarker();
marker.latlon = new LatLon(lat, lon);
_map.markerManager.addMarker(marker);
 
// Remove the black shape
marker.removeChildAt(0);
 
// Remove the remaining grey shape
marker.removeChildAt(0);
 
var yourCustomMarkerGraphics:Sprite= new Sprite();
marker.addChild(yourCustomMarkerGraphics);

That's it ! You got your custom marker. Alright, it's a shabby and desperate solution but I needed the component to work asap.

Mar13th

TXEFF component shortcomings

Nicolas Antille Flash/Flex Read on

Code hinting and documentation

In the Flash GUI, TXEFF behaves well and nice but when you want to use it in a code environment like FlashDevelop, it is a pain to open the documentation (on PDFs) and browse through it till you find, or not, the method/properties you were looking for. First, a javadoc-like documentation would help. Second, AS3 wrapper classes would be very welcome. When I import TXEFF in FlashDevelop, create a new instance and write "myEffectInstance." and wait for a listing of the available methods and attributes, nothing shows up. Alright, it's a detail but still disappointing.

Blackbox

The cause of this is the way the component is meant : a black box. The component's sources are obfuscated and we only have access to .mxp files. At first I thought I'd write an interface that defines all the methods used in the component but it's a partial solution for there are a lot of attributes that can't be defined in the interface. I'd need to write a wrapper class but it's just a bother to do that now.

In spite of this, I strongly recommend jumpeyecomponents's TXEFF. It is a big help which lets you concentrate on other tasks. This exhaustive review on webdesignerwall (beautiful blog btw) shows you the component thoroughly. You can also test a few effects on the txeff website.

Pricing

TXEFF costs 169$. It's not that of a big investment considering you're very likely to use it in several projects, if you're a Flash/Flex designer, that is.

A sample done in a few minutes

Click anywhere in the swf to replay.

Monthly Archives

Calendar

  • December 2008
    M T W T F S S
    « Nov    
    1234567
    891011121314
    15161718192021
    22232425262728
    293031  

Categories