Préchargement de l'animation

 

C'est habituellement la dernière étape de création de l'animation. Le but est de charger en mémoire l'animation lors de l'exécution si et seulement si celle-ci n'est pas dans le 'cache' du navigateur de l'utilisateur.
Voir aussi dans la rubrique SwishMax

Création d'une nouvelle scène

1 - Pour cela, supposons que l'animation soit composée de 4 scènes

outline avec 4 scenes

2 - Cliquez sur 'Insert', puis sur 'Scene' pour insérer une nouvelle scene.

insertion scène

3 - Cliquez le bouton Bring to Front de la barre de boutons pour placer cette scène en premier.
4- Dans la zone droite, renommez cette scène Preloader par exemple.

renommer la scene

Création d'un habillage

Dans cette partie, on se propose d'animer un texte le temps du préchargement.

1 - On suppose que le cadre de l'animation a pour largeur 700, pour hauteur 450, une couleur de fond verte, et une fréquence de 20 images/seconde.
La scene 'Preloader' étant active, cliquez sur le bouton Insert Text
2 - Dans la zone droite, cliquez l'onglet 'Text' et entrez les données indiquées par la figure suivante.

texte préchargement

3 - Maintenant, il s'agit de créer les effets dont voici le résultat ( rangée de 'Timeline' )

timeline du préchargement

3.1. Cliquez la case 1 de la rangée du Texte 'Chargement en cours...' dans Timeline.
Cliquez sur 'AddEffect', puis sur 'Fade In'. Gardez les valeurs par défaut.

timeline

3.2. Cliquez la case 11 de la rangée du Texte 'Chargement en cours...' dans Timeline.
Cliquez sur 'AddEffect', puis sur 'Move'
Dans l'onglet Motion de la boite de Propriétés, cliquez sur 'Color', puis sur 'Fade to Color'.
Laissez 100%, mais cliquez sur l'icône de couleur et choisir une couleur gris clair ( ou trés pâle ).
Le texte va passer progressivement de la couleur jaune à gris clair sur 10 images.
Vous pouvez le vérifier en cliquant sur la case 11 de la régle graduée de 'Timeline'.

marqueur

puis 9 fois sur le bouton avancement situé dans la barre de boutons.

options move

3.3. Cliquez la case 21 de la rangée du Texte 'Chargement en cours...' dans Timeline.
Cliquez sur 'AddEffect', puis sur 'Move'.
Dans l'onglet Motion de la boite de Propriétés, cliquez sur 'Color', puis sur 'Fade to Color'.
Mettre 0%

fade to color

Le texte va revenir progressivement à la couleur jaune sur 10 images.
3.4. Cliquez la case 35 de la rangée du Texte 'Chargement en cours...' dans Timeline.
Cliquez sur 'AddEffect', puis sur 'Fade Out'. Conservez les valeurs par défaut.

3 - Expressions des conditions

1 - La scène 'Preloader' étant toujours sélectionnée, cliquez sur l'onglet 'Actions' dans la partie droite, puis sur 'AddEvent' et 'At Frame'

ajout événement

2 - Laissez le nombre 0 dans le champ en bas de la partie droite de l'écran car on s'intéresse à la première image.
Cliquez maintenant le bouton 'AddAction'., puis sur 'If frame loaded'

si image chargée

3 - On voit apparaître 'If Frame 0 of Preloader is loaded'. Or, ce n'est pas sur la scène PreLoader que la condition doit s'exprimer.
Supposons que Scene1 soit une scène de présentation et que Scene2 soit le 1er menu.
Dans le bas de la partie droite, mettre 10 à droite de Number puis cliquez sur Preloader et choisir Scene2.

condition sur scene

4 - Cliquez maintenant sur 'AddAction', puis sur 'Go to Frame'

ajout action

5 - L'action porte sur la première image de Scene1, cliquez alors sur Preloader et choisir Scene1.

ajout action

En résumé, à l'image 0 (Frame0) de 'Preloader' , si l'image 10 (Frame10) de 'Scene2' (qui est un menu) est chargée, alors on va directement à l'image 0 (Frame0) de 'Scene1' (qui est une présentation).

6 - Dans 'TimeLine', Cliquez sur la case correspondant à 30 de la rangée 'Preloader'

timeline frame 30

7 - En appliquant la méthode précédente, créez la condition comme l'indique la figure.
A l'image 30 (Frame30) de 'Preloader' , si 'Scene2' (qui est un menu) est entièrement chargée ( -1 est la dernière image), alors on va directement à l'image 35 (Frame35) de 'Preloader' et le texte disparaît progressivement (Fade Out).

at frame 30

8 - Dans 'TimeLine', Cliquez sur la case correspondant à 31 de la rangée 'Preloader'.
En appliquant la méthode précédente, créez la condition comme l'indique la figure suivante.
A l'image 31 (Frame31) de 'Preloader' , allez à l'image 11 (Frame11) de 'Preloader'
(début d'un effet décrit précédemment dans la partie création d'un habillage).

at frame 31

 


Si vous aimez le site

 

Select a language if you need :


Page chargée en 0.008 sec.

Dernière Modification : Mer 25 Janvier 2017 8:56
Copyright © 1999-2017 Jean-Paul Molina Tous droits réservés.

vers Google