communauté francophone de joueurs sims
 
AccueilAccueil  Le site  Chaine You Tube  S'enregistrerS'enregistrer  ConnexionConnexion  Dernières imagesDernières images  RechercherRechercher  
Le deal à ne pas rater :
Fnac : 2 Funko Pop achetées : le 3ème offert (large sélection de ...
Voir le deal

Partagez
 

 [Apprenti] [Photofiltre 7] Créer un bouton Web

Voir le sujet précédent Voir le sujet suivant Aller en bas 
AuteurMessage
Grand artiste du pinceau
Natsynchro
Natsynchro
Grand artiste du pinceau
Féminin Date d'inscription : 09/11/2012
Age : 30
Localisation : Au pays imaginaire ~

[Apprenti] [Photofiltre 7] Créer un bouton Web Empty
MessageSujet: [Apprenti] [Photofiltre 7] Créer un bouton Web   [Apprenti] [Photofiltre 7] Créer un bouton Web EmptyMar 08 Avr 2014, 19:51

[Apprenti] [Photofiltre 7] Créer un bouton Web Iccl3gec1gr9f5czg

Bonjour à tous !

Aujourd'hui, nous allons apprendre à créer un bouton de forme ovale, que vous pourrez facilement intégrer par la suite sur vos sites internets, signatures, etc...

Ce tutoriel vous guidera pas à pas dans la création de votre bouton, mais vous devez quand même maîtriser un minimum votre logiciel Wink

Donc c'est parti !

I. Base
II. Éclaircissement
III. Assombrissement

--------------------------------

Créer un bouton avec GIMP
Créer un bouton avec Photoshop


Dernière édition par Natsynchro le Sam 07 Nov 2015, 21:57, édité 9 fois
Revenir en haut Aller en bas
http://le-naufrage-mysterieux.blogspot.fr
Grand artiste du pinceau
Natsynchro
Natsynchro
Grand artiste du pinceau
Féminin Date d'inscription : 09/11/2012
Age : 30
Localisation : Au pays imaginaire ~

[Apprenti] [Photofiltre 7] Créer un bouton Web Empty
MessageSujet: Re: [Apprenti] [Photofiltre 7] Créer un bouton Web   [Apprenti] [Photofiltre 7] Créer un bouton Web EmptyMar 08 Avr 2014, 20:02

I. La base

On commence par ouvrir un nouveau fichier, de dimensions 640*400 afin de pouvoir travailler sur une taille assez large, et être à l'aise dans nos manipulations. Nous devons tout d'abord créer la forme de notre bouton, dans mon exemple, il sera ovale car c'est une forme un peu plus complexe qu'un rond ou qu'un rectangle.

Créons un nouveau calque (Calque → Nouveau → Vierge) que nous appellerons Base (clic droit → renommer le calque), et prenons l'outil de sélection ellipse.

[Apprenti] [Photofiltre 7] Créer un bouton Web Nrl6ca4flzdovplzg

Nous allons ensuite créer un rond parfait en maintenant la touche Maj enfoncée. Une fois que cela est fait, remplissez la sélection de la couleur de base de votre bouton (clic droit et Contour et remplissage).

[Apprenti] [Photofiltre 7] Créer un bouton Web Laza9gcrnnaifdczg

Grâce aux touches fléchées de votre clavier, vous allez maintenant déplacer la sélection en appuyant sur la flèche de droite : éloignez la sélection ronde jusqu'à ce qu'elle vous paraisse suffisamment éloignée pour créer un bouton assez large mais pas trop. Ainsi, les extrémités du bouton seront parfaitement parallèles et à la même hauteur.

[Apprenti] [Photofiltre 7] Créer un bouton Web 51wum45ukbywi32zg

Remplissez à nouveau la sélection avec votre couleur de base.

Reprenez ensuite la sélection rectangle, nous allons maintenant remplir l'espace vide entre les deux cercles. Pour cela, il vous suffit de commencer environ au milieu du premier cercle, en englobant le premier pixel (n'hésitez pas à zoomer pour bien voir ce que vous allez sélectionner).

Une fois que cela vous paraît bon, remplissez à nouveau de votre couleur de base : ça y est, la base du bouton est prête !

[Apprenti] [Photofiltre 7] Créer un bouton Web 82k7yhk2yj543k4zg


