Accueil > Tutoriels pour les webdesigners > Photoshop > Dessiner des objets avec Photoshop > Créer la pub de l’Ipod nano chromatique avec Photoshop

Créer la pub de l’Ipod nano chromatique avec Photoshop

jeudi 25 septembre 2008, par Wonka

Suivez ce tutorial Photoshop afin de tenter de reproduire la publicité d’Apple pour l’iPod nano chromatique. Vous apprendrez à reproduire à iPod puis à le mettre en situation. Ouvrez Photoshop et à vous de jouer.

A la suite de la sortie internationale du nano chromatique d’Apple je n’ai malheureusement pas résisté à la tentation de vous écrire un tutoriel vous expliquant : la création de ce nouvel Ipod ainsi que la mise en scène faite dans leur spot de publicité.

Le tutoriel se compose donc de trois parties, la création de l’Ipod et sa duplication, la création des coulées de peinture et la création du titre.

Le tutoriel n’est pas forcément très compliqué, mais il est un peu long et pourra paraître fastidieux pour les vrais débutants de Photoshop, pour les autres je vous invite à vous lancer, cela vaut vraiment la peine, faites moi confiance ;)

J’ai voulu faire bien, car en plus de cela, ce tutorial est le 400ième article publié sur le site WonkaStudio ; une sorte de récompense. Voici donc le tutoriel "Créer un Ipod nano chromatique".

Avant de commencer je propose à ceux qui aimeraient connaitre la technique en partant du fichier source Photoshop, deux fichiers à télécharger :

Photoshop - 418.3 ko
Photoshop - 2.8 Mo

ETAPE 1

J’ouvre le logiciel Photoshop et je crée un nouveau document sur fond blanc. Je sélectionne l’outil rectangle arrondi et je crée sur mon document la base de mon futur Ipod.

JPEG - 18.8 ko

ETAPE 2

Je vais lui ajouter un style de calque : menu calque > style de calque > incrustation de dégradé, dont voici la configuration : rien de bien spécial, j’ai repris le code couleur d’Apple !

JPEG - 158.2 ko
JPEG - 19.7 ko

ETAPE 3

Avec l’outil des formes personnalisées ellipse, je crée un premier rond au dessus de ma base verte (petite astuce : en sélectionnant les deux calques je peux les aligner correctement en aller dans le menu calques > alignement > aligner > centrer dans le sens horizontal).

JPEG - 21.6 ko

ETAPE 4

Je crée un rond que je place par-dessus le premier et je le remplis de vert, ou j’utilise un masque de fusion pour vider l’intérieur du premier rond ! Je peux utiliser les outils d’alignement vus à l’étape 3 pour aligner parfaitement les deux ronds.

JPEG - 22.6 ko

ETAPE 5

Tout simplement avec l’outil texte, j’ajoute le label menu en haut de mon sélecteur.

JPEG - 22.7 ko

ETAPE 6

Je crée grâce aux formes personnalisées le contrôleur de droite. Je pense qu’il n’y a pas besoin de plus d’explications sur la création de deux triangles et une barre grise ?

JPEG - 22.8 ko

ETAPE 7

Même chose pour tous les contrôleurs.

JPEG - 22.9 ko

ETAPE 8

Avec l’outil des formes personnalisées : je crée un rectangle arrondi noir sur le haut de mon Ipod (celui-ci correspond à l’écran).

JPEG - 24.1 ko

ETAPE 9

J’ajoute deux styles de calques, une incrustation de couleur et une lueur interne noire dont voici la configuration :

JPEG - 33.6 ko
JPEG - 64.3 ko
JPEG - 24 ko

ETAPE 10

Je vais créer la partie supérieure de mon écran : très simplement, je crée un nouveau calque et sur celui-ci je crée une barre en haut remplie d’un gris clair et sur les bords gauche et droit, des parties plus sombres. Voir ci-dessous pour plus de détails :

JPEG - 53.5 ko
JPEG - 24.3 ko

ETAPE 11

