Je me permets rarement de critiquer mais là, c’est le type même de site que l’on voudrait ne plus voir. J’ai un ami - néophyte en flash et site web quoiqu’un peu geek sur les bords - qui m’en parlait récemment, “site horrible en flash, même pas de retour en arrière, pas pratique… blablabla”. Je suis allé voir quand même, quelque peu curieux. Et bien oui ! C’est un site qui imite totalement les codes et les constructions d’un site en html, et le flash n’a strictement aucune valeur ajoutée ici. Il trouble plus l’utilisateur que ne lui rends service, ou l’immerge dans l’univers. Pire, cela énerve, ce qui n’est pas spécialement à proprement parler le but ultime d’un site internet, et je n’ai eu qu’une envie, c’est d’y trouver mon information pour en repartir aussi sec. Mais comment peut-on encore en 2008 faire de telles erreurs de conception ?

0/20 donc, et plus je navigue dedans, plus je lui décernerais bien le bonnet d’âne du mois…

- Un super résumé du FOWD à Londres sur l’évolution du webdesign chez splitdadiz.

- Où l’on reparle de Papervision et de Away3D au FlexShow : très bonne émission pour ceux qui comprennent bien l’anglais et s’intéressent à ces librairies 3D. Qu’est ce que l’on peut faire avec, quelles sont les différences entre les deux librairies, quelles sont les points à garder en tête avant de faire un projet, l’usabilité d’une interface en 3D (à 11 minutes) “i would make sure the 3D is absolutely necessary… and usable” avant le côté cool de l’application, et “how can people try to do with this 3D object ?”, ne pas créer des interactions totalement inutilisables et incompréhensibles, pour finir sur les limites techniques du player flash. Applications retenues ? les jeux qui rappellent une certaine ère lointaine de jeux vidéo, et des objets 3D qui existent déjà en 3D comme un globe qui fonctionnent bien en général car les gens sont habitués à les manipuler et les concevoir en 3D.

- Wixi, un nouvel outil pour créer des sites en flash chez Techcrunch

- Image 3D wall component.

- Une calculette pour le bitrate des vidéos. Pratique pour optimiser ses encodage en flv.

- MooFlair : A desktop application that helps you to manage and watch both online and offline FLVs videos. Un genre de Adobe Media Player en somme.

- Des nouvelles de Moonlight, le côté open source du Silverlight.

Vous ramiez un peu avec l’AS3 et Flash 9 ? Voici un superbe ouvrage réalisé après des mois d’efforts par Thibault Imbert, sur le flash et la pratique de l’actionscript 3. Inititalement prévu d’être publié chez O’Reilley, c’est 1093 pages qui sont finalement disponibles sous licence Creative Commons, téléchargeable directement sur internet. Il a trouvé finalement un éditeur puisque la version papier sera disponible prochainement : 1093 pages à lire en PDF, euh… j’achèterais donc aussi la version papier.

Le mini site ouvert pour le livre ainsi que l’ouvrage sont consultables à cette adresse : http://pratiqueactionscript3.bytearray.org.

Le son dans flash s’est limité à ses débuts à des ambiances de musique-au-mètre de 10 secondes sur fond de techno et de sons si basiques / cliquants / forts que très vite, il a perdu de son potentiel, catalogué comme perturbant par les utilisateurs. Ajoutons à cela qu’un site web étant essentiellement visuel, à sa création, le son est considéré comme superflu, et coûteux. Et pourtant…

Sur le web, des détails techniques à prendre en compte
Un gros fossé entre le bureau et le chez soi :
- au bureau : bien des ordinateurs n’ont pas d’enceintes, ou ont le son coupé parce que l’open space ne permet pas une liberté sonore totale.
- à la maison : bien des utilisateurs ont leur ordinateur branché sur leur chaine et enceintes 5.1. Ecouter le vrombrissement d’un gros moteur de voiture sur un site marketing, c’est toujours attrayant. (Enfin, il parait que les “automobilophiles” en sont friands).

