Créer une bille super brillante

Voici une méthode ultime pour créer une bille (effet 3d) sous Photoshop. Cette technique me ravit tout particulièrement car le résultat est super brillant et très glossy, tout à fait dans le style Web 2.0 (bling bling oblige aux petits brillants).

Je ne vais pas dire que ce tutorial est facile, au contraire c’est une technique nécessitant quelques notions au niveau des reflets et dégradés. Cependant n’hésitez pas à le tester car le final est époustouflant.

Photoshop - 333.2 ko
Fichier source Photoshop tutorial 383
clic ici pour télécharger le fichier source photoshop utilisé dans ce tutorial

ETAPE 1

Sous Photoshop, je crée un nouveau document sur fond blanc, puis je crée une ellipse au centre de mon image (sur un nouveau calque évidemment).

ETAPE 2

Je récupère la sélection de mon ellipse (Ctrl + clic sur le calque ellipse dans la fenêtre des calques). Puis avec un pinceau diffus, je crée un point bleu clair dans la partie haute, gauche, de mon rond.

ETAPE 3

Je crée un nouveau calque (normalement la sélection est toujours active) puis avec le même pinceau diffus, mais cette fois avec une couleur « bleu foncé » je crée une zone sombre en bas à droite.

ETAPE 4

Je crée encore un nouveau calque et j’utilise un bleu encore plus foncé pour rendre la zone basse droite plus foncée encore (renforcement de l’ombrage).

ETAPE 5

Petit effet mais grosse étape : Je crée un nouveau calque, puis avec l’outil sélection en ellipse je crée un rond que je remplis de blanc (avec le pot de peinture) puis je décale la sélection de quelques pixels sur le haut et à droite, j’appuie sur Suppr, ce qui me permet de vider ma sélection. J’ai ainsi créé une petite bordure ronde blanche.

J’ajoute à ce calque un masque de fusion (calque > masque de fusion > tout faire apparaître) qui me permet de cacher le haut et le bas (je peux utiliser un pinceau noir sur le masque de fusion).

ETAPE 6

Petit effet mais grosse étape : J’utilise la même technique, sélection en ellipse, pot de peinture blanche, et masque de fusion.

ETAPE 7

Même chose, encore une fois, pour créer un second reflet juste en dessous du reflet créé à l’étape 6.

ETAPE 8

Cette fois j’utilise l’outil plume et je crée une forme en haut à gauche, un quatrième reflet, je crée une forme (comme ci-dessous) qui me permet de souligner l’illusion de la forme de la bille. J’utilise un masque de fusion pour camoufler le contour (en haut) de ce reflet.

ETAPE 9

Je vais maintenant séparer mon reflet en quatre parties ; pour cela j’utilise une sélection en ellipse et je fais édition > contour > bleu de la même couleur que la bille. Je fais cette procédure deux fois, et enfin j’utilise un masque de fusion pour camoufler les parties en trop (en dehors du reflet).

ETAPE 10

J’utilise ce tutorial : http://www.wks.fr/Creer-une-etincelle-de-lumiere.html pour disposer de-ci de-là des petites étoiles (pour créer cet effet brillant).

ETAPE 11

Et enfin, je crée une ombre par-dessous ma bille, pour cela je crée un ovale avec l’outil ellipse de sélection, je crée un nouveau calque que je place en dessous de l’ellipse (dans la fenêtre des calques) je remplis cette sélection avec le pot de peinture (en bleu très foncé) et enfin je lui ajoute un filtre atténuation : flou gaussien (4 ou 5), je peux diminuer l’opacité si je le souhaite à 70%.

Et voila, c’est terminé, bon d’accord ce n’est pas évident. Mais je vous avais prévenu tout en haut :p Et voici pour vous lecteur de WonkaStudio un petit bonus, un psd contenant cette bille en plusieurs couleurs.

PNG - 52.7 ko
Photoshop - 1.3 Mo
Fichier Photoshop bonus
le fichier source des billes multicolores !

Article publié par Wonka

Vous aimez cet article? Partagez le !

Je suis très humblement le webmaster et le créateur de ce site, vous êtes en ce moment sur ma fiche membre, vous avez la possibilité de m’’envoyer des messages, pour toutes questions n’hésitez pas une seule seconde !

Publiez une nouvelle image

Vous avez réussis à créer une belle image grâce à ce tutorial ? Soyez sympa, partagez la avec la communauté. Utilisez simplement ce formulaire :

Vous devez être connecté pour activer le bouton de validation !

La galerie des membres

Voici les images déjà publiées par les membres de ce site, merci à vous pour votre créativité !

Questions et commentaires, Il y a 40 messages de forum.

Vous avez besoin d’eclaircicemment sur un points évoqués dans cette leçon, dans ce cas laissez votre question en utilisant le formulaire ci dessous, notre équipe vous apportera rapidement un complètement d’information. Merci d’être le plus précis possible lors de la rédaction de votre demande.

  • 8 août 2008 17:56, par b-effect

    Franchement...que dire si ce n’est que c’est tout simplement excellent ! J’espère atteindre un tel niveau un jour d’inspiration !

    Répondre
  • 8 août 2008 22:54, par Daniel

    Trés joli rendu. Bravo !

    Répondre
    • 10 août 2008 00:01, par Romain

      Le résultat est en effet trés chouette... malheureusement je bloque à la 5è étape ! Je débute sur CS3 et pour mon niveau, il manque les détails de l’étape. Le fait de supprimer la sélection élipse blanche me donne un résultat bien différent, un léger contour pointillé irrégulièrement.

      Répondre
      • 10 août 2008 10:31, par Wonka

        Il faut la deplacer la selection avant de supprimer sinon en effet ca ne risque pas de donner quelque chose ;)

        Répondre
        • 13 août 2008 22:59, par Panpan

          Blazé jsuis pas chez moi j’ai pas toshop T_T J’aurais bien tenter ce tuto il a l’air bien :)

          Répondre
          • 16 août 2008 19:52

            Franchement, magnifique, mais franchement je commence des tutos et je coince souvent à la 4e ou 5e, est-ce que tu peux nous mettre des tutos vidéos si c’est possible s’il te plait ? ça serait énorme. Bonne continuation l’ami

            Répondre
            • 17 août 2008 20:24, par Zfake

              Bloquer a l’étape 5 pareil. Je comprend pas y a pas assez de détail T_T

              Sinon c’est un super tuto.

              Répondre
              • 18 août 2008 14:39, par Wonka

                Surement le masque de fusion qui vous pose problème, malheureusement il n’y a que la pratique que vous permettra de suivre cette étape sans soucis ;)

                Répondre
                • 19 août 2008 01:00, par zfake

                  nn en fait quand je déplace et que je supprime quand c’est expliqué bah sa me del toute les couleur blanche du rond donc je vois pas comment. si tu pouvais dire en détail ce que tu as fait sa m’aiderais vachement ^^

                  Répondre
                  • 19 août 2008 22:34, par paco

                    bravo j’aime

                    Voir en ligne : portfolio

                    Répondre
                  • 20 août 2008 13:29

                    Ah bein je suis pas le seul à avoir ce problème ! ça fait plaisir :-) Il est certain qu’un tuto vidéos serait plus clair car parfaitement détaillé, mais sa réalisation et mise en place sur le site doit être un poil plus fastidieuse...

                    Répondre
                    • 20 août 2008 19:18, par zfake

                      moi c’est bon en fait je déplacé le contenu de la sélection au lieu de déplacer la sélection^^

                      voila ce que j’ai réussi a faire : http://zfake.olympe-network.com/cr%e9a%27s/divers/coeurtshirtxb.jpg

                      Répondre
                      • 21 août 2008 12:32, par Romain

                        Ton résultat est top zfake mais comment fais tu pour sélectionner « le contenu de la sélection » ?? Merci pour ton aide précieuce ! :-)

                        Répondre
                        • 1er septembre 2008 11:37

                          Pour déplacer le séléction et son contenu il suffit d’appuyer sur Ctrl enfoncé puis déplacer la selection normalement

                          Répondre
                          • 2 septembre 2008 12:39, par Corey57415

                            Le rendu est vachement cool, malheureusement je trouve un peu barbant les étapes où l’on doit toujours utiliser l’aérographe car il faut recommencer 36 fois avant d’avoir un beau résultat..Mais sinon je dit bravo, j’ai la flemme moi de le faire quand je regarde les étapes...

                            Répondre
                            • 10 septembre 2008 22:37

                              Merci pour ce tuto, moi qui suis débutant sur PShop CS3 j’ai tout de suite réussi, ça me permet de découvrir les options et différents outils

                              Répondre
  • 12 septembre 2008 14:07, par elvire

    Bonjour, Très belle création. !! Bravo ! Je suis également débutante et moi je bloque sur le masque de fusion. Je fais tout comme tu le dis mais je n’ai pas le même rendu.... Est-ce que tu peu me donner plus de détails ? mais je ne baisse pas les bras, je continu à cherche la bonne manip !

    Merci

    Répondre
    • 12 septembre 2008 15:11, par Wonka

      Tout est dit, tu devrais plutôt me détailler les différences avec l’article que je puisse visualiser le problème que tu rencontres !

      Répondre
  • 14 septembre 2008 22:18, par docazz

    Excellent Tutoriel dont j’ai le plaisir à suivre le déroulement ainsi que le résultat que j’obtiens. Hélas je bloque à l’étape 10, celle des étoiles. J’ai eu beau regarder dans le fichier .psd ainsi que sur le tuto dans lequel tu explique comment faire tes étoiles, je reste « bloqué ». En effet, la taille de base de ma forme étoile est de 48px. Si j’essaye de la diminuer (notamment de moitié) j’obtiens une étoile certes plus petite mais aussi dont le trait est 2 fois plus épais, bref une horreur et donc j’ai du mal à réaliser le tuto de l’étoile. De plus dans ce que tu utilises pour les billes il me semble que l’étoile (notamment la forme à 4 branches la plus grande qui la compose) est colorée de façon subtile (genre dégradé s’incrustant bien avec la couleur de fond de la bille) et j’aimerai bien connaître la « technique » :).

    Répondre
  • 28 septembre 2008 11:46, par Le nordiste

    Voilà moi j’ai suivi le tuto, j’ai fait une boule, ensuite je l’ai refait sans le tuto et j’ai jouer avec des effets de lumières par contre j’me suis pas focaliser sur les étoiles, j’ai mis un filtre halo lol mais le rendu avec les étoile est beaucoup plus réaliste car mn filtre halo est trop fort mais bon ^^, à refaire sans soucis !

    Répondre
  • 2 octobre 2008 17:43

    Rhoooo lala tout simplement de la tuerie !! trop beau

    a pluxxx

    Répondre
    • 23 novembre 2008 00:00, par Jack

      Rendu sympa mais coincé à l’étape 5 ça manque d’information dommage

      Répondre
      • 23 novembre 2008 11:34, par Wonka

        Aucune difficulté à l’étape 5, qu’est ce que tu n’arrives pas à faire ? Car en gros il faut juste crée une trainée blanche et la camoufler légèrement sur le bas avec un masque de fusion !

        Répondre
        • 4 décembre 2008 20:21, par Frédérique

          Vous faites le rond comme expliqué à l’étape 5 en le remplissant de blanc. Vous désélectionnez tout. Avec l’ellipse de sélection, vous refaites un rond et vous le placez par dessus le rond blanc de façon à ne laisser hors de la sélection qu’un petit morceau de blanc (traînée blanche). Puis, vous choisissez EFFACER dans le menu EDITION. Ainsi, tout le blanc de la nouvelle sélection s’efface.

          Répondre
  • 9 février 2009 22:48

    Bonsoir a otus je debute dans photoshop ceci est mon premier tuto et premeir travail xD.

    Apres une journee de recherche car moi aussi j’etait bloquer sur l’etape 5 j’ai trouver !

    il suffit d’avoir notre selection d’eclipse ! Prend l’outil selection d’eclipse ! remplir de blanc avec le pot et la deplacer ! reprend l’outil eclipse le deplacer un petit peu et apuyer sur Supp.

    Apres il vous reste plus cas jouer avec votre masque de fusion !

    Merci Wonka voici ma frist creation :http://img23.imageshack.us/my.php ?image=boulecopieko1.jpg

    Répondre
    • 9 février 2009 22:54

      aparament le lien marche pas en voici un nouvo j’attend vos critique afin de progresse

      lien : [url=http://img14.imageshack.us/my.php ?image=boulecopiebw6.jpg][img=http://img14.imageshack.us/img14/7599/boulecopiebw6.th.jpg][/url]

      Répondre
      • 10 février 2009 08:52, par Wonka

        Ton lien ne marche toujours pas, par contre tu peux ajouter ton image dans la galerie de cette page et a sa marchera ;)

        Répondre
        • 11 février 2009 18:02

          excuse moi de poster ici mais j’ai voulu m’inscrire sur le site ! la boite automatique m’envoye le mot de pass mais cela fonctionne pas merci de regler ce sousi ! cordialement !

          Répondre
  • 10 mars 2009 02:24, par françois

    Super tuto, j’ai appris plein de manip. Buggé aussi au niveau 5 (Brr le calque de fusion !?!) mais persévéré, bidouillé (en multipliant les calques, selections...) et une super bille rouge, brillante et à reflets, s’est patiemment construite. Merci

    Répondre
  • 18 mars 2009 04:21, par Wizard

    merci c’est cool ...ce tuto m’a permis de mieux comprendre les masques de fusion car se sont mes debuts..ca doit etre mon 3eme essai photoshop alors merci WONKA...

    Répondre
  • 22 mars 2009 15:40

    J’ai pas bien compris les masque de fusion j’ai essayer et voila le résultat Il faudras que vous pensiez a faire un tuto pour les masque de fusion hein WKS

    Répondre
  • 25 juin 2009 21:32, par B&W Power

    Comme beaucoup je bloque à l’étape 5. Tu ne dis pas du tout où il faut placer l’ellipse, quelle taille, etc. Quand je déplace ma sélection je déplace aussi le blanc du coup quand je supprime y a plus rien. Après une dure journée de boulot c’est plutôt dur de réfléchir correctement donc si tu pouvais apporter beaucoup plus de détails merci. :-).

    Répondre
    • 26 juin 2009 11:04, par Wonka

      Mais si il faut regarder l’image qui vas avec, l’ellipse blanche sert à créer le petit reflet en bas !

      Répondre
  • 21 août 2009 22:39, par Votre pseudonyme

    Comme d’hab :-) un super tuto :-) toutes mes felicitations wonka

    Répondre
  • 16 septembre 2009 00:41, par invalide

    Que dire de plus que ce tuto est génial, félicitation à l’auteur a+

    Répondre
  • 5 octobre 2009 10:40, par Myosotis

    Beaucoup ont galéré sur l’étape 5 ? Moi c’est plutôt l’étape 8 : je ne sais pas utiliser l’outil plume. Quelqu’un peut m’aider ? Merci.

    Répondre
  • 5 octobre 2009 13:11, par Myosotis

    C’est bon ! Aprés avoir galéré, j’ai enfin réussi :

    Merci pour ce tuto, j’ai appris beaucoup de choses.

    Répondre
  • 26 janvier 2010 01:29, par greg

    Voila j ai fait le tuto , il ma bien fallut deux a trois heure pour y arriver mes ses fait ^^ ,Bien expliquer certaine étapes un peux complexe quand ont maitrise pas , mes avec un de patience ont y arrive felicitation au webmaster un vrai plaisir a lire vos tutos merci beaucoup de votre partage .Bye GREG

    Répondre
  • 1er avril 2010 19:29, par Pierre

    Pour un débutant très mal expliqué rien de tel qu’un pro pour détailler tout..

    Répondre
  • 4 juin 2010 18:28, par nico

    trop bien merci beaucoup pour ce superbe effet :)

    Répondre

Laissez un commentaire

Remplissez correctement le formulaire puis appuyez sur Validez.