Mobile Me est un service qui a été lancé par Apple en 2008. Son logo représente un nuage visuellement sympathique que je vous propose de recréer à l’aide de Fireworks CS3.
Le logo de Mobile Me intrègre derrière le nuage des icônes d’applications que nous n’allons pas aborder pour que ce tutorial puisse rester accessible à un plus grand nombre de personnes. Il n’est cependant pas impossible que vous retrouviez les méthodes de construction de ces icônes dans des tutoriaux ultérieurs.
Commencez par créer un rectangle aux bords arrondis. Appliquez un raduis maximum pour que les extrémité du rectangle ressemblent à des cercles. Appliquez ensuite un dégradé bleu clair et une bordure plus foncée.
Prenez maintenant la plume afin de modifier la forme que nous venons de créer. Il vous faudra créer un nouveau point et modifier les courbes de bézier afin de faire ressembler l’une des extrémités de notre rectangle à un cercle.
Créez un nouveau cercle d’une couleur quelconque et appliquez une ombre intérieure selon les réglages suivants. Veillez à cocher la case “Knock Out” qui fera apparaître unique l’ombre intérieur que nous voulons appliquer.
Positionnez le cercle de telle manière à ce qu’il soit décalé par rapport au reste de la forme.
Maintenant, vous allez devoir créer un nouveau cercle en appliquant un dégradé. Ce dégradé doit aller du bleu vers le blanc et l’opacité de 50% à 100%.
Créez ensuite un second cercle un peu plus petit. Appliquez une ombre interne selon les réglages suivants. Veillez à cocher la case “Knock Out” comme vous l’avez fait précédemment.
Placez ensuite ce cercle derrière notre forme principale.
Dupliquez la forme que vous avez créé dans l’étape 5. Placez le cercle au-dessus de tous les autres, de la même manière que dans la figure suivante.
Vous pouvez vous amuser à ajouter autant de cercles que vous voulez à votre nuage. Vous pouvez par exemple supprimer le contour de certains cercles afin de varier les effets.
Créons maintenant un peu de brouillard. Dessinez une forme de type “patate” et remplissez-le d’un dégradé allant du blanc vers le bleu clair.
Appliquez un flou gaussien d’environ 7 à la forme que vous venez de créer. Ceci va permettre de masquer les croisement des bordures des bulles qui sont en trop. Modifiez votre patate en fonction de ce que vous voulez masquer ou “brouiller”.
Ajoutons le texte “mobile” avec la police Arial Rounded. Vous pouvez appliquer une légère ombre intérieure au texte pour lui donner plus de profondeur.
Au tour du “me” maintenant. Appliquez un dégradé à ce texte si vous voulez un résultat identique à celui qu’Apple a voulu donner. De la même manière que pour le texte précédent, vous pouvez appliquer une ombre intérieure afin de donner de la profondeur à ce texte.
Dernière petite touche : Dessinez une forme de couronne et remplissez-la de bleu. Cette forme va permettre de donner un peu de relief à notre nuage.
Appliquez un dernier flou gaussien à cette forme, et voilà !
Pour ceux qui veulent aller un peu plus loin, je vais maintenant décrire les techniques permettant d’appliquer une ombre et de faire un reflet sur le nuage.
Créez une nouvelle forme grise derrière votre nuage.
Applatissez la forme comme ci-dessous :
Pour créer le reflet, il faut d’abord dupliquer notre nuage.
Transformez ensuite le nuage en le renversant.
Pour créer le dégradé du reflet, nous allons utiliser un masque. Créez un rectangle rempli d’un dégradé allant de gris foncé (en haut) vers noir (en bas). Sélectionnez ensuite votre rectangle, appuyez sur SHIFT, et sélectionnez le calque correspondant à votre nuage retourné.
Sélectionnez ensuite Modify > Mask > Group as mask pour créer le masque. Libre à vous de retoucher le dégradé de votre masque pour modifier l’opacité du reflet.
Hey there, I’m Ben ! I’m multimedia project manager, and when I’m not designing or writing posts, I listen to good music like Jack Johnson.
Faites nous part de ce qui vous inspire sur le web en ce moment.
