Forums Développement Multimédia

Aller au contenu

passage à HTML5... ai-je vendu mon ame ?...

flash edge html5 animation DETENTE

20 réponses à ce sujet

#1 Henri_B

    Ceinture Noire

  • Members
  • PipPipPipPipPipPipPip
  • 337 messages

Posté 06 March 2013 - 19:20 PM

Bon, à contre coeur je viens de commencer à refaire les animations du bandeau de mon blog (www.HenriBlum.com) en HTML5 alors qu'elles étaient en Flash... il faut suivre le mouvement, parait-il... J'ai quand même un peu honte de laisser tomber Flash pour ça...

N'empèche que même avec Edge c'est assez galère. Je génère des spritesheet à partir de l'animation Flash (ce qui marche assez mal au passage) et j'intègre tout ça via Edge... ça rame pas mal chez moi (mon PC est vieux) et c'est incroyablement pénible à faire comparé à Flash... et beaucoup plus long. Si désormais toutes les animations pour le web doivent être faites avec ce logiciel, je vais investir dans des actions Doliprane...

ps : si ça ne marche pas chez vous (manquerait plus que ça...), merci de me le signaler

#2 boichu

    Administrator

  • Administrateur
  • PipPipPipPipPipPipPipPip
  • 5009 messages

Posté 06 March 2013 - 23:36 PM

Chez moi ca fonctionne très bien, félicitations !
Mac + safari, tout à jour.

#3 Monz

  • Moderateur
  • PipPipPipPipPipPipPipPip
  • 3541 messages

Posté 07 March 2013 - 09:04 AM

Bonjour,

Très sympa ton blog. Le bandeau foncitonne bien chez moi aussi. Opera 12.1, win7.

Pour ce qui est de ton âme, tu manges déjà des hamburger, donc elle ne risque plus rien, tu l'as déjà vendu aux affreux impérialocapitalistes...

Pour ce qui est de flash, moi, depuis le temps que j'en fait, je n'ai jamais fait un seul bandeau avec. Alors tu vois...

#4 Henri_B

    Ceinture Noire

  • Members
  • PipPipPipPipPipPipPip
  • 337 messages

Posté 07 March 2013 - 10:08 AM

merci a vous deux.
ce qui me chagrine le plus c'est de passer d'une technologie à une autre qui est moins pratique, moins rapide, moins puissante, ... depuis le temps que je fais de l'informatique, c'est la première fois que j'avance à reculons...

et puis edge, pffffff, pas un plaisir ce logiciel... mais les autres pour faire du html5 ça a l'air pareil...

bon, je vous rassure je continue a faire du flash pour la programmation (air compris) et des anims destinées à la video...

mais là, enlever le flash de mon propre chef sur mon propre blog, ça fout un coup... :-)

#5 Monz

  • Moderateur
  • PipPipPipPipPipPipPipPip
  • 3541 messages

Posté 07 March 2013 - 10:17 AM

Je comprends.

Ce qu'il faut voir aussi, c'est que le HTML5 n'est pas orienté IDE graphique comme l'était flash au départ. C'est un standard pour des développeurs web. Et tous ceux que je connais développent avec un textMate. Ils ont l'habitude de faire sans logiciel de type Edge. Mais je suis d'accord avec toi, Flash avait ouvert la porte du web à de nombreux amateurs. Ce que certaines technologies favorisent moins.

#6 Henri_B

    Ceinture Noire

  • Members
  • PipPipPipPipPipPipPip
  • 337 messages

Posté 07 March 2013 - 11:10 AM

c'est surtout que Edge est tres peu ergonomique (il faut un ecran encore plus grand qu'avec flash...) et tres buggé (bon ça changera surement)...

#7 Krevare

    Ceinture Noire

  • Moderateur
  • PipPipPipPipPipPipPipPip
  • 923 messages

Posté 07 March 2013 - 11:58 AM

Hello :)

Testé sur :
Win7
Firefox 19
Chrome Version 25.0.1364.152 m

Fonctionne nickel, bon après j'ai une grosse machine.

Bonne journée,

Fred.

#8 Monsieur Spi

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 7017 messages

Posté 07 March 2013 - 16:35 PM

Salut Henri,

Testé sur FF 19, Win 7, pas de souci non plus ça fonctionne.
Question, as-tu essayé les exports directement depuis Flash CS6 avec "Toolkit for CreateJS" ?
Pour de l'anim simple ça à l'air de marcher pas trop mal, pour des codes plus complexes c'est pas gagné.

#9 Henri_B

    Ceinture Noire

  • Members
  • PipPipPipPipPipPipPip
  • 337 messages

Posté 07 March 2013 - 16:51 PM

en fait j'ai essayé de partir de mon .fla deja fait...

- en faisant du gif animé c'etait horrible... les textes etaient illisibles, remplacés par de gros pavés noirs (quelque soit le type de texte)... et les anims laissaient des trainées derriere elles... bref impossible d'exporter correctement via flash pour cette anim...