En définitive, le son peut être découpé en 3 domaines pour lesquels je prendrais des exemples récents qui m’ont marqués :
- la voix : la voix pour inciter à agir / La voix renforce une ambiance, et elle appuye un discours
- la musique : le renforcement / la rupture et le contraste / C’est la musique qui commande / L’appropriation d’une musique connue par une marque en campagne cross-media
- les bruitages et effets d’ambiance : Renforcer le réalisme des éléments graphiques / Le mode non synchronisé pour illustrer sans visuel.

La voix.
Quelques sites :
La voix pour inciter à agir

Un personnage incrusté dans un décor parle à l’internaute. Pas d’autre indication que le son, pas de sous-titre. Une relation directe qui attend une action de la part de l’utilisateur, et qui, comme dans une relation réelle, interpelle.

La voix renforce une ambiance, et elle appuye un discours.

Un exemple que je continue de trouver très fort. Ecoutez 10 minutes d’un témoignage de 6 Milliards d’Autres, du projet de Yann Arthus-Bertrand : écoutez la voix des interviewés, son timbre, sa force, ses hésitations, ses silences, ses tremblements… ses accents. Elle donne une force aux témoignages. Il y a dans la voix humaine une telle richesse dans les tonalités que je m’étonne qu’elle ne soit pas plus utilisée. (Le regard, les mouvements des lèvres, les thèmes évoqués et le cadrage dans cet exemple jouent également un rôle extrêmement important).

Testez avec ce site Japonais de AXE et écoutez simplement sans comprendre ce qui se dit : le timbre de la voix renforce cette impression de mystère que donne le visuel. Soulignons qu’il s’agit seulement d’un préchargement.

La musique.

Le renforcement

Un joli cochon rose, et peu d’illustrations, avec une charte quasi inexistante. La musique en pseudo-MIDI tirée des vieux ordinateurs donne toute la dimension décalée au site. (Même si en boucle, cela assomme vite)

La rupture et le contraste

Site magnifique pour le jeu vidéo Halo3 sur xbox, d’une scène de bataille, accompagné aussi surprenant soit-il, par une musique au piano, très grave, (qui ressemble à un Eric Sati ou un Chopin). Les FPS sont plutôt destinés à un public jeune et l’on pouvait s’attendre une approche plus techno/electro ou rock/metal tonitruant. Qu’est-ce qui fascine d’abord ? la scène ou la musique ?

C’est la musique qui commande

Neon Bible est le single d’un nouvel album d’Arcade Fire. C’est la musique la star : elle n’illustre plus, elle scénarise toute l’animation. L’animation, la vidéo, la mise en scène suivent la musique.

L’appropriation d’une musique connue par une marque en campagne cross-media
A l’heure des campagnes cross-media où l’on retrouve les mêmes visuels/animations au cinéma, à la télé, sur mobile et dans les sites interactifs, le son est à ne pas oublier. La musique peut être un code de reconnaissance d’une marque. Qui n’a pas chanté des spots publicitaires connus, dont la musique a été créé spécialement pour cela ? Je pense au Tchiwawa (orthographe approximatif) de Coca-Cola, qui a très bien su en jouer. Autre cas de figure, les rocks anglais utilisés par les constructeurs automobiles il y a quelques années (vous vous souvenez de l’utilisation d’une chanson de Dire Straits pour une pub Renault ou Peugeot (j’ai oublié) ?). Je m’écarte un peu du web mais la mise en relation avec les outils de communication autre que le web est toute aussi importante.

Les bruits et effets d’ambiance.
Renforcer le réalisme des éléments graphiques.

Regardez ce site de Nike d’abord sans le son. En fonction de la configuration, l’animation peut paraitre pauvre, et saccadée. Regardez l’animation des panneaux avec du son : l’animation prend de la profondeur, les panneaux se matérialisent en portes lourdes de métal, avec une résonnance qui illustre une scène de hangar mal isolé. (La qualité du son n’est pas forcément bonne mais c’est dans l’idée). Un bouton auquel on ajoute un bruitage bien particulier va ou appuyer l’aspect graphique et y ajouter du relief, ou bien lui donner une autre dimension qui va compléter son aspect seulement visuel.

