Vidéo « nouvelle » génération chez General Electric pour se présenter : pleine page, qualité au rendez-vous, mise en scène, écriture de l’histoire, options de partage…

… ou bien youtube ?

Dernier dossier de l’année : l’utilisation du flash et de la vidéo pour recruter.

Je ne parlerais pas de cv vidéo, leur pratique étant sujette à différentes problématiques éthiques, et c’est une conviction personnelle qui me retient d’en parler dans un processus de recrutement. Nous allons nous attacher plutôt à la manière dont certains utilisent la vidéo et le flash pour séduire leurs futures recrues.

Avec l’explosion de la vidéo sur internet et de l’interactivité, voyons comment certains ont utilisé à bon escient la technologie et quelle approche ils ont choisi. Par vidéo, j’entends également scénario, effets, captation et manière de filmer, travail de post production et montage.

Lire la suite

Il est des marques qui s’acharnent à trouver sur internet un espace d’expression de leur créativité, et à créer des liens avec leurs utilisateurs/internautes/consommateurs. Certaines cherchent sur internet un moyen d’étendre leur notoriété, de tisser des liens visuels, et interactifs avec l’internaute, et d’autres en sont totalement absents. Au final, certains s’expriment sur internet, et d’autres en sont totalement absents.

Je parle là de marques qui acquièrent une réelle présence dans la mémoire des gens parce qu’ils ont compris qu’internet est réellement un terrain d’innovation. D’autres, s’acharnent en spot télé, presse ou radio, et oublient totalement le web. Sur le terrain du web, certaines marques sont totalement absentes, inexistantes. Passées dans l’oubli le plus total. Et qu’est-ce qu’elle vous évoque lorsque vous rentrez dans leur enseigne, vous, internautes ? Rien… rien d’autre qu’un magasin qui vous vend un produit. Nous sommes bien loin du lien sentimental que certaines parviennent à atteindre.

Uniqlo fait partie de la première catégorie : inventive, créative, réinventant à chaque campagne ses codes d’expression. S’ils ont une charte graphique très forte, ils doivent avoir certainement une charte interactive dont les mots d’ordre sont peut-être : soyez inventifs, surprenez l’utilisateur, utilisez les nouvelles possibilités techniques pour vous exprimer, mais sans jamais la mettre au devant de la scène, mais utilisez-la pour servir un scénario visuel, un esprit graphique dans le mouvement. Tout cela au service de l’image et de l’aspect business.

Résultat ? A chaque campagne, c’est un raz de marée de blogs et de sites qui parlent d’eux (moi le premier). Sans jamais débourser quoi que ce soit pour qu’un bloggeur écrive un billet sur eux. C’est ce que l’on appelle la notoriété spontanée. On a envie de parler d’eux parce qu’au travers de leur maitrise du support de communication, il y a une beauté dans la créativité qui force l’admiration. Parce que c’est nouveau, dans le sens où ils inventent de nouvelles expériences interactives à chaque nouveau site avec une qualité de réalisation constante. On pourrait également citer les campagnes Ikea de la même manière.

Attention, ce n’est pas une manière exhaltée de vendre le renouveau continu : tout est relié directement avec des potentiomètres business et indicateurs d’images.

Du site à la bannière

Même chose pour les bannières de pub sur les espaces media : je regardais une étude simple sur les formats qui marchent et il en ressort que les plus « rentables » sont celles qui sont également les plus créatives. Chiffres à l’appui.

Et puis, ce gain en image sur internet est relié directement avec la réputation. Une marque a moins de problèmes lorsqu’un détail gênant apparait sur internet si elle bénéficie d’une « aura » positive. Parce que l’internaute est plus tolérant et qu’il a à son égard un fort capital sympathie. C’est déjà moins à dépenser en veille de réputation, en énergie et en temps humain à démêler tout cela. Regardez sur le même terrain la réputation de GAP : en France, ils sont inexistants sur le terrain de la communication alors qu’ils ont une image déplorable d’exploitants d’enfants dans leurs usines en asie.

Quelle que soit la technique utilisée
Pour tout cela, le flash est bien sûr un maitre en la matière et sert directement les personnes qui l’utilisent à bon escient : interactivité, un peu de scénario (storytelling) bien ficelé, une approche technique qui relève le défi de principes créatifs pour renouveler l’expérience d’un utilisateur sur un site internet. Wake up, l’âge de l’internet préhistorique est dépassé, et cela va beaucoup plus loin qu’auparavant.

Et quelle que soit la technique utilisée : je parle de flash, mais il en va de même avec un site en html bien géré au niveau CSS : un bon choix d’image, de tonalités, de couleurs… Je vous invite à consulter tous les exemples magnifiques chez Konigi qui montrent également en terme d’ergonomie, ce que l’on peut faire pour améliorer le sentiment de confort ressenti sur un site internet.

