edito
forum (21 057)
making of
preview newsletter
photoshop shortcuts
plan du site
b�tisier (24)
nouveaut�s (67)
mises � jour
banni�res (92)
liste de diffusion
infos l�gales
 


 

Devenez awares ! Et essayez de survivre.




aper�u
 

 

login | logout
g�rez votre profil
devenez membre
membres (2161)
anniversaires (796)
awares (349)
mickeys (343)
notables (83)
mod�rateurs (9)
votre vie priv�e

 

 

amis (22)
gfx fran�ais (58)
gfx autres (383)
pixel art (67)
ascii art (0)
paint/draw (97)
communaut�s (27)
portails gfx (16)
ressources (36)
flash (253)
3D (38)
java (2)

proposez votre site
derni�res entr�es
al�atoire (999)
quicklist
top 10










































999 sites
945 333 hits
 
 

� propos des tutos
tous les tutos (48)
rechercher un tuto

tutos al�atoires
686 236 hits

 

 

screen fonts
brushes
softwares
 
 
 

 

stats publiques
infocentres
r�f�rents (25373)
refs quicklist (25373)
visiteurs uniques
awards

21 284 504 hits
 





Voil� de quoi r�aliser un effet simple, esprit s�lection photoshop avec l'outil . Pour des GIF anim�s plus complexes, je vous conseille fortement d'autres logiciels tels que flash ou ulead gif animator mais dans ce cas pr�cis, photoshop reste un outil tr�s rapide. A vos palettes...



. 4x4 pixels � 1600%


 
 

Cr�ez un nouveau document de dimensions 4x4 pixels. Choisissez comme couleur de premier plan la couleur des pointill�s et d'arri�re plan la couleur du fond de votre GIF anim�. Dans cet exemple, respectivement orange pour les pointill�s et noir pour le fond. Double-cliquez sur l'outil de s�lection rectangulaire et cochez Fixed size dans la palette d'options avec 2x2 pixels comme dimensions. S�lectionnez un damier et remplissez d'orange ( Shift-Backspace ). Inversez la s�lection ( Ctrl-Shift-I ), inversez les couleurs ( X ) et remplissez de nouveau ( Shift-Backspace ). S�lectionnez tout ( Ctrl-A ) et d�finissez la s�lection en tant que motif de remplissage ( Edit > Define pattern ). Fermez le document sans sauver ( Ctrl-W ).

. cases de 2 pixels


 
 

Cr�ez un nouveau document ( Ctrl-N ) aux dimensions l�g�rement plus grandes que celle de votre ic�ne finale. Supposons par exemple que vous vouliez une ic�ne finale de dimensions 50x50 pixels. Choisissez alors 60x60 pixels. S�lectionnez tout ( Ctrl-A ) et remplissez avec le motif ( Shift-Backspace ) : contents use pattern. Copiez ( Ctrl-C ). Fermez le document sans sauver ( Ctrl-W ).





. frange de 1 pixel


 
 

Cr�ez un document aux dimensions de votre ic�ne ( 50x50 pixels ). Collez dans un nouveau calque ( Ctrl-V ). Toujours avec l'outil de s�lection rectangulaire , s�l�ctionnez la frange de l'ic�ne sur une largeur de 1 pixel.



N'utilisez pas la technique consistant � tout s�lectionner ( Ctrl-A ) puis � ne garder que la frange ( Select > Modify > Border ) : la s�lection ainsi cr��e sera anti-alias�e et plus d'un pixel sera s�lectionn�.



. masque de fusion


 
 

S�lectionnez le calque avec le damier dans la palette des calques et ajoutez-lui un masque de fusion avec la s�lection en cours ( Layer > Add layer mask > Reveal selection ). Dans la palette des calques cliquez sur le lien pour d�solidariser le calque de son masque. Cliquez sur l'ic�ne du calque pour le s�lectionner plut�t que son masque ( ic�ne plut�t que ). D�s�lectionnez ( Ctrl-D ).





. principe


 
 

Votre GIF anim� comporte 4 frames. Vous venez de r�aliser la premi�re. Pour la suite, �a va aller tr�s vite Dupliquez le calque (et son masque associ�) sur lequel vous avez travaill� jusqu'� maintenant. S�lectionnez l'outil ( V ) et d�placez d'un pixel vers la gauche et un vers le bas ( Ctrl-Gauche puis Ctrl-Bas ). Deuxi�me frame.

Dupliquez de nouveau le calque et d�placez d'un pixel vers la gauche et un pixel vers le haut ( V puis Ctrl-Gauche Ctrl-Haut ). Troisi�me frame. Dupliquez et d�placez d'un pixel vers le bas et un pixel vers la gauche. Quatri�me frame. Vous �tes toujours sous Photoshop et vous avez maintenant vos 4 frames d'animation dans 4 calques superpos�s. Lancez Imageready (Ctrl-Shift-M).


. g�n�ration du GIF anim�


 
 

