Des ondes dans l'eau ou effet pavé dans la marre (débutant)

    Partager

    artkabis
    Administrateur

    Nombre de messages: 4514
    Age: 28
    Logiciels: Photoshop CS4, Flash CS4, Indesign CS4, After Effects CS4, Illustrator CS4, Premier Pro CS4, Encore CS4, Flexbuilder 3, Papervision 3D, Camtasia, Captivate, InDesign, Swift 3d, Illustrator, Dreamweaver CS3, Blender, Swift 3D, WampServer.
    Date d'inscription: 11/09/2008

    Capacités en graphisme
    Capacité graph:
    9/10  (9/10)

    Des ondes dans l'eau ou effet pavé dans la marre (débutant)

    Message par artkabis le Mar 28 Avr - 16:48

    Bonjour à tous !!! Aujourd'hui j'ai décidé de vous préparer un tutoriel qui m'a été demandé par un membre. Nous allons donc nous amuser à créer un effet d'onde sans la moindre ligne de code, vous allez voir que ceci ce fait en quelques secondes.

    Le résultat:


    Le tutoriel:


    Le fichier source:


    .

    megalex
    Ceinture jaune
    Ceinture jaune

    Nombre de messages: 343
    Age: 19
    Logiciels: photoshop cs3, flash cs4,flex builder 3,gimp,code::blocks, notepad++,et bien d'autres...
    Date d'inscription: 12/04/2009

    Re: Des ondes dans l'eau ou effet pavé dans la marre (débutant)

    Message par megalex le Mar 28 Avr - 18:17

    merci pour ce tuto Wink

    enfait c'est très simple ^^ par contre pour le reflet dynamique je ne sais toujours pas Razz sa me parais super dur ^^'

    ps: peut-être faire une copie de la scène et la coller en dessous avec un retournement vertical? bon bref merci Wink

    artkabis
    Administrateur

    Nombre de messages: 4514
    Age: 28
    Logiciels: Photoshop CS4, Flash CS4, Indesign CS4, After Effects CS4, Illustrator CS4, Premier Pro CS4, Encore CS4, Flexbuilder 3, Papervision 3D, Camtasia, Captivate, InDesign, Swift 3d, Illustrator, Dreamweaver CS3, Blender, Swift 3D, WampServer.
    Date d'inscription: 11/09/2008

    Capacités en graphisme
    Capacité graph:
    9/10  (9/10)

    Re: Des ondes dans l'eau ou effet pavé dans la marre (débutant)

    Message par artkabis le Mer 29 Avr - 8:15

    Pour le reflet dynamique, c'est le même principe, seul le masque change, il faut faire des sortes de vagues (3-4) et les aligner horizontalement


    _________________
    J'me fais de la pub et na tongue

    megalex
    Ceinture jaune
    Ceinture jaune

    Nombre de messages: 343
    Age: 19
    Logiciels: photoshop cs3, flash cs4,flex builder 3,gimp,code::blocks, notepad++,et bien d'autres...
    Date d'inscription: 12/04/2009

    Re: Des ondes dans l'eau ou effet pavé dans la marre (débutant)

    Message par megalex le Mer 29 Avr - 11:41

    non tu n'as toujours pas compris, je voudrais que par exemple dans la partie haute de mon animation il y ait la date qui s'affiche, et que dans la partie en bas, il y ait aussi la date, mais inversée verticalement.

    artkabis
    Administrateur

    Nombre de messages: 4514
    Age: 28
    Logiciels: Photoshop CS4, Flash CS4, Indesign CS4, After Effects CS4, Illustrator CS4, Premier Pro CS4, Encore CS4, Flexbuilder 3, Papervision 3D, Camtasia, Captivate, InDesign, Swift 3d, Illustrator, Dreamweaver CS3, Blender, Swift 3D, WampServer.
    Date d'inscription: 11/09/2008

    Capacités en graphisme
    Capacité graph:
    9/10  (9/10)

    Re: Des ondes dans l'eau ou effet pavé dans la marre (débutant)

    Message par artkabis le Mer 29 Avr - 13:02

    Tu dois mettre ce script et créer un champ de texte dynamique avec comme nom d'occurrence "laDate" :

    Code:

    var instantT:Date = new Date();
    var jours:Array=new Array("Dimanche","Lundi","Mardi","Mercredi","Jeudi","Vendredi","Samedi");
    var mois:Array=new Array("Janvier","Février","Mars","Avril","Mai","Juin","Juillet","Août","Septembre","Octobre","Novembre","Décembre");

    laDate.text=jours[instantT.getDay()]+" "+instantT.getDate()+" "+mois[instantT.getMonth()]+" "+instantT.getFullYear();

    Mais pour ce qui concerne l'effet miroir sur du texte dynamique et bien je pense que tu va galérer, car dès que le texte subit une rotation, celui-ci devient invisible, regardes si tu fais :
    Code:
    laDate.rotation = 180;

    ou même si tu le fais manuellement, tu verras que ton texte n'est plus apparent, perso j'ai pas encore trouvé de soluc à ce bug...

    Par contre, la prochaine fois, créais un nouveau sujet, car on est dans la section tuto ici.


    _________________
    J'me fais de la pub et na tongue

    COLERE
    Newbie
    Newbie

    Nombre de messages: 22
    Age: 21
    Logiciels: Quelles logiciel utilisez vous?
    Date d'inscription: 01/11/2008

    Re: Des ondes dans l'eau ou effet pavé dans la marre (débutant)

    Message par COLERE le Dim 7 Juin - 17:09

    Merci , ce tuto m'as permis , après 2 mois de problème de reprendre Flash.

    Cr@zy
    Newbie
    Newbie

    Nombre de messages: 48
    Age: 32
    Logiciels: Photoshop & flash cs3
    Date d'inscription: 17/07/2009

    Re: Des ondes dans l'eau ou effet pavé dans la marre (débutant)

    Message par Cr@zy le Mer 16 Sep - 12:47

    je connaissais pas artkabis il et sympa merci pour ce tuto Wink

    artkabis
    Administrateur

    Nombre de messages: 4514
    Age: 28
    Logiciels: Photoshop CS4, Flash CS4, Indesign CS4, After Effects CS4, Illustrator CS4, Premier Pro CS4, Encore CS4, Flexbuilder 3, Papervision 3D, Camtasia, Captivate, InDesign, Swift 3d, Illustrator, Dreamweaver CS3, Blender, Swift 3D, WampServer.
    Date d'inscription: 11/09/2008

    Capacités en graphisme
    Capacité graph:
    9/10  (9/10)

    Re: Des ondes dans l'eau ou effet pavé dans la marre (débutant)

    Message par artkabis le Mer 16 Sep - 14:02

    Merci cr@zy


    _________________
    J'me fais de la pub et na tongue

    Manip
    Newbie
    Newbie

    Nombre de messages: 24
    Age: 36
    Logiciels: photoshop CS4, Illustrator CS4, FLash CS4, After Effects CS4, premiere CS4, Dreamweaver CS4, InDesign CS4, 3DS Max 2009, Zbrush 3, notepad++ :D ...
    Date d'inscription: 03/10/2009

    Capacités en graphisme
    Capacité graph:
    0/0  (0/0)

    Re: Des ondes dans l'eau ou effet pavé dans la marre (débutant)

    Message par Manip le Mer 7 Oct - 20:58

    Mais pour ce qui concerne l'effet miroir sur du texte dynamique et bien je pense que tu va galérer, car dès que le texte subit une rotation, celui-ci devient invisible, regardes si tu fais :

    Code:
    laDate.rotation = 180;


    ou même si tu le fais manuellement, tu verras que ton texte n'est plus apparent, perso j'ai pas encore trouvé de soluc à ce bug...


    je ne veut pas passer pour un pinailleur mais si tu fait une rotation de toute façon ton reflet ne sera pas bon car tu fait passer certe passer le haut en bas mais tu fait aussi passer la droite vers la gauche ce qui nuit grandement a la crédibilité le dit reflet....

    un
    Code:

    laDate.ScaleY =-1;


    serai certainement plus approprié ne croit tu pas?

    artkabis
    Administrateur

    Nombre de messages: 4514
    Age: 28
    Logiciels: Photoshop CS4, Flash CS4, Indesign CS4, After Effects CS4, Illustrator CS4, Premier Pro CS4, Encore CS4, Flexbuilder 3, Papervision 3D, Camtasia, Captivate, InDesign, Swift 3d, Illustrator, Dreamweaver CS3, Blender, Swift 3D, WampServer.
    Date d'inscription: 11/09/2008

    Capacités en graphisme
    Capacité graph:
    9/10  (9/10)

    Re: Des ondes dans l'eau ou effet pavé dans la marre (débutant)

    Message par artkabis le Mer 7 Oct - 21:57

    Ce n'était qu'un exemple pour dire qu'un texte ne peut subir aucune rotation ou torsion sans perdre son contenu. Après pour créer un véritable reflet sur un texte, je ne connais pas de véritable technique à part celle qui consiste à utiliser un conteneur de type MovieClip accompagné d'une classe de réflexion (il y en a pas mal sur la toile). Concernant le laDate.scaleY (on ne met pas de majuscule), tu as raison car pour avoir une véritable copie inversé on utilisera plus l'attribut scaleY, voici d'ailleurs un exemple concret:


    Dans cet exemple on est obligé de créer un dégradé pour que le reflet soit crédible, ce qui n'est pas le cas si on utilise une classe prévu à cet effet.

    Voici le code utilisé:
    Code:


    var instantT:Date = new Date();
    var jours:Array=new Array("Dimanche","Lundi","Mardi","Mercredi","Jeudi","Vendredi","Samedi");
    var mois:Array=new Array("Janvier","Février","Mars","Avril","Mai","Juin","Juillet","Août","Septembre","Octobre","Novembre","Décembre");

    laDate.text=jours[instantT.getDay()]+" "+instantT.getDate()+" "+mois[instantT.getMonth()]+" "+instantT.getFullYear();
    laDate2.text = String(laDate.text);
    laDate2.scaleY = -1


    Et le fichier source


    _________________
    J'me fais de la pub et na tongue

      La date/heure actuelle est Jeu 24 Mai - 18:45