J’ajoute le titre de mon album écouté sur mon Ipod (j’invente, de toute manière le titre n’est pas visible ;)

JPEG - 24.4 ko

ETAPE 12

J’ajoute la pochette de mon album préféré !

JPEG - 35.3 ko

ETAPE 13

Je crée un nouveau calque sous ma pochette d’album, je récupère la sélection de la pochette, je descends la sélection et sur le calque dernièrement créé j’ajoute une lueur gris-claire.

JPEG - 35.3 ko

ETAPE 14

J’ajoute une barre de progression, qui est tout simplement composée d’un rectangle gris-clair et de la même barre coupée mais en couleur bleue !

JPEG - 35.6 ko

ETAPE 15

J’ajoute les informations de lecture tout autour de ma barre de progression, j’utilise tout simplement l’outil de texte.

JPEG - 35.9 ko

ETAPE 16

Je vais maintenant créer la lueur qui se trouve derrière mon Ipod, je crée donc un nouveau calque que je place juste en dessous de la base verte de mon Ipod (dans la fenêtre des calques). Je récupére la sélection de ma base Ctrl + Clic sur le calque et je remplis la sélection avec le pot de peinture noire.

Je vais maintenant diffuser ma forme noire, pour cela je vais dans le menu atténuation puis flou gaussien, je sélectionne 3 px et je clique sur ok.

Et enfin j’ajoute un masque de fusion, je crée un dégradé de noir vers blanc du haut vers le bas, pour cacher toute la partie supérieure de ma lueur.

JPEG - 35.9 ko

ETAPE 17

Avec la même technique et sur un nouveau calque je crée une ellipse noire qui va me permettre de créer une seconde ombre. Voir ci-dessous.

JPEG - 38 ko

ETAPE 18

Comme à l’étape 17, je crée un masque de fusion pour camoufler les parties indésirables.

JPEG - 36.1 ko

ETAPE 19

Je place tous mes calques dans un dossier que je duplique autant de fois que je veux avoir d’ipod sur ma composition. Il ne me reste plus qu’à modifier les couleurs de chacun pour donner ceci.

JPEG - 73.4 ko

ETAPE 20

Je vais maintenant attaquer la seconde étape, la création de la coulée de peinture, pour cela très simple : une forme créée avec la plume et un style de calque pour le biseautage. Pour commencer je crée la forme.

JPEG - 38.9 ko

ETAPE 21

J’ajoute mon style de calque : biseautage et estampage.

JPEG - 73.8 ko
JPEG - 38.9 ko

ETAPE 22

Je duplique ma forme et je la place en dessous de chaque Ipod. Je modifie bien entendu la couleur en conséquence.

JPEG - 94.3 ko

ETAPE 23

J’ajoute un titre juste au dessus, pour un souci de police, j’en ai choisi une que tout le monde doit avoir, c’est Arial : )

JPEG - 92.4 ko

ETAPE 23

Et pour terminer le tout, j’ajoute deux styles de calques : une incrustation de dégradés et un biseautage dont voici la configuration :

JPEG - 76.1 ko
JPEG - 154.6 ko

Et voici ma composition finale ! On s’y tromperai non ? Bon je suis sûr qu’il y a moyen de faire un mieux sur le rendu global et l’ambiance de la photo mais je vous laisse le soin de vous appliquer mieux que moi ; )

JPEG - 86.1 ko

N’hésitez pas non plus à créer votre Ipod perso avec des couleurs plus originales que celle–ci ;) et poster ensuite vos créations dans la galerie se trouvant en haut de cette page.

Pour toute question, vous pouvez poster vos messages dans le forum ci-dessous.

Bonne chance à tous pour la réalisation de votre Ipod nano chromatique.

Messages

Un message, un commentaire ?

Forum sur abonnement

Pour participer à ce forum, vous devez vous enregistrer au préalable. Merci d’indiquer ci-dessous l’identifiant personnel qui vous a été fourni. Si vous n’êtes pas enregistré, vous devez vous inscrire.

Connexions’inscriremot de passe oublié ?