Le mode non synchronisé pour illustrer sans visuel.
Je manque d’exemples : on peut avoir aussi en fond sonore des effets que l’on ne voit pas en lien direct avec la scène. C’est une scénarisation utilisée souvent dans des Tex Avery (au hasard). Je pense par exemple à un personnage qui se casse la figure hors champ, avec des bruits de casseroles, des poulets qui hurlent, et toutes sortes d’objets qui tombent et qui se cassent. Une manière habile de ne pas illustrer ou animer une scène graphiquement, ce qui demande du travail. Dans ce cas, le son est source d’économies et peut produire un meilleur effet que s’il avait été illustré.

p.s : Personnellement peu habile avec le son (j’ai fait du 3Ds, du toshop, du premiere, du flash mais le son… rien) même si je l’ai déjà utilisé dans des projets, ce billet est dédicacé à mon super stagiaire qui m’a posé la question aujourd’hui, qui avait besoin de quelques pistes pour un boulot qu’il doit rendre. J’espère que ca l’aidera. J’ai manqué de temps (fait à la volée, j’avoue) pour envisager tous les cas de figures mais si vous pensez qu’il manque des exemples marquants ou que vous voulez ajouter quelques éléments, n’hésitez pas ! aidez le !

p.s 2 : attention, je n’ai traité que les sites en flash ! Je n’ai pas parlé des horribles pages myspace avec une musique qui démarre à l’ouverture…

Evolution du Jukebox3D, Galaxy : une application en Flex, fortement intéressante présentée au WIF (avec cette version sortie spécialement pour le WIF). Voir le billet d’ouverture de Galaxy sur le blog de Tkaap et l’article sur l’atelier qui en parlent. Galaxy est en démo à cette adresse. C’est une interface de visualisation donc permettant de lire rapidement des vidéos provenant à terme de Youtube, Dailymotion, et des images de Flickr - et pourquoi pas - de la musique. Un gros boulot d’optimisation pour une consultation et une navigation rapides.

Remarque : je ne vais jamais sur Youtube ou Dailymotion à vrai dire, mais j’ai pris un malin plaisir à en regarder avec cet outil pour une raison : la consultation est rapide, et l’on peut faire deux choses en même temps, choisir celle que l’on va consulter tout en regardant celle qui se joue. Great Job ! on attends la version suivante.

Avec une supeeeeer interview autour de Galaxy, de l’outil, des évolutions, du travail sur l’ergonomie, la conception de l’outil etc…

De l’actu intéressante en ce moment !

- 101 Ressources pour Adobe AIR . Wow…

- Les résultats du FITC. Allez voir la liste des gagnants, si vous ne les connaissez pas déjà !

- 3D + RIA : where does it fit ? : un bon résumé et mises en perspective de la suite.

- Un lecteur vidéo très très bien construit, chez Techcrunch, ce qui complète mon dossier sur les lecteurs vidéos, qui à mon avis est destiné très rapidement à devenir caduque. Fonctions originales : zoom, chapitres, texte de description… il vaut vraiment le coup d’oeil.

- http://www.koyotesoft.com/ un importeur de flv en local à partir d’un grand nombre de sites de vidéo. Pratique. (merci simon!)

Sugarrhyme.com est un portfolio d’illustration dont la navigation ressemble assez à un bandit manchot / un système de réglette mécanique : cliquez sur un bout d’image pour voir se composer l’illustration. Une manière ultra simple d’afficher des images de manière interactive. Et ca marche !

Petit résumé personnel du WIF, je n’ai malheureusement pas pu suivre toutes les conférences, certaines m’intéressaient bigrement ! Et ce n’est pas un résumé exhaustif non plus

Lire la suite

