Val-Création
Vous souhaitez réagir à ce message ? Créez un compte en quelques clics ou connectez-vous pour continuer.



 
AccueilAccueil  RechercherRechercher  Dernières imagesDernières images  S'enregistrerS'enregistrer  ConnexionConnexion  
Le deal à ne pas rater :
Manga Chainsaw Man : où acheter le Tome 17 édition Collector de ...
19.99 €
Voir le deal

 

 Animé le rebond d'une balle...

Aller en bas 
4 participants
AuteurMessage
allstar27
A l'aise
A l'aise
allstar27


Messages : 98
Date d'inscription : 20/08/2007
Age : 39
Localisation : Liège

Animé le rebond d'une balle... Empty
MessageSujet: Animé le rebond d'une balle...   Animé le rebond d'une balle... EmptySam 1 Sep - 16:52

Salut, je vais vous montrer comment animer le rebond d'une balle sur le sol, avec son ombre.

1. Créez unnouveau document Flash (Fichier/Nouveau/Ducument Flash), et dessinez une simple ligne horizontale noir qui symbolisera le sol. Ajoutez deux autres calques par-dessus. (Pour dessiner une ligne parfaitement horizontale, appuyez sur la touche Animé le rebond d'une balle... 18403ok2 et, tout en la maintenant enfoncée, dessinez la ligne.)

Animé le rebond d'une balle... 49004325wb5

2. Sur le calque du haut, dessinez un rond rempli d'un dégradé de la couleur de votre choix, sans contour. Veuillez à ce que le mode Dessin d'objet soit activé et positionnez ce rond au-dessus de la ligne horizontale. Maintenez la touche Animé le rebond d'une balle... 18403ok2 enfoncée tout en dessinant ce rond pour qu'il soit parfait.

Animé le rebond d'une balle... 64419999az1

3. Utilisez l'outil Pot de peinture et cliquez en haut à gauche de votre rond pour que le dégradé ne soit pas situé au centre.

Animé le rebond d'une balle... 40950491ix6

4. Dans le scénario, cliquez sur l'image 20, et appuyez sur F6 pour créer un deuxième image clé à cet endroit.

Animé le rebond d'une balle... 64622717aj2

5. Sur le calque du bas, contenant la ligne horizontale, cliquez sur l'image 20 et appuyez sur F5 pour étendre l'image jusqu'à cet endroit.

Animé le rebond d'une balle... 53704586fk1

6. Sélectionnez votre balle et, toujours en restant à l'image 20, déplacez-la en dessous de la ligne horizontale.

7. Pour créer l'interpolation de mouvement entre les deux positions de la balle, cliquez entre l'image 1 et l'image 20.

8. Dans le panneau Propriétés, dans la liste déroulante Interpolation choisissez Mouvement.

Animé le rebond d'une balle... 81634076gz5

9. Une flèche bleue apparaît dans votre scénario, entre les deux images clés, signifiant ainsi que votre interpolation est réalisé. Déplacez la tête de lecture pour voir l'animation de votre balle, qui tombe désormais.

10. Nous allons donner un effet de rebondi à notre balle, pour rendre l'animation un peu plus réaliste. Pour cela, créez une nouvelle image clé de la balle à l'image 25, sélectionnez la balle et, avec l'outil Transformation aplatissez-la légèrement en utilisant la poignée du haut en appuyant simultanément sur la touche ALT.

Animé le rebond d'une balle... 77992379on5

11. Créez une deuxième interpolation de mouvement entre l'image clé 20 et l'image clé 25.

12. Votre balle semble s'écraser sur le sol. L'interpolation de mouvement a donc permis d'animer cettre transformation. Nous allons maintenant faire remonter notre balle et, tout d'abord, la remettre à son état normal. Pour cela, il suffit de copier la balle à l'image 20, de créer une nouvelle image clé vide à l'image 30 en appuyant sur F7 et de coller la balle en faisant Editon/Coller en place (ou Ctrl+Maj+V).

13. Mettez-vous a l'image 1, copiez la balle, créer une image clé vide à la position 50 en appuyant sur F7, et collez la balle en faisant à nouveau Editon/Coller en place. Notre balle retrouve ainsi sa position de départ.

14. Créez une interpolation de mouvement entre les images 25 et 30 ainsi qu'entre les images 30 et 50 et allongez à nouveau notre ligne du sol jusqu'à l'image 50, en sélectionnant ce calque et en appuyant sur F5.

Animé le rebond d'une balle... 31880582gp1

15. Votre balle rebondit! Testez votre animation en faisant Ctrl+Entrée, vous la verrez ainsi jouer en boucle. Cependant, le mouvment n'est pas très réaliste. Nous allons ajouter un peu d'effet de gravité, en jouant sur l'accélération et la décélération. Pour cela, cliquez sur le scénario entre l'image 1 et l'image 20.

16. Dans le paneau Propriétés, à l'option Accélération, déplacez le curseur vers le bas pour créer une accélération négative de -100. Le terme négative est un peu trompeur car on pourrait penser qu'il s'agit d'une décélération.

Animé le rebond d'une balle... 79534412zd0

17. Répétez la même action pour l'interpolation entre l'image 30 et l'image 50, mais cette fois avec une accélération positive de 100.
Testez votre animation , et vous verrez que la balle a désormais un mouvement plus réaliste. Ajoutons encore du réalisme en créant une ombre au sol.

18. Sur le calque 2, qui était vide jusqu'a présent, dessinez un rond noir légèrement aplati, de façon qu'il soit sur le sol et à droite de la balle.

Animé le rebond d'une balle... 10sx3

19. Convertissez cette ombre en clip d'animaiton, en la sélectionnant et en allant dans Modification/Convertir en symbole (ou en appuyant sur F8), et, dans la boîte de dialogue qui apparaît, donnez lui comme nom ombre et cliquez sur OK.

20. Dans le panneau Propriétés, cliquez sur l'onglet Filtres, et appliquez un filtre de flou à l'ombre, avec des paramètres de Flou X et Flou Y égaux à 25 et de qualité Moyenne.

Animé le rebond d'une balle... 11ne5

21. Positionnez la tête de lecture du scénario à l 'image 20, et créez une nouvelle image clé de notre ombre en appuyant sur F6. Déplacez l'ombre de façon qu'elle soit sur le bas à droite de notre balle, et baissez les paramètres de flou à 5, pour que l'ombre soit plus nette.

Animé le rebond d'une balle... 12ju3

22. Créez une autre image clé à la position 30, tant que votre balle est au sol, puis mettez-vous à l'image 1 et copiez l'ombre. Mettez-vous ensuite a l'image 50, créez une image clé vide en appuyant sur F7, et collez l'ombre en faisant Editon/coller en place (ou Ctrl+Maj+V). Votre ombre prend ainsi sa position de départ.

23. Créez une interpolation de mouvement entre les images 1 et 20, avec une accélération négative de -100 et une autre interpolation de mouvement entre les images 30 et 50 avec une accélération positive de 100. Vous avez fini! Testez votre animation pour voir votre balle rebondir. Vous noterez que l'interpolation de mouvement a animé automatiquement le passage du flou de l'ombre de 25 à 5. Vous pouvre rendre votre animation moins saccadée en changeant le nombre d'image par seconde de votre animation Flash, dans le panneau de Propriétés. Une cadence de 25 images par seconde changera nettement la qualité de l'animation.

RESULTAT FINALE:
http://img151.imageshack.us/my.php?image=rebondhu4.swf
Revenir en haut Aller en bas
http://kenza-farah.exprimetoi.net
val1012
Admin
Admin
val1012


Messages : 190
Date d'inscription : 17/08/2007

Animé le rebond d'une balle... Empty
MessageSujet: Re: Animé le rebond d'une balle...   Animé le rebond d'une balle... EmptySam 1 Sep - 16:55

cool ! Very Happy
Revenir en haut Aller en bas
https://graffist.forumactif.com
mysticstef
Nouvelle recrue
Nouvelle recrue



Messages : 7
Date d'inscription : 03/09/2007
Age : 52
Localisation : Lyon (69)

Animé le rebond d'une balle... Empty
MessageSujet: Re: Animé le rebond d'une balle...   Animé le rebond d'une balle... EmptyLun 3 Sep - 12:54

Impressionnant le résultat!

Chapeau !
Revenir en haut Aller en bas
http://www.mysticstef.com/
thedemoniak
A l'aise
A l'aise
thedemoniak


Messages : 91
Date d'inscription : 28/08/2007

Animé le rebond d'une balle... Empty
MessageSujet: Re: Animé le rebond d'une balle...   Animé le rebond d'une balle... EmptyLun 3 Sep - 13:52

super tuto a transferer sur le nouveau forum
Revenir en haut Aller en bas
Contenu sponsorisé





Animé le rebond d'une balle... Empty
MessageSujet: Re: Animé le rebond d'une balle...   Animé le rebond d'une balle... Empty

Revenir en haut Aller en bas
 
Animé le rebond d'une balle...
Revenir en haut 
Page 1 sur 1
 Sujets similaires
-

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Val-Création :: Espace Graphisme :: Tutos Flash-
Sauter vers:  
Ne ratez plus aucun deal !
Abonnez-vous pour recevoir par notification une sélection des meilleurs deals chaque jour.
IgnorerAutoriser