Construire son identité interactive sur internet
Faisons un parallèle entre plusieurs réalisateurs connus : Tarentino, Tati, Tim Burton, les films de Dreamworks ou les Disney…

Un film ne se résume pas uniquement à son affiche ou à son teaser sur allociné. Est-ce la même manière pour chacun de ces exemples de filmer, d’écrire un dialogue, de définir des codes graphiques, de cibler son public ? Bien sûr que non, ils ont une identité et une patte qui leur est propre. Il en va de même pour l’image de chaque marque sur internet. Trouvez vos propres manières de communiquer et de vous exprimer. Et arrêtons de diffuser la même sauce à toutes les cibles, avec des identités et des discours qui se ressemblent tous, en jetant négligemment un message porté avec naïveté sur internet, juste parce qu’internet est un support comme un autre. Et qu’il n’est pas noble comme la télé ou la presse.

Au delà de la campagne éphèmère : le long terme
Le social media a beau être très tendance en ce moment, c’est encore une histoire d’interaction avec les utilisateurs. Une relation au plus long terme qui vise créer de la valeur avec ses clients, prospects, ou « fan ». Ce n’est pas cela qui ira sauver une entreprise en difficulté, certes, mais cela peut aider à limiter la casse, à fidéliser, à améliorer son image auprès d’une certaine cible. A connecter les personnes qui composent l’entreprise avec l’extérieur. Combien de marques sourdes et muettes ont des collaborateurs qui ne disent jamais à l’extérieur de quelle entreprise ils viennent juste par défaut d’image… ?

Merci à ceux qui m’offrent ce service
Une marque qui lance une application rendant service quotidiennement à un internaute. C’est le cas de widgets notamment ou d’autres plateformes de mise en relation. (Cherchez bien, vous en trouverez..) Vous imaginez le gain en terme d’image ? Tous les jours de la semaine, j’emporte avec moi une application qui m’est réllement utile, et qui me sert vraiment. Qu’importe au final s’il y a un petit logo dans un coin. J’y suis attaché, je la garde.

Et encore une fois, on peut en être absent également… et creuser un peu plus le fossé entre ses utilisateurs et soi-même. Ou commencer à réfléchir interaction : interaction par le dispositif offert ou interaction avec les utilisateurs.

Non, ne fuyez pas tout de suite, je m’explique :
Le flash est très utilisé pour les lecteurs audios/vidéos, pour des RIA, à destination des domaines variés du e-commerce aux sites marketing ou aux applications un peu plus ludiques. Les campagnes interactives et marketing, d’accord, mais le web ne tourne pas qu’autour de cela !

Et il est un domaine – celui des sites institutionnels – caricaturalement ennuyeux, avec des chiffres sur l’entreprise, une maladie du PDF et un wording parfois si complexe et institutionnel qu’il en est incompréhensible. Ce n’était pas jusqu’à récemment un domaine qui se voulait être le fer de lance de l’innovation. Et pourtant ! il y a aujourd’hui un enjeux certain à se présenter en 2009 de manière un peu plus proche des internautes, de manière à répondre à leurs besoins lorsqu’ils naviguent sur ces sites. Et de manière plus interactive, plus attrayante. Pour résumer, j’essaye d’aller là où se passe en théorie le moins de choses pour en tirer les quelques points les plus intéressants.

Et la question suivante se pose : quelle est l’utilisation sur ces sites de grands comptes(+premières plus grandes compagnies du monde) du flash, alors que l’accessibilité et le référencement par le dieu Google du contenu textuel est censé être une de leur règle première ?

Bon nombre de sites semblent avoir compris le principe des flux RSS à présent, voire des podcasts pour certains. Pourtant, dès que l’on arrive sur de l’audio ou de la vidéo, c’est une autre affaire. Regardons cela de plus près. Au sommaire donc :

- Diaporamas, illustrations, photos interactives, vidéos, webcast, PDF, synthèse vocale, lecteur vidéo….

Note : attention, évitons toute mésentente, je ne dis pas que faire un site en flash est bien. Je fais simplement un état des utilisations du flash sur ces sites et exclusivement du flash. Et j’ai essayé de rester impartial^

Lire la suite

Quelques idées sur 2009 en quelques points non exhaustifs bien sûr, je mets à plat quelques ‘trucs’ qui m’interpellent quand on me parle de 2009…

1. Le web tend de plus en plus vers le jeu et des codes interactifs ou narratifs (et sans parler du cinéma) qui puisent leur inspiration dans celui-ci. On le voit beaucoup au travers de certains sites en flash apparus en 2008 ou certaines bannières : la mise en scène ludique du contenu, la manipulation interactive des éléments dans l’espace, le scénario… (merci à la 3D temps réeel, la vidéo interactive, et le flash tout court)C’est aussi une question de capacité technique devenu possible, mais c’est un aspect du web que je prends plaisir à observer.

