1 utilisateur anonyme et 15 utilisateurs inconnus

 Mot :   Pseudo :  
 
Bas de page
Auteur
 Sujet :

[Tuto E-anim] Animation de ronds pivotants

 
n°20702
Linon
Profil : Big Penguin
Avatar
profil
Posté le 10-06-2006 à 19:49:14  
 

Bonjour les crystalliseur, voici encore un de mes petits tuto, je vous l'avais promis que je ferai un tutorial pour e-anim, alors je vous en fais un... Le tutorial consistera à faire tourner un rond sur lui même.

 

Ok je veux bien, mais c'est quoi e-anim:

 

Comme j'ai déja répondu a cette question, je vous laisse lire ce sujet http://forum.crystalxp.net/index.php?showtopic=5060 :whistle:

 

Maintenant, place au tutorial, sachez que j'utilise le skin nuage de e-anim, donc il y aura quelques différences^^.
Tout d'abord ouvrez e-anim.

 

Je vous conseil de redimensionner  votre animation en 100*100, plus ne nous sera pas utile, à vous de voir :wink: .
Bon vous avez donc votre animation sur les yeux, maintenant vous allez créer un groupe(c'est ce que je fais toujours au cas ou quelque chose loupe, comme ça je n'ai pas à créer a chaque fois un nouveau projet^^donc cliquez sur le bouton groupe(13ème bouton en partant de la gauche)http://pix.nofrag.com/0b/fait/3fe6b79f10817645407390635675.gifvoilà, vous arrivez donc dans une sorte de nouvelle fenêtre avec un fond grisé.

 

C'est dans ce groupe que nous metterons les deux ronds qui tournent, enfin si vous préférez les deux ellipses...

 

Maintenant, créez un autre groupe. Pourquoi? Simplement parce que en mettant nos ellipses dans un groupe, elles seront considérées comme des images, tandis que si vous les créez directement là ou vous ferez votre animation, dès que vous déformerez votre ellipse, elle se déformera à tous les temps. J'espère avoir été assez clair.

 

Voilà, donc une fois ce deuxième groupe créer, cliquez sur "Créer une forme/ajouter un ovale vide". Un rond apparaître dans votre groupe, essayez de le redimensionner de manière à ce que ce soit un rond et non un ovale. Ca fera plus joli :biggrin:

 

Bon pas trop de difficulté jusque là? :he: Je vous fais quand même un screenshot au cas ou vous n'ayez pas tout à fait comprit:

 

http://pix.nofrag.com/93/95/b8f0cc197cf028b9649e3ee7696f.jpg

 

Voilà, une petite forme ronde :smile: bon maintenant, vous allez retourner au premier groupe, comment faire?

 

http://pix.nofrag.com/e2/01/3062e21ba11fa25908fa60c84596.jpg

 

Bon, maintenant que vous êtes au premier groupe, vous voyez votre rond non plus avec des bords bleus mais avec des bords noirs, c'est ce qui signifie que votre rond est considéré comme une image :wink: .

 

Dans le deuxième groupe:

 

http://pix.nofrag.com/93/95/b8f0cc197cf028b9649e3ee7696f.jpg

 

Dans le premier groupe:

 

http://pix.nofrag.com/1f/da/e7b7cb099f79d9a74b12c4c7f7be.jpg

 

Bon maintenant répétez cette étape avec un deuxième rond, ouvrez un nouveau groupe... Essayez de faire en sorte qu'il soit plus petit que le précédent. Retournez au premier groupe et vous avez environ ceci:

 

http://pix.nofrag.com/77/bd/0e1962f247646be3c7deda341803.jpg

 

Bon si vous avez comme moi, c'est parfait :wink:

 

Maintenant, on va donner l'impression à nos deux ellipses qu'elles vont tourner sur elles même.

 

Avant de passer à cette étape, je vais vous expliquer une chose dont on aura besoin pour donner l'impression à nos ellipses qu'elles vont tourner sur elles même.

 

Notre fenêtre e-anim ressemble à ça:

 

http://pix.nofrag.com/a5/3c/95732d7e96459226d86ef7e1749dt.jpg

 

Maintenant, je vais vous donner une astuce pour que l'on puisse changer les valeurs numériques de notre animation(sa taille/sa hauteur/sa longueur/là ou elle est placée...)tout est dans le screenshot:

 

http://pix.nofrag.com/bb/2c/f3ac84205ec74a3f3a1553b9a50ft.jpg

 

Voilà, vous avez double cliquez là ou je vais ai montrer sur le screen, après que voyez vous? Oh plusieurs champs sont apparus! Voici ce que vous avez après :biggrin: :

 

http://pix.nofrag.com/1d/18/0c3962dda7fc0b445958c607f94dt.jpg

 

Et voilà, on a 6 champs ou des valeurs différentes sont dedans. On va s'intéresser à 2 champs:

 

x% et y%, x% représente la largeur de votre forme que ce soit un rond, une image ou une forme quelconque. y% vous l'aurez deviner la hauteur. Plus le chiffre inscrit dedans sera proche de 100 plus il sera à taille normale, mais plus il sera proche de 1(et pas de 0)plus votre forme sera écrasée.

 

On va faire un test Ok? Vous allez sélectionner un de vos deux ronds en cliquant dessus, maintenant, vous allez sur le champ x% et remplacez la valeur 0 par 10, que voyez vous? :oh: votre rond est écrasé comme ceci:

 

http://pix.nofrag.com/5a/be/d8357ef47830db3f120863911713t.jpg

 

Vous commencez à voir ou je veux en venir? Non toujours pas? C'est pas grave :mdr: .

 

Bon, maintenant que vous avez comprit ceci, on peut donc passer à notre animation, remettez la valeur x% à 0.
Maintenant, nous allons jouer avec les temps, les temps c'est ce qui va nous permettre de faire avancer notre anime.

 

Voici à quoi ressemble la barre des temps:

 

http://pix.nofrag.com/cc/a9/1bc9c5b23ead2d7a7172aa148dd7.jpg

 

Ca peut paraître évident pour certains, mais pas pour d'autres...

 

Bon maintenant vous n'allez peut-être pas bien comprendre ce que je vais vous faire faire, mais une fois cela fait, vous comprendrez :wink: (enfin j'espère :tongue: ).

 

