Tutoriel


Ça ne sert à rien, d’essayer de me cacher des choses. Tel Varys, j’ai des yeux partout, je sais ce que vous avez pris au petit-déjeuner ce matin et ce que vous avez lu avant de vous endormir hier. C’est comme ça, c’est mon boulot.

Devant le désespoir des élèves face à l’épreuve de graphisme de la Fête de l’Aigle, j’ai froncé les sourcils. En remarquant que tout le monde évitait de m’envoyer une bannière pour le défi du « On s’en fish », j’ai eu un doute affreux. En comptant le nombre d’images demandées dans la boutique d’entraide, j’ai vraiment commencé à m’inquiéter. Et en comprenant que certains d’entre vous refusaient d’envoyer leur devoir sans avoir reçu l’aide d’un graphiste, je me suis définitivement mise à pleurer. Façon de parler bien sûr, je ne pleure jamais.

Tout ça pour dire que j’ai bien compris le message, vous ne savez pas grapher. Comme beaucoup de gens hein, en fait. Mais comme je trouve ça un peu triste, j’ai décidé de vous organiser des tutoriels de graphisme, pour vous apprendre à vous débrouiller un petit peu par vous-mêmes. Attendez un peu avant de vous enfuir en courant, je vous promets de vraiment y aller doucement et de tout vous expliquer en détails et en images.

Parce que franchement, ne pas pouvoir participer à un jeu ou attendre pendant une semaine la bannière d’un devoir déjà terminé, ça doit être frustrant non ? moi, ça me frustrerait. Avouez, vous aspirez à davantage d’autonomie et vous aimeriez bien pouvoir vous débrouiller tous seuls.

Enfin bref, je fais un tutoriel. Je vous expliquerai des choses extrêmement simples pour arriver à du plus compliqué, en commençant par la base de la base pour que PERSONNE ne puisse me dire que c’est trop difficile. Même pas ceux qui n’ont jamais touché à Paint. 

⍟ ⍟ ⍟

Recadrer une image et ajouter un contour.


Ça devrait pouvoir vous suffire, parce qu’au pire le texte vous pouvez l’ajouter à la main. Si je vous jure, c’est le principe d’un site RPG, on peut mettre tout le texte qu’on veut très simplement, et le BBcode titre est votre ami.

On commence par le commencement parce que c’est mieux, et on se procure un logiciel de graphisme. Même si je préfère Photoshop, je ferai mes tutoriels sur Gimp, parce que Gimp est accessible à tout le monde et gratuitement. Liens de téléchargements ci-dessous : 

Pour Macintosh 
Pour Windows 

Téléchargez et installez le logiciel, ça ne devrait pas être trop difficile. 

Imaginons que vous désiriez faire une bannière d’Astronomie, par exemple. Bien, alors ouvrez Gimp, et sélectionnez Fichier => Ouvrir.
 


Votre image s’ouvre dans Gimp, et vous vous retrouvez devant ceci :
 



On va commencer par recadrer l’image pour qu’elle puisse entrer dans votre devoir hein. Sur un topic, une image ne peut pas dépasser 400 px de largeur (pixel, unité de mesure qui représente la taille de votre image), et sans alignement. Dans un devoir par contre, vous pouvez aller jusque 550 px de large. Sélectionnez donc Image => Échelle et aille de l’image
 



Une petite fenêtre va s’ouvrir, il vous suffit d’aller dans l’onglet « Largeur », de vérifier que l’unité de mesure est bien en pixel (px) et pas en centimètres, et mettez« 550 » comme valeur. Comme ça : 
 



Cliquez ensuite sur « Échelle », votre image est à présent recadrée. On va commencer par ajouter un petit cadre tout simple, la prochaine fois je vous apprendrai à faire des formes. Mais je préfère commencer doucement pour ne pas vous perdre en route. À droite de votre image, vous avez une fenêtre portant le nom de « Calques - Motifs ». Créer une image dans un logiciel de retouche, c’est un peu comme superposer différentes couches de papiers. Les calques représentent ces couches de papiers, il est donc important de créer toujours un nouveau calque pour ajouter quelque chose à votre création. Du coup pour faire le cadre, on va créer un nouveau calque.
 


 


 