Dernière édition par Natsynchro le Sam 07 Nov 2015, 21:58, édité 3 fois
Revenir en haut Aller en bas
http://le-naufrage-mysterieux.blogspot.fr
Grand artiste du pinceau
Natsynchro
Natsynchro
Grand artiste du pinceau
Féminin Date d'inscription : 09/11/2012
Age : 30
Localisation : Au pays imaginaire ~

[Apprenti] [Photofiltre 7] Créer un bouton Web Empty
MessageSujet: Re: [Apprenti] [Photofiltre 7] Créer un bouton Web   [Apprenti] [Photofiltre 7] Créer un bouton Web EmptyMar 08 Avr 2014, 20:05

II. L'éclaircissement

Il faut à présent que nous donnions un certain relief à notre bouton, qui est pour le moment bien plat.

Commençons par créer un nouveau calque que nous allons appeler Éclaircissement. Il nous faut ensuite récupérer la sélection de la base du bouton : pour cela, placez-vous sur le calque Base, puis Sélection → sélectionner le calque.

Replacez-vous sur le calque Eclaircissement.

Grâce à l'outil pipette, récupérez la couleur de base. Nous allons ensuite aller dans la palette de couleurs (double-cliquez sur les carrés de couleur tout en haut), afin de choisir une teinte plus claire.

[Apprenti] [Photofiltre 7] Créer un bouton Web Ncin7l8w8shzumazg

