begin process at 2008 05 16 18:31:24
1 173 651 membres
467 nouveaux aujourd'hui
13 972 membres club

Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum.
Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !

UN SIMPLE EFFET VISUEL (FAUSSE 3D)


Information sur le tutorial

Catégorie :Astuces Date de création : 13/02/2007 20:57:50 Vu : 24 755 fois

Note :
9 / 10 - par 3 personnes
9,00 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10

Commentaire sur cette source (15)
Ajouter un commentaire et/ou une note

Description

C'est trés simple, le truc est vraiment tout bête peut être le connaissez vous déja! C'est un effet visuel(permet de faire tourner un élément 2D sur l'axe y, rah j'ai du mal à expliquer)...

Tutorial

Ce tutorial s'adresse à tous!

Je n'ai aucunne prétention mais voici le petit truc sympa que j'ai trouvé.
Onvafairetournerunclippar exemple sur l'axe ysansinterpolationdemouvement,etsansredimentionner le clip.on vautiliserle paramètre_rotation

1)Premiere étape


- Ouvrir un nouveau document Flash
- Faite un carré sur la scène, restez simple.
-Sélectionnezlecarrépuis créez un symbole( pour cela on appuie surlatouche F8 etonchoisiMovie Clip plus communément appellé MC).
-Unefoislesymbolecrééassurez vous que le carré estcentréàl'intérieurdecelui-ci. Onest pasobligémaisc'estmieux    :D
-
Sur ce clip, onva y mettre un petit code (Pas d'inquiètude il fait 3 lignes)
-Pour cela il faut sélectionner le clip et ouvrir la fenêtre action.
Voici le code:
onClipEvent(enterFrame){
this._rotation+=5;
}
Pour les débutants je commente le code.
onClipEvent(enterframe){
 instructions                                       > instructionsserajouéeàchaqueimages (instant).
}
this désigne ce clip (celui où l'on a mit le code).
this._rotation+=5; à chaque instant le clip va tourner sur l'axe z.

Si vous testez votre animation  votre carré doit tourner.

2)Deuxième partie.

Une fois le code tapé, sélectionnez ce clip et faite F8, créez un symbole.
Veillez à ce que votre 1er clip soit centré dans le 2ème clip.
Maintenant retournez sur la scène principale

-Redimentionnez le dernier clip que vous avez créé  (aplatissez le un peu mais pas trop).

Maintenant il ne vous reste plus qu'a jouer l'animation.

Voici l'effet que l'on doit obtenir:
Je ne l'ai pas fait  avec un  carré  mais avec une forme un peu plus complexe.
Voici le lien direct: islandofcreation.free.fr/fausse3D1.swf

Sur la scène copier le clip puis déplacez la copie légérement au dessus.Répetez la manip mais pas trop de fois.

Voici l'effet que j'obtient: islandofcreation.free.fr/fausse3D2.swf

C'est plutôt pas mal comme effet n'hésitez pas à laissez votre avis sur ce tuto (ou si vous avez des problème avec).

Voici  un autre rendu pour le plaisir des yeux. islandofcreation.free.fr/eppefausse3D.swf

3)Afin d'éviter que ça rame.

Les  "enterFrame" ne doivent pas être utilisé  à profusion! Sinon votre animation va RAMER.

Donc ce que j'ai fait au dessus, c'est à dire mettre un enterFrame pour chaque  clip est GOURMAND en ressource.

Je pense que le mieux est de faire ainsi :      ; )

a > Créez une forme, sélectionnez, F8, clip, une fois créé mettez le sur la scène, nommez son occurence forme.
b > Sélectionnez le, faite F8,clip, une fois créé mettez ce Movie Clip sur la scène puis aplattissez-le. Nommez le clip.   
c >Voici le code:

Ce code permettra de superposer automatiquement les clips au dessus des autres et de les faire tourner.

Il se mettra sur la premier image clé de l'animation.
//La première boucle for et là pour dupliquer le clip nommé clip, cequi en résultera seront des clips nommés clip0, clip1, ....jusqu'à 9.  

for(i=0;i<10;i++){                >10définielenombre de clip qui sera dupliquer.

//Jetientàrappellerque la boucle ce jourajusqu'a l'on dépasse 10.(Pourceux quineconnaissepas les boucles etles duplicateMovieClip je suissur qu'ily//a de très bon tutos sur ce site.  ; )

            duplicateMovieClip(_root.clip,"clip"+i, i);

//On définie la position de chaque clip:

            _root["clip"+i]._y= 200-i*1;

            _root["clip"+i]._x= 200;

}

onEnterFrame = function () {

//On fait tourner l'ensemble

            for (i=0;i<10; i++) {          

                        _root["clip"+i].forme._rotation+= 2;

            }

}
Source de cet exemple:   http://islandofcreation.free.fr/lessonex/Fausse3D(boucle+DuplicateMC).zip

Bon, c'est peut-être du chinois pour vous, ce n'est pas très compliqué.N'hésitez pas à poser des questions en cas de problème.