S’il y a un bien une chose que je défend dans la création de sites en flash et qui passe souvent pour de la décoration facultative, c’est de surtout ne pas endormir l’internaute avec une barre de chargement interminable (5 secondes, c’est long). Il y a bien sûr l’architecture d’un flash. Mais un preloader un peu recherché (voire invisible pour se faire le plus discret possible) permet de le distraire pendant que le reste du site charge, et de lui faire découvrir l’ambiance du site même avant qu’il ne démarre. Texte informatif, animation simple ou originale, tout est bon pour garder l’attention : toutefois, les plus complexes ne sont pas forcément les meilleurs. Le preloader reste une étape délicate où l’internaute peut décrocher à tout moment.

Je vous invite à consulter sur smashingmagazine un récap de quelques loaders inventifs, publié il y a quelques temps déjà.

Ainsi qu’un petit preloader amusant en jeu sur getoutandplay. Classique.

Voici un billet assez simple qui résume pas mal de choses du moment : killer applications of the 3D web.

Pour résumer, peu de gens croient vraiment à l’achat en ligne avec un avatar dans les prochains mois (alors que quelques initiatives sont en cours), mais plus dans le très juteux marché des accessoires et objets virtuels (on l’a vu dans Second Life par exemple, les tenues virtuelles peuvent coûter très cher pour du virtuel). Pourquoi les objets virtuels ? c’est la pièce commune entre les jeux en ligne, les mondes virtuels, et les réseaux sociaux.

Rappellons qu’entre autre un Scenecaster ou un Vivaty tentent de s’intégrer complètement dans les réseaux sociaux comme facebook (voire sites webs ou blog) pour créer sa propre scène virtuelle, son chez soi personnalisé, multi-utilisateur. On a aussi ExitReality dans un genre un peu similaire. Ou en Asie, une levée de fond de 15 millions de dollars pour la création d’une plateforme de réseau social en 3D et de jeux. Alors 3D dans le réseau social ou réseau social en 3D ?

Ce n’est peut être pas une prévision dans 5 ans, mais dans 5 mois… en attendant de pouvoir faire passer un chapeau virtuel d’un monde à l’autre !

Il manque toutefois le Casual Game, mais pour avoir une vue encore plus globale de ce qui se passe actuellement dans les univers virtuels, je vous conseille les derniers posts de Fred Cavazza sur Virtual Paris.

(Un jour, je ferais un second billet sur le web3D, faisant suite au premier réalisé il y a quelques temps déjà.)

Le 7ème web Flash Festival 2008 aura lieu sur Paris du vendredi 23 Mai au soir au 25 mai, présidé par Andre Michelle et Quasimondo eux-même ! Des conférence sur l’état de l’art technologique et graphique, (le futur de flash par exemple), ainsi qu’un peu de compétition, du net art, de la réalité augmentée, une conférence d’Etienne Mineur sur l’histoire du jeu vidéo, des installations, des films d’animations, des performances…  un programme chargé !

Hop, c’est noté dans mes tablettes !

Je lis depuis hier quelques notes sur le FITC de Toronto à propos de Diesel, le nouveau Flash CS4 qui tournera sous Flash 10, Astro. “Flash in 3D seems like the future in the industry” dit Maurizio sur le blog FITC. Il y a en effet une véritable vague et effervescence autour des librairies 3D depuis quelques mois, et tout le monde attend avec impatience les nouvelles capacités rendu de ce player :

“The player also calculates 64 times faster then the flash 9 player. So the possibility of processing bigger packages/files is going to be quick.”

Si Flash 9 a enfin permis la gestion de scènes en 3D avec la nouvelle machine virtuelle et l’AS3, 64 fois plus puissant avec un max affiché de 99 frames/seconde, ca s’annonce bien. Rien d’annoncé sur la prise en charge ou non de l’accélération matérielle. (64 fois plus puissant, c’est déjà pas mal mais est-ce suffisant pour ce que nous réserve l’avenir ?). Loin des effets d’annonce et du statut de ‘groupie’ sur le flash, on attendra un peu pour savoir ce qu’il en est…