- en exportant en html5 via createjs, le zoom que j'avais fait et qui rendait net sous .swf etait horrible (flou et baveux) en html5 (apparemment il zoom sans qu'on puisse lui dire l'algo a utiliser pour generer ses images bitmap...) et x autres problemes...
effectivement ca marche pour certaines choses, mais pas mal de limitations aussi. en tous cas pour des images en pixel art qui ne doivent pas etre redimensionnées sans "lissage" ça ne marche pas.

du coup je me suis resolu à créer des sprite sheet dans flash (à la bonne taille) et à les utiliser avec Edge. C'est encore le meilleur résultat que j'ai obtenu... mais au prix de pas mal de boulot... car apparemment rien d'automatique dans Edge pour utiliser les spritesheet ? (pas trouvé) alors il faut opérer le décalage manuellement à chaque image...

#10 Monsieur Spi

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 7017 messages

Posté 07 March 2013 - 17:01 PM

Re,

Pour les zooms je pense qu'il y a un choix à faire entre Canvas et SVG :

http://blogs.msdn.co...vas-et-svg.aspx
http://blogs.msdn.co...canvas-1-4.aspx
http://blogs.msdn.co...canvas-2-4.aspx

Ce qu'il en ressort c'est ça (a gauche SVG, a droite Canvas) :

Image attachée: test.jpg

Maintenant je ne suis pas expert en HTML5, je m'y colle tout doucement, donc je suis peut être hors des clous.

#11 Henri_B

    Ceinture Noire

  • Members
  • PipPipPipPipPipPipPip
  • 337 messages

Posté 07 March 2013 - 17:32 PM

oui mais ni edge ni createjs ne fonctionne avec les svg par défaut .. ils ne fonctionnent qu'avec des bitmaps (ils generent des bitmaps), et c'est le navigateur qui gere les zooms dessus... et pour du pixel art ça ne rend pas du tout comme il faut...

le svg animé est sans doute l'avenir (vectoriel, programmable, etc...) mais aujourd'hjuii ca ne marche pas sous IE (meme 10).

apres on peut peut etre utiliser des fichiers .svg dans edge ? mais il aurait fallu les generer (via illustrator par exmple)... moi je partais de bitmap importées dans flash... pour moi le plus simple etait de generer les images a la bonne taille et les utiliser sans zoomer dessus. cas particulier finalement.

#12 Monsieur Spi

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 7017 messages

Posté 07 March 2013 - 17:39 PM

Citation

utilisé des fichiers .svg dans edge ?

http://helpx.adobe.c...ge-animate.html

Citation

Le format SVG préserve votre contenu vectoriel à l’exportation de manière à ce qu’il puisse être redimensionné sans pixellisation dans le navigateur. A l’heure actuelle, Edge Animate gère les fichiers SVG en tant que graphiques aplatis. Ainsi, lorsque votre contenu est transféré dans Edge Animate, il ne peut plus être modifié (même si vous pouvez toujours mettre à jour et réenregistrer votre graphique à la volée dans votre programme de création graphique). Le format SVG ne doit être utilisé que lorsque vous avez besoin de mettre à l’échelle vos graphiques en raison de leur taille de fichier accrue. Il est actuellement plus sûr d’utiliser le format PNG sur le Web en raison de la présence de problèmes relatifs à la prise en charge inter-navigateurs.

Donc tu as raison, ce n'est pas du natif, c'est converti et c'est bien dommage...

Citation

mais aujourd'hjuii ca ne marche pas sous IE (meme 10).
Il existe un plugin SVG multi-platefomes, a lire : http://www.developpe...ernet-explorer/

Ca peut peut être servir.

#13 pol2095

  • Members
  • PipPipPipPipPipPipPipPip
  • 1918 messages

Posté 07 March 2013 - 18:25 PM

sur ie c'est du VML (qui est bien plus rapide que le SVG).

#14 Henri_B

    Ceinture Noire

  • Members
  • PipPipPipPipPipPipPip
  • 337 messages

Posté 07 March 2013 - 18:34 PM

oui mais bon, coller des rustines pour IE ou la version x du navigateur y, ça n'aide pas comparé au confort qu'offre flash... ça va être un truc à faire systématiquement maintenant quand on livrera une animation pour le web, vérifier les compatibilités et que tous les fichiers sont là et au bon endroit... ahhhh Flash, reviens !...

#15 tlecoz

  • Honoris
  • PipPipPipPipPipPipPipPip
  • 3486 messages

Posté 07 March 2013 - 21:38 PM

Hello Henri_B,


Citation

ce qui me chagrine le plus c'est de passer d'une technologie à une autre qui est moins pratique, moins rapide, moins puissante, ... depuis le temps que je fais de l'informatique, c'est la première fois que j'avance à reculons...

Fais comme moi : refuse d'en faire ! :D
A la place, oriente toi plutôt vers les applications Air, le compilateur C pour Flash (Flasc) , etc.... Le développement d'application en gros... On a droit à un gros boost niveau ressource si on part dans cette direction...