Sélectionnez le plus grand des deux ronds et allez au temps 10(ou 20, cela dépend de la longueur à laquelle vous voulez que votre anime tourne...)et mettez dans le champ y% la valeur 2. Vous voyez un simple trait, c'est parfait :wink: :

 

http://pix.nofrag.com/22/78/65154375cf5dac78ea2081ceb14b.jpg

 

Voilà, rien de bien dur :wink: .

 

Vous allez au temps 20, puis remettez la valeur du champ y% à 100(et pas 0 ni 1, sinon ça ne fonctionnera pas)et là, votre rond à reprit sa taille normale.

 

Voilà, donc c'est fait pour le premier rond :smile: .

 

On va passer au deuxième rond maintenant:

 

Retournez au temps 0 et sélectionnez le second rond(le plus petit)puis allez au temps 10, cette fois-ci, on ne va pas modifier la valeur du champ y% mais x% donc la hauteur(Ca fait plus joli :happy2: ). Mettez donc 2 à la place de 0 dans la champ x% . Et là, votre rond est écrasé, vous obtenez une sorte de croix:

 

http://pix.nofrag.com/4c/26/272c2414073e03d84b0ca8be8411.jpg

 

Bon si vous avez tout comme moi, c'est parfait :great: . Allez au temps 20 et remettez 100comme valeur à la place de 2 dans le champ x% . Vous avez le même résultat qu'au temps 0, en tout cas, c'est parfait, votre animation est terminée :happy2:
c'est pas très esthétique(ça vous pouvez le faire par contre^^) mais marrant :lol:

 

http://img110.imageshack.us/my.php?image=t...f&width=320

 

Si quelque chose vous parait faux, n'hésitez pas :wink:

 

PS: Désolé pour les fautes mais ce tuto m'a prit longtemps à écrire^^.

 

Bonne chance :wink:

answer
mood
GoogleAds
profil
Posté le 10-06-2006 à 19:49:14  
 

answer
n°20703
claudio-design
Profil : New Penguin
Avatar
profil
Posté le 10-06-2006 à 20:44:10  
 