2. 3D in the browser : oui ! de Flash 10, à Unity3D, de plus en plus… j’en parle assez depuis des mois et certains se demandent aujourd’hui si Adobe n’aurait pas intérêt à racheter Unity pour l’intégrer dans flash. beaucoup ont envie de faire un grand pas en avant avec les capacités de calcul. Cette idée folle pourrait être révolutionnaire… Toutefois, le débat entre Unity et Flash semble intéresser pas mal de monde. Il y a même sur googlecode des projets d’intégration de Unity dans une page web, très tourné vers le dialogue avec Flash (j’avais avancé l’idée que Unity pourrait remplacer Shockwave, ce n’était peut être pas si idiot que cela, et surtout avec la mise à dispo de l’outil sur pc qui arrive en 2009)
;)

3. Interconnections, et dialogues : de la 3D au web, du web au mobile, du mobile à la 3D, de la 3D dans le web qui communique avec un mobile, du web/metaverse qui comunique avec des objets reliés à internet… : dialogues, échanges, et partage de données. Comme pour le flash : tout support, plateforme, omniprésent et permanent. Des services comme Twitter forcent la main, sous la frénésie des internautes à vouloir rester connectés en permanence. La représentation des données s’adapte en fonction du support, mais elles continuent de transiter…

4. En parlant de Lifestream/lifelogging, l’élément central reste l’identité numérique et l’avatar. Ce couple est une relation passionnante qui reste la base de tout échange, et la base de nombreux univers. Je crois beaucoup à l’utilisation et à la montée en puissance de l’avatar comme élément central d’un certain développement du web (ce n’est pas nouveau en même temps), même si c’est quelque chose d’un peu trop systématique aujourd’hui. (Edit : à lire un billet qui va dans ce sens d’ailleurs! et ma petite chronique là-dessus sur l’atelier)

5. Attention à ne pas se lancer trop vite : le web se développe depuis 15 ans, la 3D sur le web tente de se développer depuis 15 ans. Certains sujets reviennent régulièrement sur le devant de la scène : espaces virtuels, agents virtuels, tout 3D… Laissez du temps aux technologies pour devenir un peu plus standard et matures… Oui, tout ceci est fun, mais pas n’importe comment. Il y a une question d’équipement du public, de coût de production, de performance de la techno… Observez, testez, expérimentez… Je suis assez d’accord avec certains points évoqués chez readwriteweb : il y a les usages et technos du passé qui ressurgissent avec un effet ‘hype’ et les vraies innovations qui ont tendances à se mêler entre elles et l’évolution peut être lente.

6. Toujours dans les réserves : malgré toutes sortes de prédictions comme celle de Forrester, et malgré des concepts convaincants ci-et-là, je ne crois toujours pas à la prochaine transformation totale d’internet de la 2D à la 3D . Ce sont deux choses qui continueront encore longtemps de travailler en parallèle, de dialoguer et qui ne partagent pas forcément le même usage. (Je reproche un peu aux prédictions de vouloir voir trop loin ( > 2015 ?!), ce qui fausse la vision des choses, et s’écarte de la réalité de ce que sera le futur… beaucoup de points ne sont pas gagnés par avance). C’est aussi pour moi une question d’interface.

Par contre, il ne faut surtout pas sous-estimer la montée en puissance de la 3D du côté du web ou des metaverses (advergames, simple interface 3D en flash, concepts originaux de jeux, serious games, mondes miroirs…). Les outils de créations se sont multipliés en 2008… il va devenir aussi facile de créer un univers virtuel qu’une page web… non j’exagère… Mon site favori de l’année ? Ecodazoo bien sûr !!!

7. On a vu cette année la sortie de Silverlight 2, Flash 10, et AIR sur le terrain des RIAs. Ne me posez pas la question de savoir si Flash ou Silverlight va gagner, je n’aime pas les mettre en concurrence. Toutefois, on va voir en 2009 une explosion des effets d’annonce, des moyens et finalement des avancées en terme de 3D, de vidéo, de RIA… jusqu’à Silverlight 3 et Flash 11 à la fin de l’année 2009. Des versions logicielles qui se suivent plus rapidement, mais est-ce que les gens vont suivre, eux ? (formation, équipement, coût de chaque upgrade…)

8. Montée en puissance de la réalité augmentée comme l’a été en 2008 l’interface tactile. En flash, c’est encore un peu limité, mais sur consoles, sur pc, ou dans les magasins, c’est un élément ludique surprenant qui fascine et qui peut être bien utile de surcroît. IHM, quand tu nous tiens…. Quelques exemples :

