32
Comment créer la pub du nouvel iPod
Voila mon deuxième et pas dernier tutoriel !! Il s’agit ici de créer un effet d’annonce iPod style nouveau genre. Avant de commencer ce tutorial j’aimerais signaler que Kobalt m’a donné un coup de main pour le mener à terme. Je tiens toujours à dire que j’utilise Photoshop Elements 5.0. et donc certaines fonctions pourraient être différentes. Le tutoriel est particulièrement long. Alors au boulot !
PARTIE 1 : Je crée l’iPod qui figurera dans l’annonce. Les détails sont inutiles. Nous ne ferons que des formes grossières.
Étape 1 Je crée un document de largeur 500 px de hauteur par 726 px. J’affiche la grille et je crée un rectangle arrondi au rayon de 20 px en blanc.
Étape 2 : Je crée un rectangle arrondi en noir absolu (000000) et dedans je crée un rectangle normal en bleu (75e0ff) par-dessus le rectangle arrondi noir puis je baisse son opacité à 20%. J’obtiens cela :
Étape 3 : Encore avec l’aide de la grille, je sélectionne une ellipse parfaite et je la remplis de gris (a2a2a2). Je crée une autre ellipse parfaite, plus petite que l’autre, qui servira de bouton central. Je la remplis de blanc.
PARTIE 2 : Bon et bien maintenant c’est le moment de créer tout le reste. Commencez par ouvrir un nouveau document de 1024 px de largeur par 768 px de hauteur. Il sera important de nommer les calques dans cette partie
Étape 1 : Je sélectionne deux couleurs qui ne sont pas trop contrastées. J’ai choisis ffb400 et baff00. Avec ces deux couleurs je fais filtre > rendu > nuages. Nommez ce calque : Base
Étape 2 : J’éclaire mon calque « base » avec les fonctions suivantes (filtre > rendu > éclairage) :
Et cela me donne ceci :
Étape 3 : Je garde une de mes couleurs (pour moi c’est le vert) et je sélectionne du noir à la place de l’autre couleur. Je place le noir au dessus. Dans ma palette j’ai ces couleurs là :
Ensuite avec une efface diffuse, j’efface grossièrement le milieu et je baisse l’opacité à 40%. Nommez ce calque : ombrage
Étape 4 : Avec des pinceaux en forme de feuillage ou de fleur, je crée un élément d’arrière plan en couleur plus pâle (vert pour moi : c9ff89) (le but ici est de créer des formes selon ce qui vous passe par la tête. Il n’est donc pas nécessaire que ce soit du feuillage ou des fleurs,c’est selon votre imagination) Nommez ce calque « élément d’arrière-plan ».
Étape 5 : Sur mon calque « élément d’arrière plan », j’applique un halo (filtre > rendu > halo) de 50-300mm (zoom) à 165% à l’endroit qu’il vous semble bon. Je baisse l’opacité à 20%.
Étape 6 : À l’aide d’un brush représentant une silhouette de quelqu’un, je crée la silhouette là où bon vous semble (le milieu fait très bien). La silhouette employée ici est disponible sur : http://memories-stock.deviantart.com/art/Silhouette-Brushes-21056120. Nommez ce calque « silhouette »
Étape 7 : Il est temps d’aller chercher notre joli iPod et de le mettre dans la main ou dans la poche de votre silhouette ! Transformer le selon le cas ; j’ai utilisé la rotation et un peu de perspective (image > transformation > perspective).
Étape 8 : Ensuite, avec un pinceau de 1 px, je dessine les fils des écouteurs (Truc : faites le trait d’un geste rapide avec le pinceau). Je dessine les écouteurs, le bout du fil d’écouteur et la jonction entre les deux fils des écouteurs. Nommez ce calque « iPod »
Attention, étape compliquée…
Étape 9 : Je duplique mon calque « base » et je le place au dessus de tout. Je prends la sélection des calques « ombrage », « silhouette » et « iPod » je le supprime du nouveau calque, le plus haut (celui que vous avez dupliqué). Appliquez-y un halo (filtre > rendu > halo). Un 50-300mm (zoom) à 170%. Baissez l’opacité de ce calque à 65%. Cela vous donne ceci comme calque :
Étape 10 : Je retourne sur mon calque « silhouette » et j’applique un halo. Un focale fixe film à 60% à l’endroit où se trouve l’iPod.
Étape 11 : Je mets le texte et le logo d’Apple centrés en hauteur en blanc ! Et c’est fini !
Article publié par maniphil
Vous aimez cet article? Partagez le !
Je suis un amateur de photoshop, ambitieusement un futur designer. qui aime créer des tutoriels pour WKS pour le plaisir. Plus tard j’aimerais ouvrir un site internet ou je pourrais y mettre mon porfolio pour m’aider dans mes études.
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 101 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.
-
-
7 mars 2008 19:47, par maniphil
parles tu du cadre autour de l’écran iPod ?
si oui : C’est simple, ce n’est qu’un rectangle par dessus un autre
Répondre
-
-
-
7 mars 2008 23:18, par Black bot
J’aime beaucoup les gens qui accusent, sans avoir de preuves, insinuent, sans pouvoir le prouver, et poste, sans se présenter...
Répondre-
8 mars 2008 11:48, par milo13
Bonjour
Effectivement ! Cela fonctionne dans les deux sens, si on travaille sur une traduction de tuto ou si l’on s’en inspire trés largement il faut citer ses sources.
Mais lorsque on s’aperçoit d’une tentative de plagiat on cite aussi les sources et on précise son identité bien entendu ! par respect pour la communauté.
Cordialement.
milo13
Répondre
-
8 mars 2008 18:53, par maniphil
moi aussi, j’aimerais savoir quel est l’URL de ce site.
Oh, et j’aimerais préciser : J’ai décidé de faire ce tuto après avoir créée une image inspirée de cette photo prise par MOI-MÊME !
http://www.hiboox.com/lang-fr/image.php ?img=od6q4bh3.jpg
(une chose cependant, je ne comprends pas comment mettre les photos dans les messages)
Maniphil
Répondre-
10 mars 2008 10:21, par Wonka
Il y a pourtant rien de plus explicité, pour ajouter une image tu clic sur le lien ajouter une image, une petite fenêtre s’ouvre et la tu choisie ton fichier et tu valide
En tout cas sympa la photo, la pub est magnifique j’adore le jeu de couleurs !
Répondre-
10 mars 2008 15:05, par maniphil
Oui en effet, je comprend pas pourquoi avant ça ne fonctionnait pas.........
Répondre
-
-
-
8 mars 2008 18:52, par TotoDesign
Super tuto par contre je n’ai pas réussi à faire le claque ombrage car je n’ai pas compris la méthode ! Serait-il possible d’avoir le PSD ??
Merci d’avance. Toto.
Ps : Quel est la police utilisé pour écrire iPod ??
Répondre-
8 mars 2008 19:04, par maniphil
Vu que tu viens de me le faire remarquer, je le dit pour tout le monde qui ont le même problème...
pour l’étape #3 dans la partie 2 : avec le noir et l’autre couleur de votre choix qui est placé au dessous,
faite : filtre, rendu puis nuages.
ensuite vous pouvez effacer comme il est indiqué dans le tutorial
merci de m’avoir signalé cette erreur
maniphil
Répondre-
9 mars 2008 15:27, par TotoDesign
Merci bien maniphil.
Je réésayerais quand j’aurais du temps
Répondre ^^ -
21 avril 2008 15:44
Ensuite avec une efface diffuse, j’efface grossièrement le milieu et je baisse l’opacité à 40%. Nommez ce calque : ombrage
Je ne comprends pas : « efface diffuse ». Que faut il faire ?
Merci super tuto, félicitation !
Répondre -
28 mai 2008 11:53, par alias
Super tuto, vraiment ! Mais quel est cet outil : « efface diffuse » ?
Répondre-
29 mai 2008 03:14, par maniphil
l’efface diffuse c’est simplement l’efface mais ellle est réglé de façon à ce que quand on efface, ça soit très flou.
j’èspère t’avoir aidé !
maniphil
Répondre-
30 mai 2008 09:37, par alias
Ouaip Maniphil, merci beaucoup. Bravo à toi, c’est super simple quand tu l’expliques. Et pour les animations, à ton avis, ils ont utilisé after effects ? Genre les personnages dansent devant un écran vert, et ils ajoutent ensuite une animation créée sous after effects, ou bien ?
Répondre-
31 mai 2008 01:24, par maniphil
Cela peut ^tre possible mais en fait je ne l’affirmerais pas car mes connaissance des produits Adobe ne s’étendent pas vraiment plus loin que photoshop. peut ^tre que Wonka en saura plus sur ce sujet....
merci pour ce message
maniphil
Répondre
-
-
13 janvier 2010 21:15, par Joris8384
Salut,
j’ai cherché pendant plus d’une heure l’outil efface qui permet de faire l’efface diffuse mais je ne le trouve pas. J’ai tout essayé la gomme, un masque de fusion etc... mais rien n’y fait ! Pour info je suis sous Photoshop CS3.
Pouvez-vous m’aider s’il vous plaît parce que là je suis bloqué.
Merci par avance.
Voir en ligne : Serecom Radio
Répondre
-
-
-
-
8 mars 2008 23:53, par maniphil
la police utilisé est tout simplement arial. mais j’ai remplacé le point du « i » par un rond car il était carré
Répondre
-
-
10 mars 2008 16:52, par IT1
Aaah merci ! Cela fait un petit bout de temps que je cherche une texture qui ressemble à la texture du fond l’image de ce tuto ! Et maintenant, je sais comment l’obtenir.
Petite astuce : la police est « Arial » mais si vous voulez refaire la pub exactement, je vous conseille d’employer la police « Myriad » : c’est la police « officielle » d’Apple. Voilou. A bientôt.
Répondre-
-
10 mars 2008 20:50, par IT1
De rien, c’est un plaisir de donner un coup de pouce pour ce super tuto
Répondre
-
-
-
13 mars 2008 21:41
Quel est le pinceau utilisé pour créer les fleurs ?
je cherche exactement le même pour une petite compo perso.. et étant débutant je ne sais pas vraiment où chercher
merci en tout cas pour ce tuto instructif !
Répondre-
15 mars 2008 00:46, par maniphil
Je suis désoler de ne pouvoir te donner un grand coup de main car le pinceau utilisé ici, je l’ai téléchargé il y a longtemps....
Si ca peut t’aidé je connais le nom:Il s’appelle : Fresh_Foliage_HighRes001
j’èspère t’avoir dépané et bonne chance pour ton dessin !
maniphil
Répondre
-
-
15 mars 2008 23:26
r1 a dire c incroyable je n’ai po trouvé le mot qui décris ce que tu as fais trés trés bon travaille et bonne continuation
Répondre -
16 mars 2008 22:06, par italian-graph
Bellisimo ce petit tuto et je m’amuse maintenat à prendre une simple photo et al transformer en silhouette ce qui donne plus de satisfaction à la composition mais vraiment encore merci et buona continuazione ^^
Répondre -
31 mars 2008 20:55
bonjour, merci pour ce tuto j’ai réussi un bon arrière plan par contre je n’ai pas compris comment trouver la silhouette car je l’ai téléchargée mais seulement l’image contenant plusieurs silhouettes et lorsque j’essaye de l’ouvrir il me dise que le fichier ne peut pas être ouvert.Si quelqu’un peut m’expliquer comment faire par ce que là je suis coincé ! merciiii
Répondre-
1er avril 2008 15:55, par meycha
Bonjour, avez vous bien charger le fichier dans la palette de brush ?sinon, il faut choisir l’outil tampon ou pinceau et dans « forme » ouvrir les paramètres avec la flèche de droite vers le bas et cliquez sur la petite flèche dans le cercle à droite.Choisir « charger les formes » et allez cherchez le fichier de silhouettes (en.abr)que vous avez téléchargé.J’espère que ceci resoudera votre problème.
Répondre
-
-
1er avril 2008 15:50, par meycha
BHOuuu, je ne comprends pas pourquoi les fonction halo et éclairage sont grisées, impossible de les utiliser !!quelqu’un aurait-il une réponse ? et qu’est-ce que la fonction « efface » ?Merci
Répondre -
16 avril 2008 21:00, par yusukel
Très jolie tutoriel. J’ai essayer, j’ai bloqué complet à l’étape 9 ^^’ dc j’ai bidouiller… lol
Répondre-
17 avril 2008 01:11, par maniphil
en effet l’étape 9 est assé compliqué...
ta compo parcontre est super géniale !
merci
Répondre-
17 avril 2008 10:07, par Wonka
Voici l’image de yusukel que je me suis permis d’ajouter à la galerie de l’article :
Vraiment trop bien fait, bravo à lui pour cette composition graphique !
Répondre-
17 avril 2008 11:17
Merci sa me fais plaisir ! =) En effet je n’arrivais pas a mettre mon final dans la galerie…^^’
Répondre
-
-
-
-
17 avril 2008 19:39, par Wonka
J’ai supprimé sans faire exprès l’image d’un membre, je suis vraiment DESOLE, s’il pouvait la poster encore une fois ce serait vraiment génial
Répondre -
1er mai 2008 15:56
aaah merci bcp : voici ma créa !!
c ke la premiere pask sa mamuz bcp lol dc je pens jvé en refere pleins =]
^^
Répondre -
5 mai 2008 16:10
Merci pour le tuto ! J’ai adorer le faire, très bien expliquer malgré que j’ai galéré un peu pour les ombrage.. Voila le résultat :
Répondre
-
7 mai 2008 13:43, par july
très bon tuto, on peut le modifier à l’infini ! sinon, j’ai du mal à retrouver la typo apple... et le symbole de la pomme aussi... j’ai trouvé un template sur illustrator que j’ai importé sur toshop... merci !
Répondre
-
7 mai 2008 14:06, par Wonka
Très joli mais l’ipod est un peu bizard, la forme est peux être un peu trop carré ! Et puis comment tient il dans la main ?
Répondre
-
-
-
13 mai 2008 14:14, par Wonka
C’est plutôt pas mal du tout, mais ton iphone est un peu gros je trouve !
Répondre
-
-
11 mai 2008 18:28, par SuperPoulet
Bon tutorial ^^ jspr que vous validerez mon montage ^^ si le nom de ma pub pr mon skyblog porte problème je peux renvoyer le montage sans le lien ^^ merci !.
Répondre
-
17 mai 2008 12:53, par sixthfinger
merci wonka pour ce tuto, ça m’a pris des minutes, assez simple je trouve, mais comme tu peux le constater il manque la pomme de aple, je ne l’ai pas mais je vais chercher ce symbol. merci
Répondre -
-
29 mai 2008 23:02, par Vanille
Merci pour ce tres bon tutoriel =D !
Par contre j’ai pas compris le calque ombrage :
- Quesque une « efface diffuse » ?
Sinon tres bon tutoriel, et voici mon image ^^ :
Répondre
-
3 juin 2008 22:37, par Vanille
Encore Merci a vous pour ce tutoriel tous mes amis me demande de leur faire leur images xD
A cause de vous j’ai du boulot :p
http://hakim.14.free.fr/Hakim.png
Répondre -
8 juin 2008 20:35, par zint’@rt
bonjour, merci pour ce tres bon tuto mais je ne sais pas où trouver le logo ipod. merci
Répondre -
8 juin 2008 20:42, par zint’@rt
j’espere que mon travail sera compris http://zint-art.magix.net
Répondre
-
10 juin 2008 02:33, par maniphil
très joli tout ça
et ton site il est super c’est toi qui l’a fait ?
maniphil
Répondre-
12 juin 2008 14:21, par zint’@rt
zint-art.magix.net merci .non, mais tout le contenu est de moi.
Répondre -
-
-
-
14 juillet 2008 16:50, par SuperNiz
Hi ! Gros merci pour ce tuto ! Le résultat est splendide =D
Répondre -
17 août 2008 01:25, par sasa
Bien le tuto, bien expliqué rien à dire
Voila ce que ça donne pour moi
Répondre
-
17 août 2008 12:53, par Wonka
Pas mal, cependant je trouve l’ipod un peu bizarre, trop carré je trouve !
Répondre-
17 août 2008 18:42, par maniphil
super beau et le ipod un peu carré c’est vrai
mais en tout c’est très bien réalisé !
Répondre -
18 août 2008 03:16, par sasa
J’avoue j’ai fait une petite erreur pour l’ipod j’ai pas choisi l’outil rectangle arrondi et quand je m’en suis rendue compte c’était trop tard... Par contre j’ai zappé une étape, c’est celle de l’efface diffuse, honte à moi j’ai toujours pas compris comment faire pour accéder à cet outil malgré ce qui est dit dans les commentaires.
Répondre-
21 août 2008 18:29, par sasa
Merci c’était mon premier essai
Répondre
J’en ai réalisé un autre voila ce que ça donne 
-
-
-
-
14 septembre 2008 20:06, par cyan100
Un excellent exemple pour utiliser Photoshop et en mème temps se faire plaisir pour créer des pubs quand on à en plus le fameux et adorable Ipod
juste un seul grand regret, que ces tutoriaux avec les commentaires en plus rajoutés n’existe pas en téléchargement en pdf vraiment plus pratique quand on n’est pas connecter au net en permanence un rajout à voir et qui ferai plaisir à pas mal de nombres de personnes sur ce site fabuleux bonne continuation à ce site et à tous ces exemples
Répondre-
14 septembre 2008 20:33, par Wonka
Merci pour ton message et pour cette idée
Répondre je vais voir si c’est possible d’ajouter cette fonction
-
-
24 septembre 2008 05:11, par mike
très bon tuto j’ai bien adoré j’ai rajouté ma petite touche perso voila ce que sa a donné
Répondre
-
24 septembre 2008 09:49, par Wonka
J’aime bien les lignes et la silhouette cependant je trouve que les couleurs du fond sont un peu trop foncé, on ne distingue pas bien le personnage ! J’aurais aimé un mélange de couleur quelque chose de plus pétant
Répondre
-
-
5 octobre 2008 20:25, par chill
salut et avant tout bravo pour la qualité du site et des tutos, c est un bonheur.. désolé pour mon inexpérience mais je n arrive meme pas a creer le calque base car apres avoir choisi mes couleurs en bakground et foreground et appliqué le filtre nuages ils restent gris et noirs...ca doit etre tres con mais j y arrive pas !! si qqun a 2 min pour m eclairer....merci
Répondre -
2 janvier 2009 09:48, par herve
Merci pour ce tuto. je l’ai détourné pour mes voeux 2009 :
Répondre
.
Alors une Bonne Année 2009 à tous !!!
Hervé-
5 janvier 2009 11:10, par Wonka
Merci Hervé
Répondre et je te souhaite à mon tour une très belle année. En tout cas bravo pour ton image, très original et joliment réalisé.-
15 janvier 2009 20:10
Bonsoir, j’ai photoshop 5.5 , est-ce possible d’arrivé à un resultat conqret en suivant se tuto ?
Répondre-
15 janvier 2009 20:12
Oups pardont c’est remoi , escusez moi du double post mais je ne vois pas ou est le pinceau pour les feuilles .... Merci d’avance, supèer tuto !
Répondre-
15 janvier 2009 23:37, par maniphil
salut,
Avec d’autres versions, je ne sais pas, mais moi j’ai fait ce tuto armé que de la version Elements, Mais la meilleure facon de voir, se serais d’essayer !
Je n’ai pas poster les brush, mais je sais qu’elles se nomment Fresh foliage HD.
Bon courage dans ta réalisation, et quand tu aura finit tu nous le montrera ?
maniphil
Répondre-
16 janvier 2009 10:10, par Wonka
Petit coucou à mani (peut tu m’envoyer un mail je quelque petite chose à te dire en retour
Pour ce qui est de la création du tuto avec la v 5.5 normalement se doit être possible oui
Bonne chance !
Répondre-
23 janvier 2009 17:20, par guest1220
Bonsoir , merci une nouvelle fois pour se tuto que je trouve magnifique ! Mais j’ai photoshop cs3 , et je ne trouve pas le pinceau herbe, peux-tu m’aidé s’il te plaît ?
Répondre-
24 janvier 2009 21:13, par maniphil
salut. Ce sont des brush téléchargées
elles se nomment fresh foliage HD (disponible ici :
http://designfruit.com/jasongaylor/blog/2006/02/18/fresh-foliage-photoshop-brushes-for-high-resolution-part-i/
j’èspère t’avoir aidé, et bonne chance dans ta réalisation !!
mani
Répondre
-
-
-
-
-
-
-
-
19 février 2009 01:06, par Earwin
Merci mille fois ! Tuto vraiment clair et précis pour ma première création Photoshop ! (mis à part la partie 9 que j’ai eu du mal à comprendre, mais bon bidouillage ! :p) Voilà ma créa : http://www.wks.fr/stockpix/284/3179.jpg Encore merci et vivement les prochains tutos !
Répondre -
10 mars 2009 11:57, par Violine
Bonjour,
Voici ce que j’ai fais http://www.wks.fr/stockpix/284/3322.jpg
c’est encore loin d’être parfait, mais je débute, le tuto est super, bien expliqué, c’est génial et grâce à vous je découvre pleins de choses et j’espère faire des progrès. Pour la tite pomme y a t-il un moyen de trouver un render où un pinceau où une forme ?
A bientôt !!! Excellente continuation
Répondre -
5 août 2009 16:11, par athena66
Super tutoriel, merci , j’ai utilisé des personnage de manga pour les silhouettes !
http://www.noelshack.com/up/aaa/I-POD076325.jpg
Répondre -
25 août 2009 00:31, par B.Indicibilis
Hello !
Je suis tombé par hasard sur ce site ...
J’suis fan des pubs iTunes+iPod et ...
Je suis président d’une asso. artistique et vos travaux là m’ont inspiré ...
Est-ce que l’un de vous pourrait venir sur mon MSN, j’ai un truc à proposer ... ( ou sur facebook au nom « Indicibilis » )
A très vite , Amicartistiquement, B.
Répondre -
16 janvier 2010 19:55, par isnogood
Je duplique mon calque « base » et je le place au dessus de tout. Je prends la sélection des calques « ombrage », « silhouette » et « iPod » je le supprime du nouveau.
je comprend rien a partir d’ici . on dit de suprimer les calque ,mes il s’appraise pas sur l’autre. Expliquer moi
Répondre -
16 juillet 2010 12:29, par Moox
Super tuto, merci beaucoup !
Ma participation : http://moox.blog.free.fr/public/Retouches/Pub-Ipod_copie.jpg
Répondre -
9 janvier 2011 18:14, par Sb Bgz
Bizarrement ça ne rend pas très bien chez moi... Je suis déçue de moi même parce que le tuto est plutôt clair...
Répondre -
11 février 2011 14:41, par céline
Bonjour, Je travaille à la bibliothèque de Draveil et je souhaiterai avec votre accord et si cela ne vous ennuie pas, utiliser votre fond d’écran (celui qui sert d’exemple au début de la page, vert et jaune avec des motifs) pour la présentation des nouveautés pour le mois de mars sur le site internet de la bibliothèque. De ce fait, votre accord (autorisation par écrit) m’est indispensable. J’espère que vous accepterez car je le trouve très réussit ! Merci. Bonne journée.
Répondre