nice...et c'est vrai que la qualité...reste a disiré!

answer
n°20704
Linon
Profil : Big Penguin
Avatar
profil
Posté le 10-06-2006 à 20:54:08  
 

Citation :

nice...et c'est vrai que la qualité...reste a disiré!


Merci, comme je l'ai dit, c'est un screencast car mon ordi bug, mais dès que j'aurais régler ça, je vous afficherai l'animation elle même :wink:

answer
n°20705
linkinmimil
Profil : Penguin Pro
Avatar
profil
Posté le 10-06-2006 à 21:16:42  
 

chouette, un tuto pour eanim... même si je n'aime pas trop ce soft, car trop rudimentaire je trouve... ça reste quand même une alternative sympathique à flash.
après, je dis vive le soft de hurum (camstudio :mdr: :he:) c'est bien celui là que tu as employé pour faire la capture... il est vraiment pas bien ce soft, il fonctionne pour les vidéos mais quand c'est du flash, ça donne pas bien je trouve...
après, le tuto en lui même est bien fait et ça donne un bel effet en changeant quelques trucs... bravo.

answer
n°20711
Linon
Profil : Big Penguin
Avatar
profil
Posté le 11-06-2006 à 00:00:48  
 

linkinmimil a écrit :

chouette, un tuto pour eanim... même si je n'aime pas trop ce soft, car trop rudimentaire je trouve... ça reste quand même une alternative sympathique à flash.
après, je dis vive le soft de hurum (camstudio :mdr: :he:) c'est bien celui là que tu as employé pour faire la capture... il est vraiment pas bien ce soft, il fonctionne pour les vidéos mais quand c'est du flash, ça donne pas bien je trouve...
après, le tuto en lui même est bien fait et ça donne un bel effet en changeant quelques trucs... bravo.


Eh hop, j'ai corrigé mon bug, je vous ai mis le résultat direct :happy2:

 

linkinmimil :ar: Merci :happy2: pour ce qui est de e-anim, le créateur ne prétend pas être une alternative, car il ne possède pas toutes les fonctions de flash... En changeant quoi? :whistle:

 

Pour ce qui est de camstudio, c'était le seul moyen que je voyais en attendant de corriger mon bug, mais oui il est vraiment nul^^mais c'est corrigé :wink:

 

Ce tuto etait en quelque sorte une introduction à e-anim, on peut faire des trucs bien complets, je pense que j'en ferai d'autres avec plus de diffculté :wink:

 

Je vous montrerai peut-être comment faire un jeu =)

answer
n°20712
Franatix
http://franatix.free.fr/
Profil : Penguin Pro
Avatar
profil
Posté le 11-06-2006 à 00:38:47  
 

Pas mal Linon :great:

 

Tu a oublier des lettres dans le titre :wink:

answer
n°20713
Linon
Profil : Big Penguin
Avatar
profil
Posté le 11-06-2006 à 00:42:50  
 

Citation :

Pas mal Linon :great:

 

Tu a oublier des lettres dans le titre :wink:


Merci :happy2: pour les lettres, c'est corrigé :wink:

answer
n°20715
linkinmimil
Profil : Penguin Pro
Avatar
profil
Posté le 11-06-2006 à 08:53:47  
 

l'animation donne bien, juste que tu devrais supprimer la dernière frame et mettre des images clé plus proches les une des autre pour que l'anim soit plus rapide...

answer
n°20716
Linon
Profil : Big Penguin
Avatar
profil
Posté le 11-06-2006 à 10:16:22  
 

Tu veux dire pour que ça donne un mouvement constant? Ca c'est possible, mais en fait, c'était fait exprès ça, mais ce que tu dis est aussi possible :wink: :

 

http://img104.imageshack.us/my.php?image=c...d.swf&width=320

 

Ou encore plus rapide si tu veux :wink:

answer
n°20721
linkinmimil
Profil : Penguin Pro
Avatar
profil
Posté le 13-06-2006 à 18:34:34  
 

nan, enfet, il faudrait que tu rajoute le nombre d'image par secondes pour que le mouvement ne soit pas sacadé.

answer

Aller à :
Ajouter une réponse