Sur PC, consoles ou autre :
- Mini expérimente la réalité augmentée en Allemagne avec plein d’images sur cet autre blog.
- Eyepet : la réalité augmentée arrive sur PS3
- Réalité augmentée de bureau : de nouveaux tamagotchis ? (ca bugge à loisir mais cela reste intéressant).
- Sur une petite revue de web ancienne

En Flash avec Papervision :
- Cette première exploitation pour un vrai site internet de Flartoolkit pour globo.com
- 2ème réalité augmentée en flash et un magazine papier augmenté…
- Réalité augmentée en Flash : #3ème, chez Digital Pictures

Sur Iphone:
ARF : un chiot en réalité augmentée sur Iphone

8 bis. – C’est aussi l’année où l’image va sortir le plus de l’écran, et ce, un peu partout (webcam ou cinéma). Avec les bonnes vieilles lunettes, pourquoi pas. Toutefois, c’est comme pour la 3D sur le web, ces nouvelles interfaces vont enrichir, compléter ou travailler en parallèle l’expérience d’un utilisateur, mais pas remplacer totalement celle que l’on connait depuis des années. (clavier, souris, page web, écran…)

Et enfin, deux points un peu plus hors sujets :
9. Réalité du terrain oblige, des services courants web 2 deviennent payants. (Si jamais un jour netvibes devient payant, je n’aurais pas trop de mal à louer ce service tant il m’est devenu indispensable… mais il ne faudrait pas que cela se généralise ! )

10. Un fossé regrettable de plus en plus présent entre les acteurs d’internet qui font de la veille et grandissent au rythme de l’évolution du web et ceux qui gardent leurs acquis sans les renouveler. Le web a évolué très très vite depuis quelques années et cela continue. Des métiers sont apparus (ne serait-ce dans la création, voir à ce sujet les études de designers interactifs) et le panel des connaissances au global s’étend de plus en plus. Je ne parle même pas de ceux qui n’ont pas pris le train en marche de l’essor d’internet (ou qui ne peuvent pas, confer fracture numérique bien connue)… les résultats sont notables en qualité de la communication, des campagnes et des investissements qui sont faits dans des opérations qui n’auront pas les résultats escomptés. Peut-être est-ce aussi le début de cette Génération Y qui grandit avec un web plus mature, et le ciblage d’un public en particulier de plus en plus important, avec des strates de plus en plus marquées dans les différents usages (UGC, advergames, Serious Games etc…)

De fil en aiguille, les technologies traitées dans ce billet, me permettent aussi – point après point – de montrer qu’il y a une certaine logique sur ce blog (ahah!) et pourquoi je parle d’interactivité en flash, de 3D, et d’univers virtuels régulièrement et de manière mélangée. De plus en plus, ces points sont liés et se mêlent entre eux ! Ce n’était pas si difficile que ca à trouver dans le même temps…

Je me rends compte avec effroi que tout le monde ne maîtrise pas vraiment la vidéo dans flash, alors allons-y pour les bases. Cela permettra peut-être d’éviter des erreurs de taille (et de poids !), même si je n’ai pas pour vocation de faire des tutoriaux…

Jouer avec de la vidéo sur le web en flash : comment ?
Plusieurs techniques :
- Intégrer directement la vidéo dans le swf. Pratique pour les interactions, l’intégration ou les transitions, mais destiné à des boucles ou des vidéos très courtes, car l’inconvénient est qu’il faut tout télécharger avant de commencer à le lire. (on pouvait avoir aussi à une époque un décalage de synchro vidéo/son sur des vidéos longues)
- séparer la vidéo du swf : permet le streaming ou le progressive download. Autorise ainsi la lecture dès que quelques secondes de vidéos sont chargées ou la lecture instantanée.

Historique et formats
Le format vidéo de prédilection de flash est le FLV. C’est ce que l’on appelle un conteneur, comme l’avi ou le mov. Il permet d’avoir différentes compressions vidéos à l’intérieur même de cette extension. Rapide historique

En 2002, avec flash 6, le codec Sorenson est apparu et a permis de lire de la vidéo en H263 sur le web le plus simplement du monde. Utilisé longtemps par Youtube, il n’a pas été spécialement apprécié par les amateurs de vidéos de qualité mais il a permis de démocratiser totalement la vidéo sur le web, et Youtube comme Viméo ont finalement migré vers le au H264 (j’y viens).

Avec Flash 8, le codec propriétaire On2 VP6 a complètement boosté la qualité et optimisé le poids des vidéos, instaurant une nouvelle ère de la vidéo interactive. De plus, le VP6 permettait la prise en charge du canal alpha, ouvrant la voie à des incrustations de personnes ou d’éléments interactifs sous fond vert/bleu dans la scène. Ajoutons l’effet de ’smooth’ directement dans flash 8 qui permet de lisser une vidéo présentant des effets de petits carrés, un peu plus consommateur en ressources par contre.