EDIT : A coté de ça, j'insiste, Processing pour faire du JS, c'est pas mal du tout

#16 Henri_B

    Ceinture Noire

  • Members
  • PipPipPipPipPipPipPip
  • 337 messages

Posté 19 March 2013 - 11:38 AM

je fais déjà du AIR et je me lance a fond dans le développement mobile avec, mais j'ai un doute quant à sa pérénité, même à court terme (je ne fais plus confiance à adobe...).

je ne doute pas que Processing soir très bien, mais je fais plutot des applications ou des anims 2D, pas sur que ce soit le plus adapté.

Au final c'est souvent le client qui décide... et aujourd'hui ils ne veulent "que" du html5... :-(

#17 tlecoz

  • Honoris
  • PipPipPipPipPipPipPipPip
  • 3486 messages

Posté 19 March 2013 - 15:13 PM

Citation

je ne doute pas que Processing soir très bien, mais je fais plutot des applications ou des anims 2D, pas sur que ce soit le plus adapté.

Il n'y a pas plus sourd que celui qui ne veut pas entendre... Le mieux est d'essayer :)
Il y a des libraries Processing qui simule le comportement de flash ; les performances sont vraiment bonne autant pour du dev html5 que pour du dev mobile.
Sur mobile, tu peux choisir un mode de rendu 2D ou 3D (qui correspondent plus ou moins à PixelBender2D et Stage3D, à ceci près que l'équivalent de PixelBender2D de processing tourne incroyablement vite (je ne sais pas si tu as essayé de faire tourner une anim PixelBender sur mobile, mais le FPS ne suit pas (sur un samsung GS2 en tout cas) )

En fait, la seule chose que je n'aime pas dans Processing, et c'est quand même une grosse contrainte je trouves, c'est que l'accés aux VertexShader (dans le cadre d'une utilisation 3D) est relativement limité ; seules les FragmentShader sont vraiment customisable, les VertexShader sont préformaté ce qui fait que tout n'est pas possible (pour l'instant, car Processing évolue beaucoup)

Il faudrait que je me repenche un peu sur NME car j'ai vu la semaine dernière que ça avait beaucoup progressé également, Stage3D est désormais complètement intégré ainsi que le GLSL pour coder les Shaders à la place de l'AGAL ; NME est maintenant capable d'exporter les anims 3D en webGL et une version Win8 est en cour de dev ; ça bouge pas mal chez eux :)

Mais processing, tu devrais quand même télécharger la derniere version , ca va te prendre 5 minutes, il n'y a rien a installer, tu double clic et ça marche tout de suite. Une fois lancé, tu clic sur le bouton en haut à droite "java" et tu choisis "javascript" à la place ; puis tu vas dans fichier/examples et tu regardes les centaines de vrais exemples disponible.... C'est vraiment la meilleure manière de se faire une idée en peu de temps

Bonne journée !

#18 Henri_B

    Ceinture Noire

  • Members
  • PipPipPipPipPipPipPip
  • 337 messages

Posté 20 March 2013 - 13:17 PM

encore une fois, je ne doute pas de l'interet et de la puissance du truc... mais professionnellment les clients font deja la grimace quand je leur dit que je vais faire le truc avec flash ou air, alors si je leur parle de processing (qu'a priori la majorité des clients ne connait pas), je pense me heurter a un refus catégorique. et c'est comprehensible car tous souhaitent des techno tres répandu pour lesquelles ils trouveront facilement des prestataires pour modification/maintenance. Processing, comme flash, ce n'est pas techniquement que ça pêche; mais c'est plus difficile à vendre de nos jours...
et les clients ne veulent pas de démo pour leur montrer que c'est bien etc.., ils s'en fichent.

#19 Goabonga

  • Moderateur
  • PipPipPipPipPipPipPipPip
  • 2724 messages

Posté 20 March 2013 - 13:32 PM

Ton client tu lui dis que tu code dans notepad++ ?
Pourquoi devrais tu te justifier d'utiliser tel ou tel outil ?

#20 Henri_B

    Ceinture Noire

  • Members
  • PipPipPipPipPipPipPip
  • 337 messages

Posté 20 March 2013 - 17:10 PM

parceque les clients demandent en general les sources (ce qui est comprehensible) donc de toutes facons ils savent en quoi c'est fait. et que de plus en plus oui ils choisissent/imposent la techno à utiliser. c'est comme ça.

#21 Goabonga

  • Moderateur
  • PipPipPipPipPipPipPipPip
  • 2724 messages

Posté 20 March 2013 - 17:53 PM

je ne comprend pas mais je comprend mieux

Citation

Il n'y a pas plus sourd que celui qui ne veut pas entendre... Le mieux est d'essayer




1 utilisateur(s) li(sen)t ce sujet

0 membre(s), 1 invité(s), 0 utilisateur(s) anonyme(s)