Appuyez sur « Valider » en vérifiant que le type de remplissage est bien en transparence, comme sur le petit screen précédent. C’est dans ce calque qu’on va mettre le calque, vérifiez donc que vous avez bien cliqué dessus avant de faire quoique ce soit. Le calque doit aussi être positionné au-dessus de votre image de base, sinon il ne se verra pas (pensez vraiment à des couches de papier posées les unes sur les autres, c’est pareil).

On va aller dans l’onglet « Sélection » et appuyer sur « Tout ».
 


Ensuite, on réduit la sélection de deux pixels comme ceci : 
 


 


Et on clique sur valider. On inverse la sélection de cette façon :
 


Ensuite, on sélectionne le pot de peinture, et on clique sur le cadre sélectionné sur l’image. Vous devrez peut-être zoomer pour mieux le voir.
 



Tralala, en cliquant, l’espace se remplit de la couleur de votre choix. Vous n’avez plus qu’à exporter votre image.
 



À vous ensuite d’ajouter un texte avec un titre en utilisant les BBcodes, et avec une couleur appropriée pour rappeler celle de l’image, ça devrait être déjà bien joli. Cette méthode fonctionne aussi pour les avatars.
 

Astronomie : Introduction


Maintenant, si vous avez des bannières toutes simples à demander, vous pouvez les faire par vous-mêmes, ce qui je trouve est tout à fait extraordinaire. La prochaine fois, on augmente le niveau de difficulté pour apprendre à faire une forme et à ajouter du texte. D’ici-là, j’espère bien que vous vous entraînerez sur vos devoirs.

Si vous avez la moindre question au sujet de ce tutoriel, n’hésitez surtout pas à me la communiquer par MP, je suis là pour ça.
 

Rédigé et illustré par Serenity Railgun

Commentaires

1. Le vendredi 1 mai 2015, 15:54 par Ambre Lincoln

Franchement, je trouve l'idée de faire des tutos de graphismes super ! Dès que je pourrais, je téléchargerais Gimp pour essayer. J'attends le prochain avec impatience ^^ Merci Serenity !

2. Le vendredi 1 mai 2015, 16:04 par oneil

Vraiment très cool cette idée, ça tombe bien, j'ai des bannières d'astro à faire, je vais tenter par moi même on verra ce que cela va donner.

Merci

3. Le vendredi 1 mai 2015, 23:06 par Lewis

TOUS A COUVERT, UTILISATION D'UN ORDINATEUR "POMME" EN VUE !

Plus sérieusement, bonne idée le tuto, je pense que ça aidera pas mal de monde.

4. Le samedi 2 mai 2015, 10:15 par Speedy

Ça c'est une idée qui déchire *o*
Puis vu comment c'est tout détaillé et expliqué, je pense que même les galériens en graphisme comme moi devraient s'en sortir ! Mercii.

5. Le samedi 2 mai 2015, 14:09 par Kiwi-Sensei

Serenity = appleaddict WARNING.
Je trouve que c'est une super bonne idée de faire des tutos et en plus, c'est vraiment super clair, j'ai TOUT compris. Et ça c'est génial. Un jour, j'arriverai à grapher comme toi, Tity.

6. Le samedi 2 mai 2015, 15:28 par Arya Faith

Cette nouvelle rubrique est mon messie. Serenity, veut-tu m'épouser ? Je songe de plus en plus sérieusement à te vouer un culte, tu sais.

Bon, même si je savais déjà recadrer une image et mettre un contour, ça peut être utile pour les plus débutants. Par contre, j'ai l'impression que c'est mille fois plus simple avec PhotoFiltre... Y'a juste à faire Filtre => Encadrement => Cadre simple et puis voilà, alors que là y'a carrément un calque à créer et tout le tralala qui va avec...

Bref, c'est une super idée ! Je crois que ça va sauver la vie d'oneil, qui vit pratiquement sur le topic d'entraide. xD

7. Le vendredi 8 mai 2015, 19:26 par Amestia

L'idée des tutos est vraiment bien pensée ! Merci Tity ! :3
Pour les pauvres gens comme moi qui sont des buses en graphisme ça va leur sauver la mise pour les devoirs ;)

8. Le samedi 16 mai 2015, 16:34 par Gray

On peut avoir un abonnement ou une newsletter pour tous les futurs Tutos ? Cela m'aiderait grandement !

9. Le mardi 26 mai 2015, 20:04 par Angele

Haha, on sent le désespoir derrière ce tutoriel... non ? =°
En tout cas c'est une bonne idée, ça me fera peut-être gagner des points supplémentaires par rapport à mes bannières toutes moches :D