En Aout 2007, ca se complique, mais pour le meilleur. La release beta 9.115 du player flash prends désormais en charge le mp4 et le H264 (enfin x264) tout en créant en parallèle un nouveau container : le F4V (f4a pour l’audio et f4p pour le mp4 avec DRM) avec du son en AAC et plus seulement en mp3.

Pourquoi avoir rajouté cette prise en charge de ce format ? Sans parler de support en plus de M4V, M4a ou de 3gp pour le mobile, je ferais court : Adobe s’est rapproché d’un standard, plus libre, permettant d’encoder avec une très bonne qualité la vidéo. De plus, le H264 permet la HD pour peu que l’on ait la bande passante suffisante (histoire de contrer l’avance prise par Silverlight à l’époque pour l’excellente qualité de sa compression en wmv). Cela a aussi permit à de nombreux acteurs de la vidéo en ligne de ne pas utiliser de codec propriétaire à licence/royalties… puisque FFMpeg, MeGui ou Mencoder côté serveur peuvent aussi à l’heure actuelle encoder en H264.(même si certains ont trouvé la parade depuis apparemment avec le VP6).

Comparaison
Quel est le codec de compression idéal ? Tout dépend du projet, mais une chose est certaine : le Sorenson H263 est un format préhistorique maintenant, lourd, de mauvaise qualité, à proscrire en 2009 (je prends de l’avance). Préférez un VP6 ou un H264… Je viens de refaire la comparaison, un VP6 est de meilleur qualité à débit de moitié inférieur à un Sorenson. (200 / 400kbps).

Entre le VP6 et le H264 ? C’est à peu près la même chose, même si les effets de compression sont différents (crénelage, flouté, perte de teinte/luminosité de couleur….). Je trouve que l’on perd un peu en intensité de couleur en h264… même s’il est censé être meilleur que le VP6.

Si le temps d’encodage est critique pour vous, faites attention au format source de la vidéo : un mp4 en source est très long à encoder en flv tandis qu’un simple avi tout bête en DV sera rapide. Autre détail à prendre en compte : le temps de l’encodage d’un même fichier en VP6 ou H264. Le H264 est plus long à encoder et il est plus consommateur en ressources CPU à la lecture.

La qualité est aussi importante : une vidéo très compressée à l’entrée en encodage ne vous donnera pas une meilleure vidéo en sortie. La source doit être impeccable !
;)

Encoder, comment ?

Le plus simple aujourd’hui reste de passer maintenant par le Adobe Media Encoder : il est fournit avec flash et autres logiciels de la suite d’Adobe, il est à l’heure actuelle de très bonne qualité, gérant avec la CS4 les batchs d’encodage, l’estimation du projet final et les différents profils de réglages. Il y a aussi MediaCoder ou Riva. Il existe bien sûr d’autres outils assez puissants (Turbine, Sorenzon Squeeze, Rhozet (ancien Canopus), Flix…), mais souvent payants et… beaucoup plus chers. (4 000€ pour un encodeur, dans un projet, ca plombe un peu l’ambiance…)

Note : tous les encodeurs se suivent et ne se ressemblent pas. Ils n’ont pas les mêmes performances en qualité de compression et de temps de calcul. Faites des tests si vous hésitez.

Note 3 : les outils payants ont des fonctions que les autres n’ont pas forcément. Je pense aux « watched folders » qui permettent d’encoder dans différents profils des vidéos déposées dans un dossier partagé à partir d’un réseau ou depuis internet, et de les renvoyer ensuite par FTP ailleurs….

Note 3 : attention par ailleurs aux metadata, ces petites informations incluses dans le FLV. Un encodeur inconnu peut ne pas les inclure, perdant ainsi des informations de durée, de débit etc… c’est pour cela que sont apparus des outils comme celui de Buraks : FLVMI. Sans metadata, oublions le streaming et la navigation efficace dans la vidéo.

Débit d’encodage et bande passante ?
La bonne question^ Cela dépend aussi de votre projet, mais il faut savoir qu’une vidéo très « standard » encodée à 550/600kbps ne gagnera pas forcément beaucoup en qualité si elle passe à 800kbps, toutefois si vous avez du traffic sur cette vidéo, cela représente une grosse montée en charge au niveau de la bande passante : 1/4. Et oui. Libre à vous de monter à 1500kb/s ou de faire de la HD si le coeur vous en dit mais il faut éviter que l’internaute n’attende trop le chargement…. ou que la plateforme ne supporte pas la charge.