Avec un pinceau rond (voir les réglages sur l'image), vous allez peindre très légèrement la gauche ainsi que le haut de votre bouton, comme ceci :

[Apprenti] [Photofiltre 7] Créer un bouton Web 136rm6g6m7tgu1yzg

Répétez cette dernière opération plusieurs fois, en vous rapprochant de plus en plus du bord de la sélection, et bien entendu avec une couleur de plus en plus claire. Vous devriez obtenir un joli dégradé de couleurs de cette façon.

[Apprenti] [Photofiltre 7] Créer un bouton Web Njod6b4ezr7i3dzzg

On va terminer par peaufiner notre éclaircissement, parce que nous ne sommes pas tous des peintres, et que notre dégradé n'est pas forcément droit, lisse et beau comme on le voudrait !

On va appliquer un flou qui va nous permettre d'uniformiser notre dégradé.
Filtres → Atténuation → Encore plus flou

Je choisis un rayon de 8. C'est terminé pour l'éclaircissement !

[Apprenti] [Photofiltre 7] Créer un bouton Web U4508kndamfgzimzg


Dernière édition par Natsynchro le Sam 07 Nov 2015, 21:59, édité 2 fois
Revenir en haut Aller en bas
http://le-naufrage-mysterieux.blogspot.fr
Grand artiste du pinceau
Natsynchro
Natsynchro
Grand artiste du pinceau
Féminin Date d'inscription : 09/11/2012
Age : 30
Localisation : Au pays imaginaire ~

[Apprenti] [Photofiltre 7] Créer un bouton Web Empty
MessageSujet: Re: [Apprenti] [Photofiltre 7] Créer un bouton Web   [Apprenti] [Photofiltre 7] Créer un bouton Web EmptyMar 08 Avr 2014, 20:07

III. L'assombrissement

Je pense que vous avez compris ce que nous allons faire à présent ?

Exact, nous allons assombrir le bas et le côté droit de notre bouton ! Si vous avez réussi à arriver jusque-là, cela ne devrait vous poser aucun souci particulier.

Créez votre nouveau calque, que vous renommez Assombrissement.

Récupérez à nouveau la sélection du bouton (en vous plaçant sur le calque approprié puis Sélection → sélectionner le calque).

Récupérez la couleur de base à la pipette, et grâce à la palette de couleurs, commencez à peindre l'ombrage en bas du bouton, toujours avec un pinceau rond.

[Apprenti] [Photofiltre 7] Créer un bouton Web Ln3s85v5aa29i5szg

Continuez avec des teintes de plus en plus sombres et de plus en plus proches du bord de la sélection. Une fois que votre dégradé vous satisfait, appliquez un flou de rayon 8.

[Apprenti] [Photofiltre 7] Créer un bouton Web Kj3no6976p79nq5zg

Et voilà ! Il ne vous reste plus qu'à recadrer votre bouton, à mettre le calque Fond en invisible (clic droit sur la calque : cliquez sur Visible), à y coller votre texte ou votre image, redimensionner, et le tour est joué !

N'oubliez pas d'enregistrer en format PNG !

[Apprenti] [Photofiltre 7] Créer un bouton Web 5i4apymisvcfsjszg

A vous d'ouvrir votre logiciel à présent, et à vous de créer de jolis boutons de toutes sortes !


   

MODE D'EMPLOI

N'hésitez pas à remercier l'auteur de ce tutoriel ou à faire partager votre expérience personnelle. Si vous avez créé quelque chose en suivant le tuto pourquoi pas la poster afin de la montrer à l'auteur

   -----------------------------------------

   Pour d'éventuelles questions, c'est par ici et si vous souhaitez en apprendre plus sur le sujet, rendez-vous dans la salle travaux pratiques

Bonne journée



Dernière édition par Natsynchro le Sam 07 Nov 2015, 21:57, édité 1 fois
Revenir en haut Aller en bas
http://le-naufrage-mysterieux.blogspot.fr
Maître du Jeu
Goby03
Goby03
Maître du Jeu
Masculin Date d'inscription : 21/08/2012
Age : 26
Localisation : quelque part en auvergne

[Apprenti] [Photofiltre 7] Créer un bouton Web Empty
MessageSujet: Re: [Apprenti] [Photofiltre 7] Créer un bouton Web   [Apprenti] [Photofiltre 7] Créer un bouton Web EmptyMar 08 Avr 2014, 20:34

Merci Nat ! Smile
Revenir en haut Aller en bas
http://plaisirdessims.blogspot.fr/
Grand artiste du pinceau
Maripiou
Maripiou
Grand artiste du pinceau
Féminin Date d'inscription : 29/01/2011
Age : 36
Localisation : Au Sud

[Apprenti] [Photofiltre 7] Créer un bouton Web Empty
MessageSujet: Re: [Apprenti] [Photofiltre 7] Créer un bouton Web   [Apprenti] [Photofiltre 7] Créer un bouton Web EmptyMar 08 Avr 2014, 21:38

Merci pour le tuto. Smile
Revenir en haut Aller en bas
http://maripiou.jimdo.com/
Admin
Delise
Delise
Admin
Féminin Date d'inscription : 05/04/2012
Age : 45
Localisation : Lyon

[Apprenti] [Photofiltre 7] Créer un bouton Web Empty
MessageSujet: Re: [Apprenti] [Photofiltre 7] Créer un bouton Web   [Apprenti] [Photofiltre 7] Créer un bouton Web EmptyMar 08 Avr 2014, 22:05

Merci !
Revenir en haut Aller en bas
Grand artiste du pinceau
Katnat
Katnat
Grand artiste du pinceau
Féminin Date d'inscription : 31/05/2012
Age : 55

[Apprenti] [Photofiltre 7] Créer un bouton Web Empty
MessageSujet: Re: [Apprenti] [Photofiltre 7] Créer un bouton Web   [Apprenti] [Photofiltre 7] Créer un bouton Web EmptyVen 11 Juil 2014, 22:59

Merci Nats pour ce tuto!

Voici mon bouton, faut que j'apprenne à faire des beaux textes maintenant  Smile 
Spoiler:


Dernière édition par katnat le Mar 22 Juil 2014, 11:36, édité 1 fois
Revenir en haut Aller en bas
Contenu sponsorisé


[Apprenti] [Photofiltre 7] Créer un bouton Web Empty
MessageSujet: Re: [Apprenti] [Photofiltre 7] Créer un bouton Web   [Apprenti] [Photofiltre 7] Créer un bouton Web Empty

Revenir en haut Aller en bas
 
[Apprenti] [Photofiltre 7] Créer un bouton Web
Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1
 Sujets similaires
-
» [Apprenti] [Photofiltre 6 et antérieur] Créer un brush ligne lumineux.
» [Apprenti] [Photofiltre Studio] Créer une signature à base de render
» [Apprenti] [Photofiltre 7] Créer une signature simple
» [Apprenti] [Photofiltre 6 et antérieur] Créer un texte qui défile (en image gif)
» [Apprenti] [Photofiltre 6 et antérieur] Créer l'ombre portée d'un texte

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Sims Artists :: Apprentissage :: Graphisme :: PhotoFiltre-
Sauter vers: