Avec Google, Microsoft, Facebook, Amazon et évidemment Apple en partisans affichés, tout indique qu’HTML5 va jouer à l’avenir un rôle prépondérant pour le web (thanks, Captain Obvious). Même si son impact sur le secteur du jeu vidéo dépendra de ses performances et surtout de la minimisation des problèmes de compatibilité entre navigateurs, certains titres démontrent déjà les capacités ludiques d’HTML5, comme Warimals, BioLab Disaster ou Pirates Love Daisies.
La promesse d’HTML5 est à la fois très simple et très ambitieuse : permettre la création d’applications en ligne réellement universelles, compatibles aussi bien avec un iPhone qu’une tablette Android, un netbook Linux ou un PC Windows. En pratique, les choses s’avèrent complexes à mettre en œuvre, mais on peut espérer des progrès à mesure que la technologie gagnera en maturité. À terme je pense que Flash sera privilégié pour les jeux plus complexes, en 3D notamment, et HTML5 pour les titres visuellement plus simples mais qui pourront toucher un public plus large.
En matière de création graphique, même si la suprématie actuelle de Flash pour le contenu « riche » sur le web sera de plus en plus contestée, la flexibilité et l’étendue des ses outils d’animation ne sera pas facile à remplacer. En attendant un hypothétique export de Flash vers HTML5, quels outils sont disponibles aujourd’hui pour réaliser des animations HTML5 ? Je n’ai pris en compte que les logiciels au concept proche de celui de Flash (keyframes placées sur une timebar, avec interpolation pour les frames intermédiaires). Voici une liste non exhaustive de l’offre proposée aujourd’hui sur le marché :
- Adobe Edge (Mac/Windows, preview gratuite) : Adobe a été long à réagir, probablement tiraillé entre la crainte de faire du tort à Flash et celle de rater le coche de l’HTML5. Edge est néanmoins en train d’être finalisé (la preview 3 est sortie en septembre) et devrait être le pendant HTML5 de Flash.
Adobe Edge
- Sencha Animator (Mac/Windows, 140 €) : Sencha est une société dédiée aux applications web et elle propose une solution pour l’animation HTML5 et au delà, la création d’applications complètes.
Sencha Animator
- Purple (Mac, 16 €) : La petite société allemande Purple propose un logiciel qui semble intuitif et doté de bonnes idées comme l’import natif d’images au format PSD.
Purple (source image : purpleanimator.com)
- Hype (Mac, 21 €) : Hype fut l’un des premiers entrants sur le marché, et il paraît logiquement être l’un des plus aboutis à l’heure actuelle.
Hype (source image : tumultco.com)
- Radi (Mac, bêta gratuite) : En plus de l’aspect animation, Radi se présente également comme une solution complète pour la création de graphisme vectoriel.
Radi (source image : radiapp.com)
A voir aussi :
- Quels logiciels pour l’animation HTML5 ? (2)
- Quels logiciels pour l’animation HTML5 ? (3)
- L’animation HTML5 avec Flash Professional
16 Couleurs 
11 septembre 2012 à 23:36
M’intéressant au sujet de près, j’ai apprécié le contenu de cet article. Je me permets une petite suggestion pour alimenter l’article datant d’octobre 2011 : il existe un nouvel outil que je viens de tester en version bêta, qui s’appelle A5 HTML5 Animator : http://www.a5-animator.com/. On peut le tester gratuitement. En attendant les prochaines nouveautés et de nouvelles évolutions dans le domaine…
13 septembre 2012 à 23:15
Merci pour cette information ! Je ne connaissais pas A5 HTML5 Animator et ça paraît intéressant. Je vais l’essayer et je pense que j’aurai l’occasion d’en parler dans un prochain article à propos des nouveautés dans le domaine de l’HTML5.
19 septembre 2012 à 18:57
Une pierre de plus à l’édifice : moi j’ai testé Motion Composer, qui est très simple à utiliser et permet d’exporter en HTML5 et en Flash
http://www.aquafadas.com/fr/motioncomposer/
24 septembre 2012 à 22:55
Merci pour l’information, je vais aussi regarder en quoi consiste MotionComposer.
Vous pourriez être plus transparente avec le fait que vous travaillez pour Aquafadas, personnellement ca ne me choque pas que vous cherchiez à faire connaître votre produit, surtout s’il est bon.
15 décembre 2012 à 19:20
et s’il fallait en choisir un, lequel adopteriez-vous ?
J’ajoute que dans une certaine mesure, Keynote d’Apple est aussi capable de générer des animations pour un site web sans Flash.
17 décembre 2012 à 21:38
Je suis en train de tester la dernière vague de logiciels d’animation HTML5 qui n’étaient pas disponibles lors de la rédaction de ce billet et pour l’instant je dirais qu’Adobe Edge Animate (qui a bien évolué en un an) et le nouveau A5 HTML5 Animator semblent être les solutions les plus professionnelles pour un usage dédié à l’animation.
Je ne connais pas vraiment Keynote, mais je pense qu’il joue dans une autre catégorie, puisque le concept de diapos (à l’opposé des logiciels qui utilisent le concept de timeline, comme Flash) ne permet pas un contrôle très poussé en matière d’animation.
Pingback: Quels logiciels pour l’animation HTML5 ? (2) « 16 Couleurs
Pingback: L’animation HTML5 avec Flash Professional | 16 Couleurs
24 mars 2013 à 18:15
Il manque aparament aussi le célébre logiciel e-anim qui sort maintenant ces animation aussi bien en swf ou format html5 avec de nombreuse possibilité , comme pouvoir héberger directement son animation en 1 clique , possibilité de créé des barres d’outils ……….
enfin bon je vous le conseil vraiment , la version payante et à 10 euros pour 1 ans comprenant l’hébergement et les mise à jours gratuite.
http://www.e-anim.com/
24 mars 2013 à 20:32
Merci pour le renseignement. E-anim a l’air intéressant en effet, je vais faire en sorte de l’essayer dès que possible.
Pingback: Quels logiciels pour l’animation HTML5 ? (3) | 16 Couleurs
Pingback: De l'intérêt des transitions pour concentrer l'attention « InterfacesRiches.fr InterfacesRiches.fr
13 août 2013 à 08:10
bonjour mais comment installer la nouvelle version
13 août 2013 à 09:41
Bonjour ! Pour installer la nouvelle version de quel logiciel ?
13 août 2013 à 09:42
Oui E anim a l’air intéressant mais compliqué pour l’installation
13 août 2013 à 09:43
je parlais de la version E anim que Globe avait posté
13 août 2013 à 10:00
Je pense que la dernière version d’E-anim disponible peut-être téléchargée sur http://www.e-anim.com/index_e_anim.html
Pingback: lire De l’intérêt des transitions pour concentrer l’attention | itlaia
Pingback: L’animation HTML5/WebGL avec Flash Professional CC 2014 – la méthode officielle ! | 16 Couleurs
2 novembre 2016 à 11:42
et aussi, pour compléter cette liste : http://www.loxiastudio.com, plein de modèles prêts à l’emploi, pas besoin de connaître html/css, et gratuit
2 novembre 2016 à 15:35
Merci pour cette nouvelle suggestion !