Adobe a mis en ligne il y a quelques mois une calculette pour le débit optimal si jamais vous n’êtes pas sûr de vous ainsi qu’un autre article sur la taille recommandée que l’on peut utiliser pour étirer la vidéo. (Encoder en 320×240 mais on peut la visualiser avec une règle simple de multiples en 464×348) (septembre 2007 quand même, mais c’est un bon référent. Pour info, c’est ce que font Youtube et Dailymotion.)

Dernière chose : l’espace disque sur les serveurs ne coûte rien aujourd’hui. Par contre, la bande passante est une autre paire de manche. Think about it.

Paramètres d’encodage : CBR, VBR, FPS…
Il existe deux techniques d’encodage :
- Le CBR (Constant Bitrate Rate) et le VBR (Variable Bitrate Rate). En gros, le CBR diffuse en continu par exemple 500 kb à la seconde de donnée tandis que le VBR va analyser la vidéo pour réduire le débit lorsque l’image n’a pas de mouvement et remonter plus fortement lorsque l’image bouge beaucoup. Cette fourchette haut et bas est bien sûr paramétrable et elle permet d’optimiser énormément la qualité de la vidéo.

Pour le VBR, il y a l’analyse à la volée avec un 1-pass et l’analyse plus fine avec le 2-pass, plus longue à encoder. Un VBR 2-pass est préférable, car l’autre provoque des effets hilarants dans certains cas de compression dès que la vidéo entre en mouvement.

On peut jouer en fonction de la nature de la vidéo sur les FPS (Frame Per Second). Cas beaucoup plus rare, cela peut être utilisé lors de fonds animés plein écran en vidéo, cela marche bien, mais c’est vraiment occasionnel. Le risque est d’obtenir une vidéo saccadée si l’on tombe en-dessous des 25 images par seconde. (standard en Europe). Un 60 FPS avec de la HD donne une superbe fluidité à l’image mais… disons que c’est consommateur en bande passante… (euphémisme!)

Keyframe
Je fais court : une keyframe est l’image de référence à partir de laquelle la vidéo ensuite va rajouter ce qui a changé : mouvement, déplacement etc… Rajouter des keyframe va alourdir la vidéo, en enlever peut provoquer (notamment pour le streaming) des effets indésirables (de lapin bien sûr) dans la navigation.

Le son ?
Le poids du son doit s’ajouter à la vidéo bien sûr et il faut faire attention à la nature de la bande son. Si vous avez de la musique complexe, vous pouvez passer jusqu’à du 160 kbps en stéréo, mais pour de la voix, en fonction de sa nature, vous pouvez descendre à du mono, 64kbps et même moins, jusqu’à cibler un 11khz de fréquence d’échantillonage. (Cela s’entends dans tous les cas à l’oreille).

The end
Il existe d’autres choses à prendre en compte plus poussée comme la taille finale de l’export, le 4:3 et le 16/9ème, les keyframes, le désentrelacement, les filtres mais en laissant les paramètres par défaut, ca passe bien le plus souvent… et le but ici était d’arriver à s’y retrouver dans les différents formats, les basics quoi.

So…. la conclusion est : sauf si vous avez le malheur de devoir cibler flash 6 ou 7, le Sorenson H263 est vraiment mort : lourd, de mauvaise qualité, vieux. Même si l’on peut faire de très bons encodages avec, j’ai envie de dire : Oubliez-le.
;)

J’ai fait ce guide rapidement, mais si vous avez repéré une erreur, comme d’habitube, faites signe ^

La question revient de temps en temps : si je ne veux pas utiliser dailymotion ou youtube pour diffuser mes contenus vidéos pour une raison x ou y et que j’ai besoin d’installer ma propre plateforme, quelles solutions s’offrent à moi ? Je passe en revue quelques technologies open sources, toujours à base de flash…

Note : l’architecture la plus courante est découpée en 3 zones : un front php pour afficher les pages webs et le player vidéo, une routine serveur qui encode les vidéos, et une dernière qui héberge les vidéos (en streaming, download progressif, ou bien streaming php). Chacune de ces zones peut être sur le même serveur pour les plus petits besoins ou bien séparé (à chacun sa tâche), voire offrir des architectures beaucoup, beaucoup plus complexes, utilisant des load balancer ou des CDN par exemple de type Akamai, level3 ou autre… pour les gros budgets.

Construire tout soi-même
La solution la plus courante est le couple php – ffmpg ou mencoder (pour l’encodage) notamment, avec parfois un streaming offert par un Red5, ce magnifique concurrent open source d’un Flash Media Serveur coûteux. Les encodeurs gratuits sont complexes à configurer mais ils sont toujours moins coûteux qu’un turbine (au hasard).

Côté player vidéo ? Je crois que le player de Joering fait l’unanimité sur le web, même si refaire entièrement un player vidéo n’est pas si compliqué…

