32
Créer un reflet sur un texte
Voici une méthode pour créer un reflet sur un texte grâce à Flash. Pour ce tutorial, j’aurais besoin de 2 images réalisées sous Photoshop : la 1er est l’image avec mon texte fini que j’ai enregistré au format *.JPEG, la 2e image est mon texte à l’identique sans style de calque ni fond que j’ai enregistré au format *.PNG pour prendre en compte les transparences.
Voici le rèsultat : l’animation flash :
Etape 1 :
1. Je viens de créer un nouveau document, je vais dans le panneau des propriétés pour changer la taille du document par rapport à l’image à venir, la couleur d’arrière plan (le blanc peut être gênant) pour un gris foncé, puis je change la cadence : de 12 ips je passe à 24 ips pour une animation plus fluide.
2. J’ouvre la bibliothèque de mon document (raccourci clavier Ctrl +L), et j’importe mes 2 images : Menu Fichier > Importer > Importer dans la bibliothèque.
3. Dans le panneau bibliothèque, je vais glisser – déplacer l’image finie (celle au format *.JEPG) vers la zone de travail, je la positionne parfaitement grâce au panneau Aligner (raccourci clavier Ctrl +K).
4. Dans la TimeLine, Je renomme ‘calque 1’ en ‘Texte’ .
Etape 2 :
1. Dans la TimeLine, je crée un nouveau calque au-dessus du calque ‘Texte’ que je renomme ‘Reflet’.
2. Toujours en restant sur le calque ‘Reflet’, je vais glisser – déplacer ma 2e image (celle au format *.PNG) au-dessus de la zone de travail ; inutile de la positionné correctement.
3. Je vais convertir ma 2e image en image vectorielle : dans le Menu Modification > Bitmap > Tracer le Bitmap
4. Dans la fenêtre Tracer le Bitmap, j’ai plusieurs valeurs à régler :
- Le seuil de couleur à 200
- Zone mini de 2 pixels
- Aspect des courbes : pixels
- Seuil d’angle : angles nombreux
Puis je valide, Flash a converti l’image en tracé vectoriel, Je peux supprimer l’image de ma bibliothèque si je le veux.
Etape 3 :
1. Je vérifie que l’ensemble de ma nouvelle image vectorielle est sélectionnée pour la convertir en symbole (raccourci clavier : F8), la fenêtre Convertir en Symbole fait son apparition. Je lui donne un nom : ClipReflet et un comportement : Clip ensuite je valide.
2. Je vais positionner mon Clip ClipReflet à l’emplacement exact de mon texte de manière à remplir l’écriture dorée (je m’aide des flèches directionnelles du clavier, pour un positionnement au pixel près)
Etape 4 :
1. Je fais un double-clic sur ClipReflet pour rentrer dans les modifications de celui-ci, puis je renomme ‘Calque 1’ en ‘Masque’ dans la TimeLine. Je crée un nouveau calque que je nomme ‘Effet’ et je le positionne sous le calque ‘Masque’.
2. Toujours en restant sur le calque ‘Effet’, je sélectionne l’outil rectangle dans la barre d’outils (raccourcie clavier : R), et je dois choisir des couleurs de trait et de remplissage.
3. Pour la couleur de trait, je valide la case ‘pas de couleur’ et pour la couleur de remplissage j’ouvre la fenêtre du mélangeur : Menus Fenêtre > Panneaux de conception graphique > Mélangeur (raccourci clavier : Maj. + F9).
4. Dans le panneau du mélangeur, je choisis un style de remplissage linéaire dans le menu déroulant. Je rajoute 2 étapes de dégradé vers le centre puis je leur donne une couleur jaune vif (#F9FC00) et je règle la valeur Alpha à 75% pour les 2 (l’alpha permet de gérer l’opacité). Pour les 2 étapes de dégradé aux extrémités, je règle la valeur Alpha à 0% et la couleur : Blanc (#FFFFFF) . Ainsi j’ai un joli dégradé : Transparent > Jaune > Transparent
5. Je n’ai plus qu’a créer un rectangle un peu plus grand que mon texte, à gauche en dehors de la zone de travail. Je convertis mon rectangle en symbole (raccourcie clavier : F8) Nom : Reflet et Comportement : graphique .
Etape 5 :
1. En restant sur le calque ‘Effet ‘, je vais créer une image-clé à l’image courante (ou frame ) 50 : clic droit > Insérer une image-clé.
2. Sur cette nouvelle image-clé, je vais positionner mon rectangle à droite de la zone de travail. Je fais attention à le déplacer horizontalement
3. Ensuite, je vais créer une interpolation de mouvement en sélectionnant n’importe qu’elle image précédent mon image-clé puis : Clic Droit > Créer une Interpolation de Mouvement. Ainsi le rectangle Reflet se balade de la gauche vers la droite 
Etape 6 :
1. Pour la suite, je sélectionne le calque ‘Masque’ pour créer une image-clé à la frame 170 : clic droit > Insérer une image-clé.
2. Puis je vais transformer se calque en Masque : Clic droit sur le calque > Masque.
3. Ensuite, je retourne à mon scénario, avec le bouton précédent. Je vous laisse découvrir le résultat final (raccourci clavier : Ctrl + Entrée)
Conclusion :
J’espère que vous aurez maintenant compris comment donner un reflet à un texte. Tout le secret réside dans la combinaison d’une interpolation de mouvement et d’un masque. On peut créer des reflets sur différents modèles : écrans, lunettes, vitres, etc. en changeant la couleur du reflet : Blanc, gris clair, bleu ou en variant l’angle.
Post-Scriptum : Ce tutorial a été effectué sous Flash MX 2004, certains menus ou fenêtres peuvent être différents de la version Flash 8, mais rien de dramatique. Les raccourcis claviers et la méthode à suivre restent inchangés.
- RefletTexteFlash
- cliques ici pour télécharger le pack de création flash contenant les sources utilisées dans ce tutorial
Article publié par MØG
Vous aimez cet article? Partagez le !
Adepte de Photoshop et Flash depuis de nombreuses années. J’aime faire partager mes connaissances avec le plus grand nombre.
Pour en savoir plus : Mon Portfolio
La galerie des membres
Voici les images déjà publiées par les membres de ce site, merci à vous pour votre créativité !
Questions et commentaires, Il y a 7 messages de forum.
Vous avez besoin d’eclaircicemment sur un points évoqués dans cette leçon, dans ce cas laissez votre question en utilisant le formulaire ci dessous, notre équipe vous apportera rapidement un complètement d’information. Merci d’être le plus précis possible lors de la rédaction de votre demande.
-
4 juillet 2009 00:37, par 9MM
salut,
merci j ai pu créer ma toute 1er annimation grace a se tuto sa pas été des plus facile parce-que j ai la version CS4 PRO y avait certaine chose qui ne correspondait pas du style le mélangeur et le panneau conception graphique ! mais bon avec perseverance j ai fini par y arriver =) d ailleur cette anim été destiner a ma femme et vu le grand sourire et le gros calin (sans arriére penser hein !^^) au quel j ai eu droit je pense que sa devait pas etre si mal ! en tous cas pour tous ces tuto qui son tous captivant !!
Répondre -
16 décembre 2009 20:28, par KeVinG
Bonjour , je recontre un probleme lors de la création de l’inerpolation de mouvement. Le reflet ne se met pas en place
Répondre
j’ai bien mon reflet a gauche au premier frame et a droite a mon 50 eme frame mais entre les deux l’image reste a gauche. j’ai CS4 pro. Merci de bien vouloir m’aider.
cordialement-
17 décembre 2009 19:19, par MØG
Créer une interpolation de mouvement sur le frame 1 ... si Flash n’arrive pas à faire l’interpolation, la flèche est alors en pointillé.
Donc vérifie que t’es sur le bon calque et que dans ce calque, il n’y a que ton symbole (ClipReflet). Sinon donne plus détail ...Voir en ligne : MØG Folio
Répondre
-
-
12 mars 2010 15:48, par Votre pseudonyme
Merci beaucoup pour ce tuto, je viens de créer mon premier reflet avec texte. Et ca rend plutot pas mal casino sans telechargement
Répondre -
6 février 2011 19:55, par Votre pseudonymeaccro22
merci beaucoup pour ce tuto, l’effet est superbe, très stylé. vos tutos m’aident beaucoup à progresser. merci donc de partager vos expériences.
Répondre
