Faire des animations flash !

------->>> Le programme
Eh bien, pour commencer, il faut installer Adobe Creative Suite CS5.5 Master Collection disponible ici même ! La version est dans le "CS". Donc si ce tutoriel devient vieux, il se peut que le programme passe en CS6 ou CS7... mais le hic, c'est que le second programme pour pirater ça ne marchera plus !

Donc, vous arriverez sur le site d'Adobe, où vous pourrez télécharger la version d'évaluation de 30 jours de 80% des programmes d'Adobe ! (Photoshop est compris dedans, et pleins d'autres, comme ça, vous avez tout d'un coup !) Si vous ne voulez QUE le programme qu'on va utiliser (car vous en avez déjà d'autres dans le pack par exemple), alors prenez Adobe Flash Professional.
Cliquez sur le bouton Télécharger maintenant, et je vous laisse chercher Adobe Creative Suite CS5.5 Master Collection dans l'application ! Le téléchargement peut durer plusieurs heures, lancez ça pendant que vous dormez, c'est mieux :3



------->>> Le keygen
Un Keygen, c'est un générateur de clé d'activation. Ce qui est bien en téléchargeant la Master Collection, c'est que vous n'aurez besoin que d'un keygen pour tout les programmes ! Toutefois, les keygens programmés pour UNE version (CS5 par exemple) ne marchent pas pour les autres !

Et comme je suis zentil, je met à disposition le keygen CS5.5 !
Pour l'activer, téléchargez -> clic droit -> décompresser ou extraire -> fouillez dans le dossier et activez le programme au logo suivant:
Il suffit juste de cliquer sur le bouton pour générer une clé d'activation, et le tour est joué ! Gardez le sous la main, il faut une nouvelle clé par lancement d'un programme. C'est sûr, ça prend 10 secondes de plus à chaque fois, mais c'est le prix à payer pour utiliser pleinement et durablement les produits adobe :3
Si vous cherchez d'autres keygens, attention ! Ils sont très souvent infectés de virus. Si vous trouvez un autre keygen qui a le même logo que le mien, il est sûr. Ceux avec un ying-yang sont sûrs aussi.

------->>> Ce que vous avez à l'écran
Voici l'écran que vous devriez normalement avoir (screen ci dessous). Comme j'ai arrangé les fenêtres à ma sauce, il est très probable que la disposition soit différente. En tout cas, sachez une chose: il y a énormément de fenêtres différentes, et tout ne sera pas affiché ! Quelque fois, il faut faire coulisser des onglets ou fenêtres pour tout voir, ou les afficher/masquer dans les options !

Pour avoir la même disposition que moi, mettez animateur (1), en haut. Vous aurez donc remarqué que plusieurs dispositions sont mis par défaut, selon ce que vous voudriez faire. Ensuite, pour un fichier flash divers, qui servira pour tout (et en utilisant de l'AS 3, mais on verra plus tard), sélectionnez Actionscript 3.0 (2) au centre. Vous avez ouvert un nouveau dossier.






------->>> Exportation et sauvegarde

A partir de là, tout ce que vous ferez sera exportable ! Avant de se concentrer sur le contenu, je vais vous expliquer les subtilités de l'enregistrement. Ne confondez pas enregistrer et exporter !
Un enregistrement, c'est sauvegarder votre travail actuel, pour pouvoir le remodifier par la suite, le compléter, le rééxploiter, etc, mais ce n'est PAS utilisable en l'état ! (Format fla)
L'exportation, c'est transformer votre travail vers le format final ! (animation swf, image, gif animé, vidéo, mp3... tout est possible) Donc, le travail NE SERA PLUS modifiable. Voici le chemin à suivre pour exporter. Notez qu'il y a une option pour paramétrer le rendu final, très pratique pour privilégier la qualité d'une musique, ou alors le poids de l'animation:



Bien entendu, vous pouvez avoir un aperçu de votre animation avant de l'exporter. Cette option sera utilisée très fréquemment, pour régler les bugs, ou éviter de remplir votre dossier de pleins d'exemplaires d'animations non abouties. C'est là que ça se passe --->>



Voilà ! Pour pouvoir utiliser votre travail, tout en gardant la possibilité de le modifier et le réutiliser à la suite, vous devrez donc posséder deux versions de votre travail dans votre dossier:

Le format FLA: Pour remodifier votre travail, le recycler pour autre chose, le corriger, etc.

Le format SWF: Il existe bien d'autres formats, mais c'est celui là qui nous intéresse. Utilisez Archive Host pour les héberger, et en récupérer le code afin de les afficher où vous voulez ! /! N'oubliez pas de modifier la hauteur et la largeur de l'animation ! Pour préserver la transparence de l'animation, vous devrez utiliser le code HTML ! Avec le code HTML, il vous faudra modifier DEUX FOIS la hauteur et la largeur ! Pour savoir la hauteur/largeur d'une animation, ouvrez le fichier FLA et regardez les dimensions de la zone de travail dans les options.

Eh voilà, vous savez tout sur la façon d'utiliser vos futures animations, et où les placer ! On va rentrer dans le vif du sujet.

------->>> Explications

On commence depuis le début !
Déjà, qu'est ce qu'une interpolation ? Eh bien, c'est... un mouvement ! Et je vais vous apprendre à en faire. Mais d'abord, je vous explique les outils. Regardez le screen ci-dessous.



Les barres en haut, ce sont les lignes de temps. C'est le scénario. On appelle ça des trames ! Trame 1, trame 2, etc... comme si c'était un film, où ça défile image par image ! D'ailleurs, pensez à régler l'i/s à 24 (1). I/S = Images par seconde. En gros, en une seconde, 24 images (ou frames) vont défiler. C'est largement suffisant. Les films pixar plafonnent à 25 i/s. Réglez à 24, et n'y touchez plus !

Ensuite, si vous avez déjà graphé un peu, vous devez être habitué aux calques. En gros, plusieurs éléments vont se superposer sur la scène, et on les séparera avec différents calques. C'est important de séparer chaque élément clé, car plus tard, quand on utilisera du codage, ça concernera la frame entière du calque. Pour créer/supprimer des calques, usez des petits boutons (2). Vous pouvez même créer des dossiers pour ranger vos calques s'il y en a trop ! Moi, j'ai créé 6 calques.

Si des choses sont placées dans le calque 4, ils seront momentanément masqués, grâce à la petite croix rouge (3). Le calque 5 ne pourra pas être (complètement) modifié, car je l'ai verrouillé avec le cadenas (4). Le calque 6 (5), c'est celui là où j'ai marqué "PWET !" en gros sur la scène, et je l'ai marqué sur la frame 1. D'ailleurs, la frame 1 est passée de rond blanc à rond noir: L'image clé vide est devenue une vraie image clé ! (6) Ensuite, sur le même calque, j'ai fait un clic droit à la frame 15, et j'ai rajouté la même image. Donc, le PWET existera de la frame 1 à 15, et comme il n'y a pas d'interpolations, il n'y aura pas de modifications.

Voilà, vous savez tout les termes techniques, on passe maintenant à l'intéressant !



------->>> Différentes interpolations
Je vous rassure, pour faire une animation flash, vous ne devrez pas faire les frames une par une, et pour chaque calque ! Vous devrez juste faire les images clés, et les interpolations calculeront automatiquement les positions intermédiaires !

Il existe 3 interpolations:
Interpolation de mouvement (Cette interpolation ne marche qu'avec les images ou swf que vous avez importés, je vous l'expliquerai plus tard, on l'utilisera énormément.)
Interpolation de forme (Cette interpolation n'est possible QUE si le calque contient des dessins ou objets créés AVEC adobe flash, par exemple un trait au pinceau, etc. Si vous avez exporté une image, ça ne sera pas possible. On l'utilisera aussi, mais moins, car c'est très imprécis.)
Interpolation classique (La même chose que celui de mouvement, en gros.)



------->>> Interpolation de forme
Je vous explique celui ci en premier, ça sera plus facile pour la suite. Tout d'abord, créez un calque, et dessinez quelque chose au pif, sur la frame 1. Clic droit sur la frape -> Interpolation de forme. Voilà, il ne vous reste plus qu'à faire une deuxième image clé différente, sur une frame un peu plus éloignée, pour que toutes les frames intermédiaires se calculent tout seul. Allez par exemple sur la frame 16, clic droit -> image clé VIDE. Voilà, vous avez inséré une image clé vide. Si elle était pleine, ça reprend la précédente par défaut, et donc il n'y a pas de modification. Maintenant, dessinez-y quelque chose de différent, et pourquoi pas d'une autre couleur.

Normalement, sur la ligne de scénario, vous obtenez ça:


Maintenant, admirez les modifications sur les frames entre les deux images clés ! Et pourquoi pas, faites une simulation de votre animation pour voir ce que ça donne en temps réel ! Moi, j'ai gardé mon "PWET", et j'ai dessiné un fureuil rouge plus loin, ça donne ça:


Oui en effet, c'est assez moche. Voilà ce que j'entendais par "imprécis". C'est pour ça qu'on utilisera principalement les interpolations de mouvement !



------->>> Interpolation de mouvement
[Suite à venir]