Share
Ce tutoriel couvre la création d'un effet de texte brillant, qui peut ensuite être facilement édité pour un prototypage rapide..
L'animation peut être publiée dans Flash Player 8 et versions ultérieures et peut être créée dans Flash 8 et versions ultérieures. Aucune actionScript n’exécute cette animation, elle peut donc être facilement implémentée dans les projets AS2 et AS3. Il peut servir de logo intro de jeu Flash amusant, de bannière publicitaire ou à votre guise. Aie du plaisir avec ça!.
Jetons un coup d'œil au résultat final sur lequel nous allons travailler:
Utilisation de Fichier> Nouveau> Créer un nouveau document Flash ActionScript 2 ou 3.
Dans la fenêtre Propriétés, définissez la taille de la scène 590 sur 300.
Également modifier les images par seconde pour être 30.
A l'aide de l'outil Rectangle (R), placez un carré sur la scène avec le dégradé radial noir et blanc prédéfini, sans trait..
Peu importe la taille du carré que vous créez.
Marquez ce calque "dégradé".
Sélectionnez votre carré de dégradé et ouvrez les options d'alignement à l'aide de CTRL + K.
Assurez-vous que l'option "Aligner sur la scène" est cochée.
Commencez par faire correspondre la largeur et la hauteur du carré à la scène.
Votre résultat devrait ressembler à ceci:
Aligne ensuite le bord gauche de la forme sur la scène.
Votre résultat devrait maintenant être comme suit:
Alignez ensuite le bord supérieur de la forme sur la scène.
Bingo:
Sélectionnez votre outil de transformation de dégradé (F).
Cliquez sur le dégradé sur la scène.
A l'aide des poignées de contrôle du dégradé, modifiez la taille et la forme du dégradé de manière à ce qu'il soit distribué de manière plus uniforme sur la scène..
Ouvrez la fenêtre Couleur (Alt + Maj + F9).
Modifiez la couleur blanche du dégradé en gris # 333333, puis faites-la glisser vers la droite de manière à ce qu'il y ait un cercle gris au milieu du dégradé..
Voici ce que vous devriez voir:
Créez un nouveau calque au-dessus du dégradé et nommez-le "lignes"..
A l'aide de l'outil Rectangle (R), tracez un rectangle sur la scène sans trait et un remplissage blanc opaque à 9%..
À l'aide du panneau des propriétés, modifiez la taille de la forme afin qu'elle soit 590 par 5.
A l'aide des options Aligner, alignez la forme sur le centre horizontal de la scène..
Ensuite, en utilisant les options Aligner, alignez la forme sur le bord supérieur de la scène..
Avec cette forme toujours sélectionnée, copiez-la et collez-la à la place (CTRL + Maj + V).
Déplacez cette nouvelle forme de dix pixels au-dessous de la première forme et dupliquez-la à nouveau en utilisant la même méthode. Vous avez maintenant quelque chose comme ceci:
Dupliquez ce processus ci-dessus jusqu'à ce que tout l'écran soit recouvert de ces formes horizontales. Vous allez vous retrouver avec quelque chose comme ça:
Créer un nouveau calque appelé "logo".
Tracez un rectangle (R) avec un trait blanc, mais sans remplissage.
Sous Propriétés, modifiez les dimensions à 590 par 300px.
A l'aide de la fenêtre Aligner (CTRL + K), alignez la forme sur le bord gauche et supérieur afin que votre résultat soit le suivant:
Sélectionnez le rectangle blanc et convertissez-le en symbole sous Modifier> Convertir en symbole..
Nommez le movieclip "masterClip" et assurez-vous que le point d'alignement est dans le coin supérieur gauche. Puis cliquez sur "OK".
Double-cliquez sur le masterClip sur la scène pour le modifier en contexte..
Double-cliquez sur le nom de la couche et changez-le en "taille de la scène".
Faites un clic droit sur le calque et choisissez "Guide".
Verrouillez le calque en cliquant sur le deuxième cercle blanc.
Vous avez maintenant un calque de référence, qui vous indique la taille de la scène, dans le contexte du masterClip.
Créez un nouveau calque et ajoutez votre texte à ce MovieClip à l'aide de l'outil Texte (T). j'ai choisi Soirée sportive SF pour cette animation.
Voici les paramètres de type à appliquer au champ de texte (les paramètres disponibles peuvent être légèrement différents, en fonction de la version de Flash utilisée):
Pour réaliser le saut de ligne dans le texte, entrez manuellement neuf espaces sur la deuxième ligne pour aligner le texte tel qu’il est affiché..
Sélectionnez le texte et utilisez la fenêtre de transformation (CTRL + T) pour faire pivoter le texte à -6,5..
Sélectionnez le texte, déplacez-le vers le bas afin qu'il soit au centre du cadre..
Sélectionnez le texte sur la scène et convertissez-le en symbole avec Modifier> Convertir en symbole (ou F8)..
Nommez le clip, "sourceText" et assurez-vous qu'il s'agit d'un clip, et non d'un bouton ou d'un clip graphique. Puis cliquez sur "OK".
Sélectionnez le clip texte et copiez-le en utilisant CTRL + C.
Créez quatre nouveaux calques en utilisant le bouton "Nouveau calque" dans le volet chronologie.
.
Placez le clip texte que vous avez copié sur chaque calque en utilisant Edition> Coller en place.
Vous avez maintenant cinq couches identiques.
Renommez chaque couche en double-cliquant sur le nom de chaque couche. Utilisez l'image ci-dessous comme guide pour nommer chacun.
Verrouillez et masquez tous vos calques à l'aide du verrou et des bascules visibles dans la timeline.
En masquant et en verrouillant chaque couche, nous pourrons isoler et éditer chaque couche indépendamment.
Rendez le calque "rougeoyant" visible et déverrouillez-le. Cliquez sur cette couche pour vous assurer de la modifier.
Sélectionnez le clip de texte sur la scène et assurez-vous que les filtres sont ouverts dans le panneau Propriétés..
Ajoutez une lueur au clip de texte en utilisant le bouton Ajouter un filtre. Choisissez l'option "Glow".
Appliquez ces paramètres à la lueur qui vient d'être créée.
Vous avez maintenant cet effet:
Maintenant, en utilisant la même méthode, appliquez un deuxième filtre de rayonnement au même clip..
Appliquez ces paramètres à la nouvelle lueur qui vient d'être créée.
Vous avez maintenant cet effet:
Maintenant, appliquez une ombre portée à ce même clip.
Appliquer ces paramètres à l'ombre portée qui vient d'être créée.
Vous avez maintenant cet effet:
Avec le calque "incandescent" toujours visible et sélectionné, ajoutez un nouveau calque. Nommez-le "vert".
.
Maintenant verrouiller et cacher et "brille" la couche. Rendre le calque "mask3" visible et le déverrouiller.
Faites du calque "mask3" un masque en faisant un clic droit sur le calque, puis en choisissant "masque".
La couche verte sera maintenant temporairement verrouillée. Déverrouillez-le en cliquant sur l'icône de verrouillage du calque.
Utilisez l'outil Rectangle (R) pour dessiner une forme sur le calque "vert"..
N'appliquez aucun trait et le dégradé linéaire standard noir à blanc.
Dessinez la forme, de sorte qu'elle soit plus grande que la taille de la scène.
Sélectionnez l'outil de transformation de dégradé (F) et cliquez sur le dégradé sur la scène..
A l'aide des poignées de transformation de dégradé, faites pivoter le dégradé de 90 degrés et modifiez l'étendue du dégradé de sorte qu'il ne recouvre que la zone de texte de la scène..
Modifiez les couleurs du dégradé à l'aide de la fenêtre de couleur. (Alt + Maj + F9).
Le vert à droite est # 8CD566.
Le vert à gauche est # 43851F.
Verrouillez maintenant le calque "vert" et assurez-vous que le calque "masque3" est également verrouillé. Activez également la visibilité du calque "rougeoyant"…
Le résultat est maintenant ceci:
Rendez le calque "lueur interne" visible et déverrouillez-le.
Sélectionnez le clip sur le calque "lueur interne" et ajoutez-lui une lueur sous les filtres dans la fenêtre Propriétés.
Appliquez ces paramètres à la nouvelle lueur:
Pointe: Notez que cette lueur est une lueur intérieure, ce qui signifie qu'elle brille de l'intérieur, pas de l'extérieur.
Votre résultat est maintenant ceci:
Le clip étant toujours sélectionné, changez le mode de fusion en superposition sous Afficher dans le panneau Propriétés:
Avec le nouveau mode de fusion en place, votre résultat est maintenant le suivant:
Ce masterClip ne contient actuellement qu'une image. Nous devons ajouter plus de cadres, afin que nous puissions animer les effets de brillance.
Dans la chronologie, cliquez et faites glisser pour mettre en surbrillance tous les calques de l'image 88.
Le cadre étant toujours sélectionné, cliquez avec le bouton droit de la souris et choisissez "Insérer un cadre" dans la liste déroulante..
Pointe: En plus de cliquer avec le bouton droit de la souris pour ajouter des cadres, vous pouvez également utiliser F5 comme raccourci..
La timeline a maintenant une étendue de 88 images.
Commencez par verrouiller et masquer d'abord la couche "lueur interne".
Avec le calque "lueur interne" toujours sélectionné, ajoutez un nouveau calque en utilisant le bouton dans la fenêtre des calques.
Double-cliquez sur le nom du nouveau calque et nommez-le "briller"..
Faites un clic droit sur le calque "masque1" du bas et faites-en un masque.
Déverrouillez maintenant le calque "Shine" et cliquez dessus pour pouvoir commencer à travailler sur ce calque..
La brillance que nous ajoutons commencera à animer à peu près à mi-parcours de l'animation. Utilisez l’épurateur du plan de montage pour accéder à l’image 47..
Cliquez sur l'image 47 du calque "briller", puis cliquez avec le bouton droit pour insérer une image clé..
Pointe: En plus du clic droit, vous pouvez également utiliser F6 pour insérer une image clé..
C’est l’image clé à laquelle nous ajouterons notre éclat.
Laissez cette nouvelle image clé sélectionnée et sélectionnez l'outil Rectangle (R)..
Choisissez le dégradé linéaire standard du blanc au noir pour le remplissage et aucun trait..
Tracez un rectangle sur la scène, légèrement plus haut que la hauteur de la scène et d'une largeur de 150 pixels.
Utilisez l'outil de transformation de dégradé (F) pour modifier l'étendue / rotation de cette nouvelle forme de dégradé..
Utilisez les poignées de contrôle du dégradé pour faire pivoter le dégradé légèrement vers la gauche..
Avec ce dégradé toujours sélectionné, ouvrez votre fenêtre Couleurs (Alt + Maj + F9) pour modifier les couleurs..
Appliquez ces paramètres à votre dégradé:
Pointe: Pour éditer une couleur de nuance de dégradé, double-cliquez sur la nuance elle-même..
Vous avez maintenant un faible dégradé de blanc à gauche de la scène..
Nous devons maintenant ajouter une deuxième image clé au plan de montage chronologique, afin de pouvoir animer ce dégradé. Cliquez sur la dernière image du calque "shine" (image 88) et insérez une image clé avec F6..
Nous sommes maintenant prêts à appliquer une interpolation à ce dégradé.
Faites un clic droit n'importe où sur le calque "scintillant" entre les deux images clés, puis choisissez Créer une interpolation de forme..
Nous avons maintenant une interpolation de forme sur le calque dans la timeline.
Pour voir le mouvement avec le dégradé, nous devons modifier la deuxième image clé. Cliquez sur l'image clé dans la timeline.
Le dégradé est maintenant sélectionné. Utilisez la flèche vers la droite pour déplacer le dégradé vers la droite de la scène..
Pointe: Pour ce faire rapidement, maintenez la touche MAJ enfoncée tout en appuyant sur la flèche vers la droite. Cela déplacera la forme par incréments de 10 pixels.
Le dégradé est maintenant assis à droite de la scène. Nous avons maintenant cela sur la deuxième image clé dans la chronologie.
Verrouillez maintenant le calque "shine" et assurez-vous que le calque "shine" et le calque "mask1" du bas sont visibles..
Vous pouvez maintenant prévisualiser l'animation en utilisant la touche ENTER.
L'animation sur cette couche ressemble à ceci.
Sélectionnez le calque "masque1" inférieur et ajoutez un nouveau calque à l'aide du bouton Nouveau calque..
Double-cliquez sur le nouveau calque et nommez-le "fondu"..
Cliquez avec le bouton droit sur le calque "masque1" supérieur et faites-en un masque..
Déverrouillez maintenant le calque "fondu". C'est ici que nous allons ajouter notre prochain effet de brillance.
Sélectionnez l'outil Rectangle (R). Définissez le trait sur null et faites le remplissage noir.
Tracez un rectangle légèrement plus large que la scène et d’une hauteur de 174.
Placez le rectangle juste au-dessus de la scène.
Sélectionnez l'outil de sélection (V) parmi les outils..
Passez votre souris sur le bord inférieur de la forme noire. Vous verrez une ligne pointillée courbe apparaître sous le curseur, ce qui signifie que vous pouvez modifier la forme vectorielle..
Cliquez et faites glisser le bord inférieur légèrement vers le haut, et vous aurez maintenant une forme concave.
Maintenant, sélectionnez l'outil de sous-sélection (A) à partir des outils..
Cliquez sur le coin inférieur droit de la forme noire. Le point de Bézier sera noir, ce qui signifie qu'il est en cours d'édition. Vous pouvez également voir les poignées de contrôle qui modifient les courbes de cette forme…
Cliquez sur la poignée de la courbe et faites-la glisser pour produire cette forme..
Maintenant, cliquez sur la poignée pour le coin gauche.
Faites-le glisser vers le haut et à droite pour produire cette forme.
Notez que la courbe chevauche légèrement la scène. Utilisez l'outil de sélection (V) pour déplacer la forme afin qu'elle ne recouvre pas la scène..
Sélectionnez la forme et créez un remplissage en dégradé en choisissant le remplissage noir sur blanc standard..
C'est notre résultat.
Sélectionnez l'outil de transformation du dégradé (F) et cliquez sur la forme du dégradé..
Utilisez les poignées de contrôle du dégradé pour le faire pivoter et comprimez-le verticalement.
Ouvrez la fenêtre Couleurs (Alt + Shift + F9) pour modifier les couleurs du dégradé..
Rapprochez les deux échantillons de dégradé et définissez les paramètres suivants:
C'est maintenant notre résultat.
Dans la timeline du calque "fade", insérez maintenant une image clé (F6) dans l'image 48.
Insérer une image clé vierge (F7) sur l'image 49.
Cliquez avec le bouton droit n'importe où entre les deux premières images clés et sélectionnez Créer une interpolation de forme..
Nous avons maintenant ceci sur la couche "fade".
Sélectionnez la deuxième image clé dans la chronologie.
À l'aide de l'outil de sélection (V), déplacez la forme vers le bas de la scène…
Pointe: Notez que seule la partie blanche du dégradé se trouve en bas de la scène. La zone transparente n'est pas visible.
Verrouillez maintenant le calque "fondu" et lancez l'animation à l'aide de la touche Entrée. Vous verrez ceci:
Maintenant, assurez-vous que tous les calques sont verrouillés et rendez-les tous visibles.
Maintenant, quand vous jouez l'animation, vous verrez ceci:
Nous avons presque terminé! Il ne nous reste plus qu'à ajouter les animations sparkle.
Cliquez sur le calque "Mask1" supérieur.
Maintenant, ajoutez trois couches en utilisant le bouton New Layer.
Nommez-les "sparkle" 1, 2 et 3.
Insérer des images clés sur ces trois nouveaux calques.
Sur l'image clé du calque "sparkle1", nous allons tracer une ligne rouge. Cliquez sur l'outil Ligne (N) et tracez une ligne telle qu'elle apparaît ici..
Cliquez sur la ligne rouge avec l'outil de sélection (V) et convertissez-la en symbole avec Modifier> Convertir en symbole (F8)..
Assurez-vous qu'il s'agit d'un clip et nommez-le "sparkleMove".
Maintenant, double-cliquez sur le nouveau MovieClip pour le modifier en contexte..
Nommez "couche 1" "référence" en double-cliquant sur le nom de la couche. Créez ensuite un nouveau calque et nommez-le "sparkle".
Maintenant étendez les cadres en cliquant sur les cadres 25 sur les deux calques, puis faites un clic droit et choisissez Insérer un cadre (F5).
Verrouillez le calque de référence et tracez un carré sans trait et un fond noir sur le calque scintillant.
Faites pivoter le carré noir de 90 degrés avec l'outil de transformation libre (Q).
À l'aide de l'outil de sélection (V), passez votre souris sur chaque côté du carré, puis cliquez et faites glisser les bords pour créer des arcs subtils. Votre résultat est une petite forme d'étoile.
Cliquez sur la forme et attribuez-lui le dégradé radial noir à blanc par défaut à partir de l'option Remplissage..
Zoomez sur l'étoile avec l'outil de zoom (Z). Sélectionnez ensuite l'outil de transformation de dégradé (F). Cliquez sur l'étoile pour l'éditer.
Ouvrez la fenêtre Couleurs (Alt + Shift + F9) pour modifier les couleurs du dégradé..
Appliquez ces paramètres au dégradé radial:
Le résultat est ceci.
Cliquez sur cette forme avec l'outil de sélection (V) et convertissez-la en symbole avec Modifier> Convertir en symbole (F8). Assurez-vous que le point d’enregistrement est au centre et nommez-le "scintillement".
Effectuer un zoom arrière et centrer le clip sparkle sur le bord gauche de la ligne rouge.
Insérer une image clé sur le calque "scintillant" de l'image 25.
Sur cette nouvelle image clé, utilisez l'outil Free Transform Tool (Q) pour faire pivoter la forme en étoile de 90 degrés vers la droite. Utilisez également l'outil de sélection pour déplacer la forme et la centrer sur le côté droit de la ligne..
Cliquez avec le bouton droit de la souris sur les deux images clés de cette couche et sélectionnez "Créer une interpolation classique"..
Vous pouvez maintenant regarder l'animation. Vous verrez l'étoile bouger et tourner de gauche à droite..
Déverrouiller le calque "référence" et définir la couleur du trait sur un niveau alpha de zéro.
Maintenant, verrouillez le calque de référence et cliquez sur le calque "scintillant" pour le modifier..
Insérer des images clés sur les images 6 et 20.
Sur l'image 1, cliquez sur le clip starburst. Dans Propriétés, sous Effet de couleur, choisissez Alpha dans la liste déroulante Style. Mettre l'alpha à zéro.
Faites la même chose sur le cadre 25.
Maintenant, le starburst disparaît au fur et à mesure qu'il avance sur la scène. Il disparaît aussi.
Revenez au niveau masterClip en double-cliquant sur la scène.
Cliquez sur le bouton de vue d'ensemble sur le calque "sparkle1" et insérez une image clé vierge (F7) sur l'image 59.
Placez également les couches d'étincelle 2 et 3 dans la vue d'ensemble.
Sur le calque "sparkle2", insérez une image clé vierge (F7) dans le cad
Accentsconagua