Cours Flash : Création de texte Star Wars

Les effets de texte sont toujours populaires auprès des utilisateurs de Flash - en particulier l'effet "Star Wars", qui est devenu célèbre avec la scène d'ouverture du film de 1977. L'effet est relativement simple, mais il a un prix : les performances de lecture en pâtissent. Utilisez-le avec précaution et testez souvent votre animation pour vous assurer que la lecture ne se bloque pas. Assurez-vous que le texte est lisible sans que le lecteur ait mal à la tête.

1. Commençons par taper notre texte. Essayez d'utiliser une police simple et en gras qui est facile à lire. Nous allons transformer et animer ce texte. Parce qu'il sera en mouvement constant, il est primordial qu'il soit épelé et facile à lire pour le spectateur. Sélectionnez la zone de texte et divisez-la jusqu'à ce que le texte devienne des graphiques vectoriels. La quantité d'informations vectorielles est essentielle et causera très probablement un problème de performances lors de la lecture. C'est aussi une raison d'utiliser une police simple et épurée, car cela entraînera moins de points vectoriels.

   

2. L'étape suivante consiste à simuler la perspective nécessaire pour créer un effet comme si le texte s'éloignait. Sélectionnez l'outil Transformation libre q et à l'intérieur de celui-ci l'outil Déformer. Tout en maintenant la touche S enfoncée, faites glisser l'un des coins supérieurs vers le centre du texte. Appuyer sur le bouton S maintient les rapports de transformation en déformant le coin adjacent dans la direction opposée. Convertissez ce bloc de texte en un symbole graphique. Si vous avez plusieurs blocs de texte, il est préférable de les traiter comme des symboles uniques plus petits.

   

3. Insérez un nouveau calque et convertissez-le en calque guide. Assurez-vous que le calque qui contient votre texte n'est pas attaché ou « guidé ». Vous pouvez faire glisser le calque de guidage sous le calque de votre texte pour éviter qu'ils ne soient fusionnés. Le contenu du calque guide ne sera pas inclus dans le fichier SWF exporté. Flash CS5 a une bonne fonctionnalité qui vous permet de choisir d'exporter ou non les calques masqués. Cette option est disponible dans l'onglet Flash du menu Fichier> Paramètres de publication. Sur ce calque, utilisez l'outil Ligne pour tracer une ligne en biais par rapport au côté de votre zone de texte. Copiez et collez-le en place, retournez-le horizontalement, puis placez-le sur le côté opposé du bloc de texte.

   

4. Ajoutez une deuxième image clé et redimensionnez le texte jusqu'à ce qu'il s'insère entre les lignes de guidage où elles se resserrent. Nous devons encore insérer quelques images entre les deux images clés et appliquer une interpolation de mouvement.

   

5. La dernière étape brise en fait la seule perspective sur laquelle cette animation est basée. Je pense que c'est l'étape la plus importante, car elle aide vraiment à préserver l'illusion d'un texte disparaissant à l'infini, pourtant c'est si simple. Dans le dernier cube de l'interpolation, sélectionnez le symbole qui contient la zone de texte, puis redimensionnez-le verticalement à l'aide des deux gestionnaires du milieu le long des bords supérieur ou inférieur à l'aide de l'outil Transformation libre. En résumé, nous compressons le symbole pour le rendre plus plat (ne pas élargir).

La lecture continue nécessitera une combinaison de centaines d'images et une fréquence d'images élevée. Le nombre exact en dépend. La quantité exacte dépend de la quantité de texte, de la police et de la taille (hauteur x largeur) de notre film. Plus le film est gros, plus il utilisera le processeur. Tout effet animé utilisant une combinaison de ces facteurs entraînera de mauvaises performances de lecture. Testons souvent et sachons à quoi ressemblera notre public.

Nous pouvons également essayer cet effet dans Photoshop avec un bloc de texte qui a été incliné dans la même perspective. Nous importons le texte avec le même fond de couleur unie que notre animation Flash utilise. Cela se traduira par une animation beaucoup plus conviviale pour le processeur, mais sa qualité se détériorera si vous la redimensionnez. Flash ne redimensionne pas très bien les bitmaps importés, le résultat ne sera donc pas visuellement attrayant. Le compromis est l'utilisation d'un texte vectoriel net avec peu de perte de puissance potentielle pendant la lecture. La meilleure défense est de tester souvent.

Plus de trucs et astuces Flash sur Techniques délicates dans Adobe Flash CS5peut être trouvé dans le livre, dans la publication à partir de laquelle l'astuce lue dans cet article peut également être trouvée.

Vous pouvez voir une démo Flash en direct sur notre site le 28 mars où vous pourrez apprendre plus de trucs !

Le jour de la diffusion, un tirage au sort débutera également sur notre site, où les Techniques délicates dans Adobe Flash CS5Nous tirerons trois exemplaires du livre parmi nos lecteurs.