Des solutions open source toute faites.

Trois solutions open source :
- PHPMotion : Celle qui semble la plus simple classique techniquement parlant.

- Pandastream : Utilise pleinement les webservices d’Amazon.

- Kaltura avec un superbe éditeur en ligne.

Le choix reste dans le déploiement technique : linux bien souvent, php ou ruby on rails, et quelle architecture, avec quel dialogue vers quelle plateforme, avec quel système d’hébergement (interne ou externalisé)… etc. A noter qu’il existe aussi des solutions payantes similaires mais honnêtement, il y en a pas mal. Mais maintenant, vous savez que cela existe et si vous en connaissez d’autres, n’hésitez pas.

(Cliquez sur l’image pour l’agrandir.)

Je me lance, car la question taraude pas mal de gens et je ne trouve définitivement pas d’articles qui répondent concrètement à celle-ci. Ce graphique est une interprétation personnelle aussi bien qu’elle tente de rester objective, à partir de tous les exemples que j’ai pu observer. (note : c’est bien de la 3D temps réel). Quelques explications ci-dessous, même si elle reste volontairement assez sommaire, (il y aurait trop de choses à en dire) :

Flash
Limite : La 3D dans flash 10 en natif va débloquer pas mal de choses et optimiser les rendus actuellement un peu trop lourds. Toute la question est de savoir si la visualisation d’objets sera facilement gérable. J’en suis convaincu, mais je peux me tromper…

Flash peut créer à terme un certain darwinisme de l’évolution des solutions 3D : si je peux le faire en flash, cela ne me sert à rien de le faire avec un plugin… c’est plus contraignant. Nivellement par le haut en placant la barre à un minimum technologique… pour l’instant assez bas.

Java
Temps d’installation : Si le Java est installé sur un grand nombre de postes, le démarrage du plugin prend autant de temps que d’installer et de lancer un Unity…

Notes : Sans doute la meilleur solution pour afficher des objets, même si les limites pour gérer des scènes plus complexes et multiplier les interactions existent bel et bien. Les performances chutent ’souvent’ lors de la gestion de scènes plus complexes. Et mine de rien, ce n’est pas tout à fait de la 3D sans plugin, quoi qu’on en dise ^ Les exemples d’univers virtuels en Java sont plutôt hors navigateur…

Virtools, Unity et plugins autres
Installation : les deux premiers cités ont un temps et une facilité d’installation vraiment performante. Mais totalement absent des postes chez les utilisateurs.

Notes : Outils trop puissants pour juste de l’affichage d’objets, ils font beaucoup plus que cela. Ces plugins permettent de gérer des scènes similaires à des jeux vidéos, ou bien certains sont dédiés à des environnements 3D comme du travail collaboratif par exemple…

Shockwave
Une installation qui fait encore peur mais bien reconnu et installé sur de nombreuses machines. Le roi historique des jeux en 3D, alors qu’Adobe a tendance à le laisser un peu de côté…

Et le Vrml ou x3D alors ?
Je ne l’ai pas inclus… mon avis porte à croire que c’est un usage qui restera minoritaire encore longtemps, même si les outils étaient intéressants à une époque, voire même gratuits. Ils ont raté le virage du ’standard’ il y a bien longtemps.

Rien ne vous convient ?
Il reste encore la vidéo interactive, qui reste à l’heure actuelle et pour certains usages un magnifique outil.

D’accord / pas d’accord, la discussion reste ouverte, bien sûr…

6 months of 3D in flash in 10 minutes from crazy snake on Vimeo.

En préparant conférences, démos et salon en ce moment, j’ai compilé en vidéo 6 mois de sorties de sites utilisant la 3D dans flash. Là où les sites utilisant un plugin pour afficher de la 3D sortent au compte-goutte, j’ai du faire un tri dans près de 140 urls pour me limiter à 10 minutes dans ceux conçus en flash. Papervision, away3D ou autre, quelle que soit la technique utilisée, c’est le résultat qui importe vraiment. Une sélection donc qui présage de bonnes choses avec flash 10, lorsque l’on voit tout ce qui a pu être réalisé en 6 mois. (sauf un seul exemple antérieur a priori.)

La liste des urls que j’avais faite est disponible en cliquant sur ‘lire la suite’

La vidéo est aussi téléchargeable en mp4. (139Mo – clic droit enregistrer sous)

Tip : pas de musique, je vous laisse lancer un deezer ou votre musique favorite par dessus pour y mettre ce que vous voulez. Certaines vidéos saccadent un peu, la capture n’est pas facile lorsque les sites utilisent encore beaucoup de ressources processeur.

Lire la suite

