mardi 15 octobre 2013

Google Webdesigner : HTML5 et 3D

Google se lance dans l'animation HTML5 en proposant un tout nouveau logiciel simple, puissant, compatible et GRATUIT. Son nom : Google Webdesigner. Une petite révolution qui vise directement Edge Animate. Webdesigner rivalise-t-il vraiment ?

Webdesigner offre d'abord une solution gratuite et très facile à prendre en main, avec trois approches : simple, avancée et codeur. L'option simple offre une interface reposant sur le principe de diapos, façon MotionComposer ou PowerPoint. L'option avancée propose un scénario fonctionnant à partir d'images-clés (F6), façon Edge Animate ou Flash Pro. L'approche code permet de modifier dynamiquement les valeurs et les propriétés des objets, façon Firedebug ou Dreamweaver.


Côté fonctionnalités, on peut jouer sur des propriétés CSS et le tout est exporté tantôt en Javascript/CSS3, tantôt en Javascript/Canvas/WebGL. C'est donc un mix entre Edge Animate et Flash Pro. Les animations 3D fonctionnent très bien et rivalisent avec l'extension Greensock pour Edge Animate. Une pure merveille !

Des événements et des actions peuvent également être associés aux objets animés sans taper le moindre code. La plupart des événements sont adaptés pour du mobile (orientation, agitation de la tablette ou du smartphone).

Des modèles de bannières sont proposés et sonnent le glas du format Flash SWF jusqu'ici le seul en mesure de tenir les promesses que ne pouvaient louer le HTML5, pour ce type de création (rapport poids / qualité des animations).

Le must, ce sont les composants 3D prêts à l'emploi que l'on attendait depuis des lustres dans Flash Pro et qui n'ont jamais vu le jour. Par exemple, vous pouvez créer à la volée des galeries d'images de type CoverFlow avec organisation spatiale des images en 3D.


Le logiciel est actuellement en version bêta et n'est donc pas encore finalisé. Certains bogues limitent en effet l'utilisation de quelques fonctions sous Windows, Internet Explorer et Opéra. Les composants 3D ne répondent pas du premier coup. Et surtout, les composants ne sont disponibles que pour les bannières ! Ce qui en réduit considérablement l'intérêt. Gageons que la version finale sera réellement à la hauteur de Edge Animate et autorisera l'interactivité tout contexte confondu. Des actions personnalisées peuvent cela dit être associées à des images et des objets textes dans la page HTML. Libre à vous ensuite de personnaliser les liens. Reste enfin qu'une page Web demeure une page Web. Pour tester vos animations, même sous la forme de bannières bridées, effectuez un Cmd+Entrée (Mac) ou Ctrl+Entrée (Win). Puis, affichez le code ; )

On peut donc conclure sur l'idée que Google Webdesigner n'est pas tout-à-fait prêt, mais qu'il va certainement devenir un outil incontournable pour tous les graphistes en charge de la réalisation de pages Web répondant au standard HTML5. Gare au codage généré, un peu verbeux. Un outil à surveiller de près.

Pour en savoir plus sur ce nouveau logiciel, lisez les pages de présentation de Google à l'adresse suivante, lien de téléchargement inclus :

https://support.google.com/webdesigner/

3 commentaires:

  1. Je viens de l'essayer .Une ressemblance évidente avec Edge d'Adobe.
    Au cas où voici mes écrits:
    http://croquemitaine-nuitamment.blogspot.fr/2014/08/google-webdesigner.html

    D'ailleurs je suis toujours à la recherche du code pour injecter l'anim sur une page blogspot.Preuve que j'ai du chemin à faire!

    RépondreSupprimer
  2. Oui mais depuis gdrive j'obtiens simplement l'affichage du code.Il faut creuser.

    RépondreSupprimer