[French version Here]

[Update]
— Silen­zio wins an FWA Site of the day for Sep­tem­ber 16^th
— Silen­zio wins a DopeA­ward !
— Silen­zio wins a Paper­vi­sion Show­case Award !

Announ­cing Silenzio — http://www.silenzio.fr

We are so proud to present the new ver­sion of lea­ding movie adver­ti­sing agency Silen­zio Communication’s web site.

We have, for the occa­sion, gone all out.
It fea­tures a whole bunch of tech­no­lo­gi­cal feats, that we have lovin­gly craf­ted and imple­men­ted spe­cially for the occasion.

If we only men­tio­ned just a few :

SWFA­dress, that puts back the “back” & “for­ward” but­tons where they belong, and allows to use them to navi­gate the site. You can also book­mark every page, inclu­ding search results.

Paper­vi­sion 3D, that we tuned to the extreme, in order to pro­vide the per­for­mance we nee­ded to make idea exist (ani­mate more than 300 high qua­lity images simul­ta­neously within an 3D space, while also hand­ling phy­si­cal defor­ma­tions for each)

Remo­ting, to insure a swift and reliable loading

Flex, for a per­fect back-end (you won’t see this one)

CSS3D, for the iPhone ver­sion. We are quite proud of this one, since it may very well be the first pro­duc­tion site to use 3D css on an iPhone, pro­vi­ding a nice Cover­flow expe­rience for the movie posters.

We will detail this spe­ci­fic part in a blog post, check out for it !

Meanw­hile, you can see this work live on http://www.silenzio.fr/

And here are a few screen­shots, for good measure :

[English version Here]

Silenzio — http://www.silenzio.fr

Nous sommes fiers de vous pré­sen­ter la nou­velle ver­sion du site de l’une des plus grandes agences de publi­cité cinéma Françaises, Silen­zio Communication.

Nous avons pour l’occasion sorti les habits d’apparat !
En effet, il com­porte toute une série de petites fier­tés tech­no­lo­giques que nous avons amou­reu­se­ment pré­pa­rées spé­cia­le­ment pour l’occasion.

Pour n’en citer que quelques-unes :

SWFA­dress, qui rend les bou­tons “retour” opé­ra­tion­nels, et l’intégralité des pages du site book­mar­kables, y com­pris la recherche.

Paper­vi­sion 3D, opti­misé à l’extrême pour sup­por­ter l’imposant besoin en res­sources du concept créa­tif pro­posé (ani­mer plus de 300 affiches en temps réel dans un espace 3D, tout en gérant les défor­ma­tions de chacune)

Remo­ting, pour assu­rer une per­for­mance de pre­mier plan au char­ge­ment du site

Flex, pour un back-end irréprochable

CSS3D, pour la ver­sion iPhone, et nous sommes fiers de pro­po­ser un site qui pour la pre­mière fois en pro­duc­tion, pro­pose une inter­face 3D à la Cover­flow, pré­sen­tant les affiches dans un mode ludique.

Nous détaille­rons d’ailleurs bien­tôt cette tech­no­lo­gie sur notre blog, reve­nez bientôt !

Vous pou­vez voir tout ce tra­vail en action sur http://www.silenzio.fr/

Voici quelques cap­tures d’écran :

http://polcarstva.net/ est un jeu en ligne poé­tique et explo­ra­toire, dans un superbe uni­vers illustré.

Il est dom­mage que nous ne com­pre­nions que peu les textes pré­sen­tés, mais la dou­ceur de les images devrait déja vous immer­ger dans un uni­vers de qualité.

Oui mais alors c’est quoi un Sen­sible ?
Pas la moindre idée. Ca res­semble un peu a une langue, mais avec des yeux et des p’tites pattes mignonnes.

Pour en apprendre un peu plus sur cette race de petits n’animaux, trô mignons, ren­dez vous sur le site du NSS : Neglected Sensibles Shelter : Save Your Sensible

Une démo qui pro­met tech­nique­ment : à par­tir d’une simple feuille de papier Marquée, l’ajout en temps réel d’un per­son­nage 3d au sein de VOTRE uni­vers réel…

On en enten­dra par­ler rapidement.

Ca fonc­tionne sur la base de cette tech­no­lo­gie :
ARToolkit

