Projet Génésis

Vous n'êtes pas identifié.

#1 06-08-2007 20:01:08

GhostOfShishko
Colonel
Date d'inscription: 03-08-2006
Messages: 1526
Site web

Tuto Photoshop: Faire un bouton Minimaliste

Faire un bouton Minimaliste:

On ouvre photoshop (normal...)
Nouveau doc -> 600*200 (on s'en fout de la taille en fait... c'est histoire d'avoir de la place... on rognera après)
On trace un rectangle de la forme de notre boutons, soit caré, soit long, soit large ... comme vous voulez.
(moi j'ai pris 150*30, vraiment inutile de prendre une zone de travail aussi grande :p)
On le remplis d'une couleur n'importe (on ajoutera des effets par dessus...)(j'ai pris un gris #9b9b9b)
(screen 1)

on ouvre les options de fusions (double clic sur le calque)
Incrustation en degradé: on clique sur le degradé,on selectionne en cliquant sur la "reglette" tout a gauche puis couleur: #121212
La reglette de droite: #575757
(screen 2)

On sort des options (pas oublier de valider... sinon ça servait a rien......)
on duplique notre calque 1 (selectionez le calque 1 puis CTRL + J pour dupliquer, ou clic droit -> dupliquer le calque...)
on ouvre les options de ce calque 1 copie:
on va dans incrustation en degadé et on change juste la reglette de droite par la couleur: #2a2a2a
(screen 3)

La ça va devenir SUPER TECHNIQUE...
On prend l'outil de selection de 1 px horizontal
(screen 4)

On zoom bien, jusqu'a voir les pixels (zoom a fond quoi...) et on selectionne la premiere rangée de pixel du calque 1 copie
et on appuie sur la touche SUPPR
(screen 5)

on fait pareil mais avec l'outil de selection 1 px vertical sur la premiere rangée a gauche
(screen 6)

Puis on fait un ctrl + clic sur l'image du calque 1 (pour selectioner la zone)
Tout en gardant la selection active: selection > modifier > dilater > 1px
(toujours avec la selection active...) fait un nouveau document que vous glissez tout en bas (en bas du calque 1 normalement...) et remplissez la selection (sur le calque 2 donc...) de noir.
(screen 6)

Donc voila. A Vous de jouer wink
moi ça donne ça:
http://img519.imageshack.us/img519/9571/signghostminimalistikez1.png
N'hesitez ni a poser des questions (pour les plans dragues c'est en pm...) ni vos creas wink
Bon courage.


Details:
Pour ma signature j'ai ajouté du texte avec la police hooge 05_54 (font speciale... sans aliasing et pour une taille unique de 8 px (ou multiple...)) et une ombre portée assez imposante ^^
J'ai ecouté "we will rise" de Arch enemy (donc 4 minutes pour faire le tutos...)


Anti Role Play ennuyeux et lourd
http://img519.imageshack.us/img519/9571/signghostminimalistikez1.png

Hors ligne

 

#2 06-08-2007 20:22:19

Kosh
Capitaine
Date d'inscription: 04-08-2006
Messages: 446

Re: Tuto Photoshop: Faire un bouton Minimaliste

GhostOfShishko a écrit:

On zoom bien, jusqu'a voir les pixels (zoom a fond quoi...) et on selectionne la premiere rangée de pixel du calque 1 copie
et on appuie sur la touche SUPPR
(screen 5)

quand j'appuie sur SUPR (= et Delete) .... sa efface la calque...

je fait comment icon_question


Edit moi: C'est bon ! c'est régler big_smile

apart sa, se serait bien si tu pouvais nous montrer comment on fait pour le text ^^

Dernière modification par bidoula (06-08-2007 21:01:13)


http://img223.imageshack.us/img223/5084/signkoshcopiemw7.jpg
http://easy-graph.1fr1.net/
modo avec modération?

Hors ligne

 

#3 06-08-2007 21:02:25

GhostOfShishko
Colonel
Date d'inscription: 03-08-2006
Messages: 1526
Site web

Re: Tuto Photoshop: Faire un bouton Minimaliste

t'as bien selectioné les pixels avec l'outil de selection?
essaye de faire edition > supprimer

sinon je vois 2 solutions:
selectionne la zone et gomme tout avec l'outil gomme...
Sinon tu met un masque de fusion... mais c'est plus compliqué...


Anti Role Play ennuyeux et lourd
http://img519.imageshack.us/img519/9571/signghostminimalistikez1.png

Hors ligne

 

#4 06-08-2007 21:03:45

GhostOfShishko
Colonel
Date d'inscription: 03-08-2006
Messages: 1526
Site web

Re: Tuto Photoshop: Faire un bouton Minimaliste

t'as bien selectioné les pixels avec l'outil de selection?
essaye de faire edition > supprimer

sinon je vois 2 solutions:
selectionne la zone et gomme tout avec l'outil gomme...
Sinon tu met un masque de fusion... mais c'est plus compliqué...

Edit:
Bah pour le texte tu prend ton clavier et ...


Anti Role Play ennuyeux et lourd
http://img519.imageshack.us/img519/9571/signghostminimalistikez1.png

Hors ligne

 

#5 06-08-2007 21:05:55

Kosh
Capitaine
Date d'inscription: 04-08-2006
Messages: 446

Re: Tuto Photoshop: Faire un bouton Minimaliste

ah...y a pas d'effet a mettre ?

et pour l'ombre porté du rectangle....faut le mettre a combien ?


http://img223.imageshack.us/img223/5084/signkoshcopiemw7.jpg
http://easy-graph.1fr1.net/
modo avec modération?

Hors ligne

 

#6 06-08-2007 21:34:05

GhostOfShishko
Colonel
Date d'inscription: 03-08-2006
Messages: 1526
Site web

Re: Tuto Photoshop: Faire un bouton Minimaliste

c'est au feeling... tu regarde...
Moi par exemple c'est un peu trop...


Anti Role Play ennuyeux et lourd
http://img519.imageshack.us/img519/9571/signghostminimalistikez1.png

Hors ligne

 

#7 06-08-2007 22:14:24

Xena
Banni
Date d'inscription: 06-08-2006
Messages: 53

Re: Tuto Photoshop: Faire un bouton Minimaliste

c est tout ? tu créé un tuto juste pour sa ?...


http://img524.imageshack.us/img524/1818/andromedetr7.jpg

Hors ligne

 

#8 07-08-2007 14:14:46

GhostOfShishko
Colonel
Date d'inscription: 03-08-2006
Messages: 1526
Site web

Re: Tuto Photoshop: Faire un bouton Minimaliste

ouai ^^
faudrai pas oublier que je suis faignant ^^


Anti Role Play ennuyeux et lourd
http://img519.imageshack.us/img519/9571/signghostminimalistikez1.png

Hors ligne

 

#9 07-08-2007 18:19:25

Xena
Banni
Date d'inscription: 06-08-2006
Messages: 53

Re: Tuto Photoshop: Faire un bouton Minimaliste

sa sert a rien de le dir sa ce vois


http://img524.imageshack.us/img524/1818/andromedetr7.jpg

Hors ligne

 

#10 12-09-2007 15:43:00

need_for_speed
Ancien Membre

Re: Tuto Photoshop: Faire un bouton Minimaliste

Bonjours GhostOfShishko, j'ai essayer de le faire avec The Gimp parce que je n'ai pas photoshop, j'ai donc adapter avec ce que je savais faire avec Gimp, tu peut me dire ce que tu en pense s'il te plait, voilà l'image:

http://img209.imageshack.us/img209/4224/needforspeedxb4.png

Voilà, je pense pas que tu connaisse Gimp donc dit moi les amélioration auquel tu pense, et j'essayerai de les faire avec ce que je sais.

EDIT: zut, je croyait que j'avais réussi a faire un fond transparent, dit moi déjà comme sa ce que tu en pense.

Dernière modification par need_for_speed (12-09-2007 15:44:31)

 

#11 12-09-2007 16:39:58

Oliv
Général d'armée
Date d'inscription: 22-05-2007
Messages: 4362

Re: Tuto Photoshop: Faire un bouton Minimaliste

j'aimerais savoir comment trafiquer photoshop si c'est possible de le dire ici.

Hors ligne

 

#12 12-09-2007 17:04:22

need_for_speed
Ancien Membre

Re: Tuto Photoshop: Faire un bouton Minimaliste

http://img103.imageshack.us/img103/2273/need2ap6.png

une autre sans l'ombre et en plus petit, tu trouve sa comment GhostOfShishko ?

 

#13 13-09-2007 00:11:14

GhostOfShishko
Colonel
Date d'inscription: 03-08-2006
Messages: 1526
Site web

Re: Tuto Photoshop: Faire un bouton Minimaliste

T'as bien reussi a adapaté a ce que je voit... mais la typo est pas super... le bouton est minimaliste et pixelisé... donc la font doit etre minimaliste et pixelisée aussi...


Anti Role Play ennuyeux et lourd
http://img519.imageshack.us/img519/9571/signghostminimalistikez1.png

Hors ligne

 

#14 13-09-2007 16:29:03

need_for_speed
Ancien Membre

Re: Tuto Photoshop: Faire un bouton Minimaliste

"mais la typo est pas super... le bouton est minimaliste et pixelisé... donc la font doit être minimaliste et pixelisée aussi..."

je comprend pas trop, tu peut expliquer s'il te plait ?

 

#15 13-09-2007 18:56:21

GhostOfShishko
Colonel
Date d'inscription: 03-08-2006
Messages: 1526
Site web

Re: Tuto Photoshop: Faire un bouton Minimaliste

bah... je peux pas plus expliquer que ça lol.
Faut que la typo aille avec le reste du bouton...


Anti Role Play ennuyeux et lourd
http://img519.imageshack.us/img519/9571/signghostminimalistikez1.png

Hors ligne

 

#16 13-09-2007 21:22:29

need_for_speed
Ancien Membre

Re: Tuto Photoshop: Faire un bouton Minimaliste

Je voit pas ce que tu veut dire par "typo" en fait, et pour un autodidacte t'en pense quoi ?

 

#17 14-09-2007 12:55:56

GhostOfShishko
Colonel
Date d'inscription: 03-08-2006
Messages: 1526
Site web

Re: Tuto Photoshop: Faire un bouton Minimaliste

bah la typo c'est l'ecriture.
Moi aussi je suis autodidacte... je pense pas qu'il y'ait d'ecole de photoshop wink
Pour l'instant c'est qu'un debut.... donc a toi de poster tes autres creas.


Anti Role Play ennuyeux et lourd
http://img519.imageshack.us/img519/9571/signghostminimalistikez1.png

Hors ligne

 

#18 14-09-2007 23:11:55

need_for_speed
Ancien Membre

Re: Tuto Photoshop: Faire un bouton Minimaliste

Re salut, je ferai peut-être une galerie de mes  créations quand j'en aurai le temps wink , ce n'est pas mon premier coup d'essay mais je doit dire que je suis plutôt fier de moi, après ce n'est que mon avis, je verrai pendant les vacances pour la galerie, A+ et je passerai de temps en temps si quelqu'un veut que je lui explique sous gimp comment faire smile .

EDIT:Mon seul probleme c'est que j'ai pas beaucoup d'imagination et que j'ai donc très peu d'idée, sa te vient tout seul toi ou tu cherche ?

Dernière modification par need_for_speed (14-09-2007 23:13:11)

 

#19 15-09-2007 14:01:46

GhostOfShishko
Colonel
Date d'inscription: 03-08-2006
Messages: 1526
Site web

Re: Tuto Photoshop: Faire un bouton Minimaliste

bah je cherche, j'ouvre pas photoshop comme daemon... je reflechit un peu, puis une fois que je voit bien tout le projet , je me lance.


Anti Role Play ennuyeux et lourd
http://img519.imageshack.us/img519/9571/signghostminimalistikez1.png

Hors ligne

 

#20 15-09-2007 18:53:56

need_for_speed
Ancien Membre

Re: Tuto Photoshop: Faire un bouton Minimaliste

Je vient d'avoir une super bonne idée, je la mettrai surement en signature si sa me plait, sa ve ressemble en bouton minimaliste mais en un peu transparent et tout, enfin je voit ce que je veut dire (c'est le en regardant le rugby que j'ai eu l'idée, je te tiens au courant, merci de tes conseils, c'est sympa.

 

#21 16-09-2007 15:09:42

viror33
Major
Date d'inscription: 08-09-2006
Messages: 120

Re: Tuto Photoshop: Faire un bouton Minimaliste

voila moi j'ai fait sa avec photofiltre studio
http://i21.servimg.com/u/f21/11/23/79/67/bouton10.jpg
alor ghost ??

PS oui je ses je nes pas mit un fond transparent

Dernière modification par viror33 (16-09-2007 15:15:29)


http://i23.servimg.com/u/f23/11/23/79/67/viror310.jpg

Hors ligne

 

#22 16-09-2007 17:08:59

need_for_speed
Ancien Membre

Re: Tuto Photoshop: Faire un bouton Minimaliste

J'ai fini la bannière, Vous la trouvée comment, peut être un peu grande, je pourrai la redimmensionnée mais avant j'aimerai avoir votre avis, l'avatar va arriver.

EDIT: je l'ai redimenssionnée, est-ce que c'est toujours trop grand ?

Dernière modification par need_for_speed (16-09-2007 17:13:06)

 

#23 16-09-2007 21:27:17

GhostOfShishko
Colonel
Date d'inscription: 03-08-2006
Messages: 1526
Site web

Re: Tuto Photoshop: Faire un bouton Minimaliste

toujours grand.
Mais regarde: la marge entre le texte et la droite/gauche est de 10px (par exemple...) alors que la marge entre le haut/bas fait 10 a 20 fois plus...
essaye de reduire pour que les marge soit toute egale... et vu que le bouton est "carré" essaye de trouver une police "carrée"...

pareil pour viror... la font est pas super.


Anti Role Play ennuyeux et lourd
http://img519.imageshack.us/img519/9571/signghostminimalistikez1.png

Hors ligne

 

#24 17-09-2007 10:48:57

viror33
Major
Date d'inscription: 08-09-2006
Messages: 120

Re: Tuto Photoshop: Faire un bouton Minimaliste

ok merci ghost
need ces moi ou tu a mit une petit voiture dans la forme ?


http://i23.servimg.com/u/f23/11/23/79/67/viror310.jpg

Hors ligne

 

#25 17-09-2007 16:50:33

Black Hole
Major
Date d'inscription: 05-02-2007
Messages: 137

Re: Tuto Photoshop: Faire un bouton Minimaliste

nnon tu ne reve pas il y a une voiture en fond big_smile

Hors ligne

 

Pied de page des forums

Propulsé par PunBB
© Copyright 2002–2005 Rickard Andersson
Traduction par punbb.fr