Cachez vos 4 calques en cliquant sur l'oeil dans la palette des calques. Cr�ez 4 frames vierges (palette des animations). Dans chacune des 4 frames, rendez visible un calque, respectivement frame 1 / calque 1, frame 2 /calque 2... Attribuez une dur�e � chacun des 4 frames et exportez en GIF anim� (Ctrl-Shift-Alt-S).

piregwan
9793 visites











 

STELLAIRE, 07 01 2002 � 20:29

j'y suis arriv�... enfin apr�s plus de 3H de recherche... et donc je vois des imperfections dans le tutoriel...
alors, le moment ou on ne comprends plus ( pour moi ) c'est l'etape 5 ou il faut deplacer le cadres pour obtenir du mouvement ... et franchement je ne sais pas comment tu fais ca sous phototshop... deplacer , pas de probleme mais tu ne visionne pas d'animation sous photoshop donc moi je bloquais completement...
donc j'ai envoy� la premiere image finie ( premiere frame ) dans imageready et j'ai d�plac� dans image ready en cr�ant un nouveau calque d'animation pour chaque frame... et c'est pass� tout seul...
franchement soit je suis devenu d�bile, soit le tuto tel que tu le decrit est impossible soit y'a un truc que j'ai vraiment pas compris... paske je vois comment faire un gif a partir d'une seule image fixe ( une fois les couleurs ind�x�es,ca aplatit l'image donc ca ne fait plus qu'une seule image fixe )
donc voila... si je pouvais avoir une expliquation plus pouss�e ( niveau d�bile a d�bile trisomique ) histoire que je comprennes ce que j'ai pas compris


STELLAIRE (membre)
(St Claude)
allemandjudicael@hotmail.c...


STELLAIRE, 07 01 2002 � 18:09

heu... soyons simple:
j'y pige queudalle ! j'ai essay� et r�essay�... mais rien a faire j'obtiens toujours quelque chose ou c'est le cadre entier qui bouge , c'est tres laid et ca n'a aucun interet...
ceci dit ce que j'obtiens me semble parfaitement logique par rapport a ce que je fais... et franchement je crois que je fais ce qu'il y a d'ecrit .... donc je pense qu'il y a un petit endroit ( je ne sais pas ou... ) ou l'explication doit preter a confusion et qui change tout le resultat de l'affaire... enfin bon moi je me prends la tete dessus depuis plus de 2H ... bonne chance aux prochains


STELLAIRE (membre)
(St Claude)
allemandjudicael@hotmail.c...


defraagh, 28 12 2001 � 20:16

c'�tait pas sens� �tre une exclu ce tuto ? Pourtant : mop/tutoriaux/effect_ icone/effect_icone.ht m


defraagh (membre fanatiq...)
38 ans (Strasbourg)
defraagh@graphistory.com
http://gwash.straterole... [down]


piregwan, 15 11 2001 � 12:47

salut stefan

je vois ce que tu veux dire. c'est impossible si l'image que tu veux entour� d'un cadre anim� n'est pas de dimensions paires. par exemple, les vignettes des tutos font 50x50, les photos de membres 44x44. avec 45x45, tu ne pourras pas avoir de mouvement coh�rent.

j'espere que ca r�pondra a ton probleme.

a+


piregwan (agent mad fana...)
48 ans (chamb�ry, 73)
krakoukas@piregwan-genesis...
http://www.piregwan-gen...


stefan, 13 11 2001 � 14:06

Bonjour � tous. J'ai essay� de faire ce tuto et je dois dire que je bloque au niveau du principe. J'ai du mal � rendre coh�rent le mouvement des 4 frames... D'ailleurs le travail de Poupoux est "faux".Il a des incoh�rences de mouvement sur ses gifs anim�s! . Alors une petit explication me ferait pas de mal. stephanenvt@wanadoo.f r


stefan (membre)
54 ans
stephanenvt@wanadoo.fr


poupoux, 09 10 2001 � 20:38

Pour le coup je suis vraiment d'accord! c'est allucinant de dire des conneries pareil!! j'en reviens pas! pfff.. m'enfin breff... c'est la vie,,, il faut d'tout pour faire un monde. bon.. en ce qui concerne le tuto, moi je le trouve extr�mement bien fait et je viens de l'appliquer concr�tement � notre site. je suis vraiment tres fier et agr�ablement surpris de la rapidit� de l'aprentissage de ce tuto; en effet je les fais en une petite soir�e. Venez voir mon chef d'oeuvre ici http://www.4trelle... http://www.4trelle... , voilaaa... alors merci beaucoup pour votre explication et f�licitation pour ce site extra! bravo! ps: et @ mort les cr�tins !!!!!! ---jul---


poupoux (membre)
(Poitiers)
jul@4trelle.com
http://www.4trelle.com


( 16 commentaires )
<< 1 2 3 4 5 6 7 8 9 10 11 12 >>

 
















P I R E G W A N . C O M
interface & d�veloppement - piregwan 1998-2002




toutes les banni�res


g�n�r� en 0.086 secondes