• Tutoriel Thème

     

    Ohayo mes p'tits poireaux !

    Aujourd'hui, c'est un tutoriel un peu spécial que je vous propose, puisque c'est un tutoriel pour apprendre à faire un thème. Ce tutoriel s'adresse donc, pour la partie "création des différents éléments" à des grapheurs plutôt débutants, mais j'encourage aussi les confirmés à me communiquer leur rendu de la partie "header", qui sera donc comme un outcome.

     

    Partie 1 : Le Header

    OUTCOME

     Tutoriel Thème

     

    RESOURCES

     Textures 12 - 3

    Brush

    Mask

     

    TUTORIEL

    Étape 1

    Ouvrez un document de la taille que vous voulez sur la surface de travail ( j'ai fait un 1100x500 ), puis prenez le render. Copiez-collez-le de façon à remplir toute la surface de la création, puis fusionnez tous les calques.

     

    Ensuite, créez une copie de ce calque. Pour le calque du dessus, allez dans Filtre -> Artistique -> Pointillisme et mettez le niveau maximum. Pour le second filtre, prenez l'outil "Doigt" avec un rayon de 100 et smudgez.

     

    Il ne vous reste plus qu'à mettre le calque en Pointillisme en mode maximum et de fusionner les deux calques.

    Tutoriel Thème

     

    Étape 2

    Prenez la première texture et mettez-là sur votre fond en mode Superposition. Prenez la seconde texture et mettez-là en mode Produit à 80% d'opacité.

    Mettez le brush au centre de la création en mode Maximum, puis prenez ensuite le render. Mettez-le au centre et donnez-lui une ombre d'une couleur sombre, ci-possible provenant directement du render. Faites un click droit, allez dans Options > Ombre Portée, laissez les réglages mais mettez à 100% d'opacité et en mode plat.

    Enfin, prenez la dernière texture et mettez-là en mode Maximum.

    Tutoriel Thème

     

    Étape 3

    Après quelques réglages, on va se pencher sur la question du cadre. Pour ce tuto, j'ai décidé de vous montrer comment donner à votre créa' la forme d'un mask de votre choix.

    Sur la barre de tâches de votre logiciel Photofiltre, vous allez trouver cette icône : Tutoriel Thème

    Clickez dessus, puis allez chercher le mask que vous aurez au préalable enregistré dans vos documents. Mettez en mode transparence et cochez "Étirer le masque", et voilà !

    Si vous voulez, vous pouvez y ajouter une ombre pour lui donner plus de relief.

    Tutoriel Thème

    Votre Header est fini, il ne reste plus qu'à ajouter la typo avec le nom de votre blog et voilà !

     

    Partie 2 : Présentation et Statistiques

    OUTCOMES

    Tutoriel Thème   Tutoriel Thème

     

    TUTORIEL

    Étape 1

    Prenez votre header et sélectionnez une partie de la création que vous souhaitez transformer en Présentation ou Statistiques. Cela peut être la même image comme une différente, mais pour ce tuto je vais utiliser la même image.

    Attention, faites bien en sorte que la sélection soit carrée ! Une fois la partie sélectionnée, collez-là sur le plan de travail et redimensionnez-là à 100x100, comme une icon.

    Tutoriel Thème

     

    Étape 2

    Allez dans Filtre > Encadrement > Cadre simple et mettez un cadre blanc avec une épaisseur de 1. Vous pouvez aussi utiliser un template ou un autre cadre.

    Une fois ce cadre mis, vous allez sélectionnez un petit rectangle qui fera toute la longueur de l'icon mais qui aura une faible largeur.

    Tutoriel Thème

     

    Étape 3

    Enfin, copiez-collez cette image sur votre plan de travail pour l'avoir en deux exemplaires. Ensuite, faites un effet miroir sur l'autre icon.

    Vous pouvez maintenant écrire "Présentation" et "Statistiques" !

    Tutoriel Thème   Tutoriel Thème

     

    Partie 3 : Fond de page et de contenu

    OUTCOMES

    Tutoriel Thème   Tutoriel Thème

     

    TUTORIEL

    Étape 1

    Pour le fond de page, il faut généralement prendre un pattern. Vous pouvez en trouver des milliards sur Google Images, mais pour le coup je vais vous apprendre à en faire un à partir d'une création.

    Clickez sur ce lien pour savoir comment faire : www

     

    Étape 2

    Pour le fond de contenu, il faut généralement prendre un fond de couleur unie transparent.

    Il vous suffit de sélectionner à l'aide de la pipette une couleur du header que vous aimez bien et que vous estimez assez agréable pour aller avec votre pattern, puis vous créez un nouveau document transparent de taille 100x100.

    Allez dans Calque > Nouveau > Vierge et cliquez sur "Transparence Automatique". Vous pouvez maintenant remplir ce nouveau calque de la couleur que vous avez choisie !

    Mettez enfin ce nouveau calque avec un pourcentage d'opacité. Plus il tendra vers les 100%, moins il sera transparent et vice-versa.

     

    Partie 4 : La mise en page et le codage

    Pour cette partie, vous êtes totalement libres ! Vous pouvez simplement modifier les paramètres déjà existants de votre blog en allant dans "Modifier le thème", ou alors le rendre différent en y appliquant divers codes CSS !

    Je vous met le lien d'un très bon site : www

    Évitez cependant de mettre trop de codes, cela pourrait faire buguer le blog, le chargement de la page pourrait être très long ou tout simplement un rendu disgracieux...

     

    Et voilà ! J'espère que ce tutoriel vous sera utile et n'oubliez pas de me créditer si votre thème est fait à partir de mon tutoriel !

    Kissouille mes p'tits poireaux ♥

     

    RENDUS DE HEADERS

    Eden Keehl

    Crystal

    l

    Pandora.

    l

    Otter_

    l

    Cricri200°

    ù

     

     


  • Commentaires

    1
    Samedi 21 Avril 2018 à 19:58

    Tu pourrais rajouter aussi le fait de ne pas trop mettre de CSS parce que sinon ça peut bug, mettre longtemps pour charger la page ou faire très moche ;)

    2
    Samedi 21 Avril 2018 à 20:53

    Super tuto, il devrait bien aider o/

    En tous cas voilà mon rendu : www

    3
    Samedi 21 Avril 2018 à 20:55

    @Pandora : Tu as raison, je le rajoute ;)

    @Eden : C'est super mignon °^°

    4
    Lundi 23 Avril 2018 à 09:27

    Owiiiii un nouveau tuto de ma waifu ♥

    Wallah mon outcome o/ www

    J'ai pas mis le titre de mon blog dessus parce que ça collait pas ptdr x'))

    5
    Lundi 23 Avril 2018 à 09:29

    C'est super beau * ^^ *

    6
    Lundi 23 Avril 2018 à 09:37

    Merciii ; v ; Le tien aussi est super beau ; u ;

    7
    Lundi 23 Avril 2018 à 09:40

    De rien, et merci ; w ;

    8
    Lundi 23 Avril 2018 à 18:38

    OWIII WAIFU

    J'aime ton outcome ♥

    9
    Lundi 23 Avril 2018 à 21:38

    Au fait, mon résultat pour le Header c:

    10
    Mardi 24 Avril 2018 à 13:58

    Super ! :D

    11
    Mercredi 25 Avril 2018 à 02:46

    WWW

    Voici mon rendu ! (il est très laid mais, il y a pas tout sur mon photophiltre ! :o Mais pour ce header, qui est pour Reby Macgarden, j'y ai mit beaucoup de cœur. )

    12
    Jeudi 26 Avril 2018 à 13:45

    J'arrive pas à voir ton rendu :/

    Le tuto est fait sur Photofiltre Studio X, mais si tu prend Photofiltre 7 ( gratuit ) ça marche aussi !

    13
    Jeudi 3 Mai 2018 à 22:53

    De toute façon je vzit le refaire ! C'est un thème pour Reby Macgarden ! Et pour Photophiltre 7 je pense pas que je vait télécharger... Mais bon ! Je vais le refaire >o<

    14
    Dimanche 15 Juillet 2018 à 10:15

    j'essayerais de le faire

     

    13 eme coms

    15
    Jeudi 16 Août 2018 à 19:41

      

    voici mon rendu :3

    16
    Jeudi 16 Août 2018 à 21:15

    C'est super joli ! J'aime beaucoup ^w^

    17
    Mercredi 3 Octobre 2018 à 01:44
    18
    Mercredi 3 Octobre 2018 à 01:45

    voila mon rendu c'est une grande bannière. x3 

    voila le liens : http://ekladata.com/Rg-CFE4QnMYtm6P4Hy4gCKqRQRI.png

    19
    Mercredi 3 Octobre 2018 à 18:14

    C'est pas mal ! J'aime bien le fait d'avoir un peu décalé le render ^^

    20
    Mercredi 3 Octobre 2018 à 20:48

    ouais j'avais pas le choix de mettre le render sur un côté x3

    21
    Dimanche 4 Novembre 2018 à 15:44

    Excusez-moi cher Princesse Alia, je trouve mon anciens rendu raté, donc j'en ai fais un nouveau. Pouvez-vous le remplacez par celui-ci ?

    22
    Lundi 5 Novembre 2018 à 22:02

    Mais bien entendu !

    C'est un de mes renders que t'as utilisé ? ;-;

    23
    Mardi 6 Novembre 2018 à 00:39
    vuii je le trouvais beau, j'aurait peut-être dû te prévenir ? ;^;
    24
    Mardi 6 Novembre 2018 à 11:21

    Mais pas du tout, je suis honorée que tu l'ai utilisé !

    Surtout qu'il est pas super bien découpé aha

    25
    Mardi 6 Novembre 2018 à 17:30
    tu devrais faire plus de render, surtout que t'as du t'améliorer depuis le temps c:
    26
    Mercredi 7 Novembre 2018 à 18:28

    Sûrement, il faut juste que je trouve le temps !

    27
    Mardi 23 Avril à 00:25

    Je suis tellement en graphisme que je n'arrive même pas a suivre un simple tuto !! :( :/  -_-

    (pourtant je suis sur ordi ma soeur me la preter :)  )

    28
    Mardi 23 Avril à 01:02

    Quel logiciel tu as ?

    29
    Mardi 23 Avril à 01:02

    J'était sur ordi avec photo filtre

    30
    Mardi 23 Avril à 01:49

    Mmh, qu'est-ce que tu n'as pas compris/pas réussi à faire ?

    31
    Mardi 23 Avril à 09:11

    Le doigt et aussi lorsque je mettais le niveau max des point et bien sa fesait pas pareil qur le tuto ! x)

    32
    Mardi 23 Avril à 10:25

    Juste pour savoir, tu utilises Photofiltre ou Photofiltre 7/Studio X ? Parce que Photofiltre simple est assez différent des deux autres.

    33
    Mardi 23 Avril à 10:40

    J'utilise photo filtre 7

    34
    Mardi 23 Avril à 10:41

    C'est bizarre, ça devrait rendre comme sur le tuto alors. Tu peux me montrer tes réglages pour le filtre Pointillisme ?

    35
    Mardi 23 Avril à 10:42

    La je peux pas ma soeut dort !

    Oui emle est crevée x)

    Donc je peux pas utiliser photo filtre !

    36
    Mardi 23 Avril à 10:42

    Pour moi les points etaient un peu plus gros

    37
    Mardi 23 Avril à 10:46

    OK je vois, tu me diras quand tu pourras. Mais si le problème c'est juste la taille des points t'as pas à t'en faire, ça devrait quand-même marcher je pense ^^

    38
    Vendredi 14 Juin à 15:30

    Bonjour,

    Merci pour ce tuto

    Voilà mon rendu du header

     

    Suivre le flux RSS des commentaires


    Ajouter un commentaire

    Nom / Pseudo :

    E-mail (facultatif) :

    Site Web (facultatif) :

    Commentaire :