Je parlais du moteur de rendu Unity dernièrement. C’est un moteur à la qualité de rendu saisissant qui permet de développer des applications aussi bien sur le web, que sur le bureau. Il a le vent en poupe puisque Unity pourra porter des applications 3D sur Iphone.

Rajout : dernier jeu en date, une course endiablée de voiture sur shockwave. Un jeu que l’on pourrait désormais retrouver porté sur Iphone. Top.

En parlant de 3D sur le web, je répare une grande injustice en listant ici les différents moteurs 3D en flash que j’ai pu croiser, puisque je parle souvent de Papervision et peu des autres. Tous n’en sont pas au même stade de développement bien sur et le code source des deux derniers n’est pas disponible pour l’instant. Ces librairies sont bien sûr sans compter flash 10 qui nous réserve des surprises en terme de rendu et d’accélération matérielle (on l’espère tous!), poussé par la qualité de rendu d’un Silverlight qui va de plus en plus monter en puissance.

Papervision3D : on ne le présente plus.^

Away3D : autre librairie 3D.

Sandy : la librairie 3D francaise qui a de bon atouts dans sa manche.

Flash MX 2004 3D Engine

FFilmation : Moteur de 3D isométrique ciblant plus les jeux. Sans doute la meilleure solution pour ce type d’application.

Rajout : Five3D pour la 3D en vectoriel

Rajout : We3D, peu de docs et peu d’infos mais il existe et marche bel et bien !

Alternativagame : plateforme de développement ambitieuse de 3D isométrique. Pour les jeux également.

Zenbullets isometric : 3D isométrique, embryon de moteur en développement.

J’en ai oublié ?

Trois exemples forts intéressants ces deux derniers jours que je mettrais en rapport les uns les autres :

Avatar Reality commence à présenter son univers virtuel qui doit sortir vers le milieu d’année en beta : il se nomme Blue Mars et quelqlues captures d’écran sont disponibles. Blue Mars n’aura ni monstres à tuer ni casinos mais plusieurs activités comme cette capture de golf sur le net. La cible : le casual gamer. L’univers utilise le moteur cryengine2 qui est en quelque sorte la RollsRoyce du moteur3D pour les jeux, aux côtés du moteur d’Unreal. Le contenu de cet univers sera ouvert aux développeurs de jeu ou à des professionnels qui seront en contrat avec le studio. Rien en leur empêchera de contacter des annonceurs pour créer du contenu dans cet univers. Ils visent 1 millions d’utilisateurs en 2010.

TheMall.Tv est une sorte de gigantesque centre commercial virtuel où les marques pourront exposer leurs produits numériquement pour y faire leurs achats. Ils n’attendent pas moins de 40 millions d’utilisateurs à terme répartis dans 20 centres commerciaux virtuels en 17 langues. Sortie été 2008 aussi.

Cafe.com est univers virtuel où l’on peut jouer à toutes sortes de casual games : (Via JacquesFroissant)

Projetons-nous un peu dans l’avenir

Réseau sociaux, advergames, mondes virtuels, e-commerce… et si le prochain web n’était pas si lointain que cela ? Il y a une convergence vers l’environnement virtuel de plusieurs domaines : on vise des univers de plus en plus beaux, des typologies de public de plus en plus large, avec un business-model qui semble déjà bien sûr de lui, et des activités qui dépassent complètement les lignes directrices du jeu vidéo traditionnel.

Des univers virtuels pour tout type de public à l’accès gratuit vont permettre de faire du shopping, du vrai shopping, à grande échelle. Chaque avatar pourra disposer de son propre appartement virtuel et inviter ses amis pour dialoguer, échanger, se rencontrer. Les activités disponibles pour se distraire seront développées dans le jeu et financées par des annonceurs. On peut supposer que le futur de l’advergaming tel qu’on le connait aujourd’hui est justement le développement d’activités mises en place gratuitement dans un univers virtuel, en échange d’un logo, de la même manière que de grandes marques sponsorisent des événements sportifs dans la réalité (pensez à l’athlétisme, au football, aux régates en bateaux…), mais tout cela, mélangé dans le même univers ! (ou passant de l’un à l’autre de manière la plus transparente possible). Cela peut créer une cohérence forte en se calant sur les diverses activités quotidiennes : entre le travail, le loisir, l’achat en ligne, voir des amis, aménager sa maison… Allons-nous arriver à un monde parallèle virtuel/réel non plus seulement géographique comme un meet-me mais aussi basé sur l’existence de l’internaute ?

Quelques liens :
Blue Mars :
http://starbulletin.com/2007/11/23/business/story01.html
http://gigaom.com/2008/02/19/blue-mars-second-life-with-pro-level-content/
TheMall.tv
http://www.atelier.fr/e-mar…l-organise-commerce-internet-36067-.html