13 février 2007 21:45:20 :
Corrections de fautes
17 février 2007 14:56:51 :
J'ai ajouté la dernière partie "Afin d'éviter que ça rame".
17 février 2007 14:58:58 :
3ème partie
18 février 2007 10:00:20 :
partie3
05 mars 2007 18:18:00 :
Changement du titre
10 mars 2007 08:39:43 :
Ajout du zip
  • signaler à un administrateur
    Commentaire de Metarioch le 28/02/2007 00:10:52

    tip très sympa, merci à toi ;)
    J'ai juste un soucis sur la troisième, mes clips ne se reproduisent pas...j'ai dû rater un truc lol

  • signaler à un administrateur
    Commentaire de Mansuz le 02/03/2007 21:12:59

    Merci de me le signaler, j'vais y penser et vérifier si mon code est bon.

  • signaler à un administrateur
    Commentaire de Mansuz le 21/03/2007 16:33:21

    Voici le zip qui illustre la dernière partie:

    http://islandofcreation.free.fr/lessonex/Fausse3D(boucle+DuplicateMC).zip
    (Je l'ai mis dans le mode d'édition du tuto mais il n'apparaît pas).

  • signaler à un administrateur
    Commentaire de jjlarcher le 27/04/2007 20:30:15

    merci pour ce tuto simple
    et si je veux changer le sens de rotation : quel est le code ?

    levosgeois

  • signaler à un administrateur
    Commentaire de Mansuz le 02/05/2007 07:30:29

    Salut,

    Pour changer le sens de rotation il faut mettre un signe - à la place du + (par ex: this._rotation+=5;)

    devient (par ex: this._rotation-=5;)

    Mais dans ce cas on tournera dans le sens contraire.  :)

    Je ne sais pas si j'ai répondu à ta question.

  • signaler à un administrateur
    Commentaire de zihor le 06/06/2007 00:12:43

    c bien pratique pour presenter un travail, merci merci, koike je trouve ke ca laisse l'impression ke c pas bien fini,
    je ..pense.. (je sais pas si c'est faisable paske jai pa encore essayé) ke au lieu de dupliquer le symbole ca serai mieux de tracer les hauteur sous forme de rectangle et de leur appliquer le même script de la premiere etape. je sais pas si tu comprend un peu, dis moi ske tu en pense.

  • signaler à un administrateur
    Commentaire de Mansuz le 07/06/2007 11:25:14

    Effectivement je comprends ce que tu veut dire, j'y avais pensé mais ce n'est pas vraiment réalisable...
    Cette méthode a ces limites.  ;)

  • signaler à un administrateur
    Commentaire de Nitrite59 le 16/09/2007 22:05:56

    C'est normal qui manque des espaces dans le tuto ? :D sinon pas mal du tout.

  • signaler à un administrateur
    Commentaire de in2 le 07/11/2007 17:40:30

    merci beaucoup, votre code est superbe.
    mais je me demande si vous pouviez m'expliquer comment il fonctione, par exemple :
    duplicateMovieClip(_root.clip, "clip"+i, i);
    pourquoi on a met 'i' à la 3ème case et on n'a pas met 'i++'
    merci encore
    Mr-crocker@hotmail.com

  • signaler à un administrateur
    Commentaire de Mansuz le 09/11/2007 21:09:37

    duplicateMovieClip(_root.clip, "clip"+i, i);
    En faite le duplicateMovieClip  fonctionne comme ceci:

    duplicateMovieClip(on pointe le clip à dupliquer, nom des copies, profondeur des copies);

    Donc à la 3 ième case on assigne des profondeurs différentes pour chaque copies. Il faut savoir que flash n'accepte pas deux clips à la même profondeurs.  ;)

  • signaler à un administrateur
    Commentaire de furiouskiller le 25/03/2008 22:58:52

    merci pour ce tuto trés interessant
    moi je veux réaliser 1 swf qui contient 1 image d'un roché qui s'explose en laissant derriére lui une image d'un restaurant
    si vous avez des idées n'hésitez pas à m'aider svp
    merci d'avance

  • signaler à un administrateur
    Commentaire de jake13900 le 24/04/2008 14:02:27

    Svp,sa m'interesse bien mais ca marche pas( le 1ere code script), où réside le probleme?
    j'utilise cs3.

  • signaler à un administrateur
    Commentaire de Mansuz le 24/04/2008 18:57:43

    Le code est en Action Script 2 ! Pour CS3 il est dépassé (AS3) à moins de le transposer ou de choisir de coder en AS2.

  • signaler à un administrateur
    Commentaire de Liokan le 30/04/2008 04:07:31

    et le faire tourner sur un axe y possible ? :)

  • signaler à un administrateur
    Commentaire de Mansuz le 30/04/2008 16:01:49

    L'effet fausse 3D permet de faire tourner un clip en perspective sur lui même.
    http://islandofcreation.free.fr/fausse3D2.swf
    C'est bien sur l'axe y.

    "et le faire tourner sur un axe y possible ? "

    Tu veux faire quoi?
    ça?
    http://islandofcreation.free.fr/IOC/application.php?see=57

Ajouter un commentaire

Appels d'offres

Pub



CalendriCode

Mai 2008
LMMJVSD
   1234
567891011
12131415161718
19202122232425
262728293031 

Boutique

Boutique de goodies CodeS-SourceS