Un autre petit exemple de ce qui est possible :

Processing est un lan­gage de pro­gram­ma­tion spé­cia­le­ment déve­loppé pour créer de l’image ani­mée et statique,

Ce lan­gage vient de “pas­ser en ver­sion 1.0″, ce qui veut dire que les auteurs consi­dèrent qu’il est com­plet et sans pro­blèmes majeurs.

Mais quel intê­rêt me direz-vous ?

Sim­ple­ment de pou­voir, écrire un pro­gramme qui va créer auto­ma­tique­ment une vidéo telle que celle qui suit.
Celle-ci n’a pas été créée “a la main”, mais com­plè­te­ment auto­ma­tique­ment à par­tir de la bande son présentée.

via Make

Si vous lisez ce blog régu­liè­re­ment (et vous le faites, n’est-ce pas ?), vous avez sûre­ment remarqué que nous y post­ons des vidéos régulièrement.

Parmi ces vidéos, vous avez du ren­con­trer cer­taines qui s’affichaient dans toute la lar­geur du site (Par exemple le teaser des Watchmen).

Et parmi celles-ci, vous avez enfin sur­ement remarqué cer­taines qui pro­ve­naient de You­Tube (Where the Hell is Matt en est un exemple.) et s’affichaient dans toute leur gloire en Haute Défi­ni­tion, c’est-à-dire en 1280×720.

En effet, depuis quelques jours il est pos­sible, si vous avez envoyé sur you­Tube une vidéo en Haute Défi­ni­tion, de l’afficher dans toute sa splendeur

Pour faire ceci, voici les modi­fi­ca­tions à apporter :

Dans une page You­tube, si vous dési­rez que la vidéo soit dif­fu­sée en HD, ajou­tez &fmt=22 à la suite de l’url.

Par exmple pour Where the Hell is Matt,
http://www.youtube.com/watch?v=zlfKdbWwruY
devient
http://www.youtube.com/watch?v=zlfKdbWwruY&fmt=22

Evi­dem­ment, si vous faites cela, la taille du pavé dans la page You­Tube ne chan­gera pas, mais si vous cliquez sur le bou­ton plein écran, vous ver­rez que la vidéo est bien en Haute Définition.

Mais le plus inté­res­sant reste de pou­voir affi­cher le player You­Tube ou bon vous semble, et dans la taille qui vous plaira.

Pour faire ceci, il vous sera néces­saire de rajou­ter le code “&ap=%2526fmt%3D22” à votre vidéo.

<object width="1280" height="750" >
	<param name="movie" value="http://www.youtube.com/v/zlfKdbWwruY&amp;rel=0&amp;fs=1; />
	<param name="allowFullScreen" value="true"/>
	<param name="wmode" value="window" />
	<embed src="http://www.youtube.com/v/zlfKdbWwruY&amp;rel=0&amp;fs=1; type="application/x-shockwave-flash" allowfullscreen="true" width="1280" height="750" ></embed>
</object>

Le code sui­vant devient donc :

<object width="1280" height="750" >
	<param name="movie" value="http://www.youtube.com/v/zlfKdbWwruY&amp;rel=0&amp;fs=1&amp;ap=%2526fmt%3D22" />
	<param name="allowFullScreen" value="true" />
	<param name="wmode" value="window" />
	<embed src="http://www.youtube.com/v/zlfKdbWwruY&amp;rel=0&amp;fs=1&amp;ap=%2526fmt%3D22" type="application/x-shockwave-flash" allowfullscreen="true" width="640" height="389" ></embed>
</object>

Pas exac­te­ment ce à quoi vous pen­sez (quoi que vous pen­siez), mais plu­tôt une ban­nière assez drôle pour vous faire éco­no­mi­ser de l’énergie.

Kiwi + Fraises + Flash = Salade de Flash.
Des­si­nez avec des fruits !

Pour jouer avec l’experience, cliquez et déplaçez la souris.

Pas mal d’autres expé­riences sur WagnerPaula

Une pré­sen­ta­tion don­née chez Adobe, expliquant à un public de déve­lop­peurs ce que peut être le “Wow fac­tor”, à savoir l’intégration d’une réflexion sur l’expérience uti­li­sa­teur dans le déve­lop­pe­ment d’une appli­ca­tion en ligne.