Malgré le fait que je ne sois pas un grand fan d’Internet Explorer, le défi de recréer le logo IE7 dans Fireworks vaut vraiment la peine.
Nous allons vous montrer comment créer ces effets et la façon d’utiliser de nouveaux outils Fireworks que nous n’avons pas utilisé dans nos tutoriels pour le moment.
ETAPE 1
Commençons par la création de notre lettre, nous sommes sur la lettre «a». Nous avons choisi la police Helvetica, mais vous pouvez utiliser celle que vous souhaitez. Colorisez-le avec # 000. Maintenant, nous allons le travailler en courbes, pour cela, faites un clic droit dessus, puis allez à Convertire en chemins (Convert to paths). Cela va le convertir et laisser la couche groupée, dégroupez-la afin que nous puissions travailler un peu plus les points.
ETAPE 2
Maintenant dupliquez cette couche, et appliquez, pour celui du dessus, une Barre dégradée (Gradient Bars), avec la couleur indiquée.
ETAPE 3
La couche laissée dessous sera notre bordure noire. Pour cela, le « a » du dessus devra être un peu plus petit. Sélectionnez la commande Modifier (Modify)> Altérer le chemin (Alter Path)> Introduire un chemin (Inset Path). Sélectionnez Dedans (Inside) et une de largeur 5. Après cela, procédez comme le montre l’image suivante, sélectionnez les points et continuez à modifier afin que l’alignement soit bon et l’espacement régulier. Au bas de ce « a » il faut rester très proche de la frontière pour rendre l’effet escompté.
ETAPE 4
Maintenant, nous allons appliquer des Biseaux (Bevels) et des Ombres (Shadows) dans cette couche. Nous utiliserons 2 Biseaux et 1 Ombre intérieur (Inner Shadow). Insérez les valeurs comme indiqué dans chacun des filtres.
ETAPE 5
Une grande partie de la structure est prête, maintenant nous allons commencer à créer les effets. Faisons la réflexion de la section du haut. Pour cela, dupliquez tout simplement le calque qui contient le « a » bleu et effacez les points désignés dans la figure. Après cela, ajustez la courbe et appliquez un dégradé linéaire (Linear Gradient) avec les deux parties en # FFF et alpha à 0% dans l’un des côtés.
ETAPE 6
Maintenant, nous allons faire l’effet de lumière qui vient vient du fond, ce qui se fera en utilisant 3 ellipses. Appliquez les couleurs indiquées et notez que nous utilisons une plume (Feather) et un filtre (Filter). Ensuite, groupez les 3 éléments.
ETAPE 7
Appliquons un masque dans ce groupe. Sélectionnez le « a »bleu et copiez-le (CTRL + C), puis allez à Modifier (Modify)> Masquer (Mask)> Coller en tant que masque (Paste As Mask). Dupliquez ce calque et appliquez le filtre de superposition sur les deux calques, avec un alpha de 60% sur celui du haut.
ETAPE 8
Maintenant nous devons créer les arches jaunes. Nous utiliserons les ellipses. Créez 2 ellipses comme indiqué. Pour réussir la forme correcte et la taille, utilisez l’outil « q » dans les options de déformation (Distortion Options), ce sera plus facile. Après avoir créé ces 2 ellipses, allez à Modifier (Modify) > Combiner les chemins (Combine Paths) > Composter (Punch). L’arc final sera #F8A30A . Faites quelques ajustements à la pointe en bas pour la faire paraître comme vennant de derrière la lettre.
ETAPE 9
Dans cette forme, nous appliquons une lueur interne avec les valeurs de 2 50% 6 0. Ensuite, nous allons créer une nouvelle forme avec l’outil plume (Pen Tool). Laissez-la sous la voûte avec le dégradé linéaire avec pour les deux parties la couleur # F8A30A et un côté avec 0% d’alpha, comme indiqué.
ETAPE 10
Créons l’ombre de l’arc. Dupliquez l’arc jaune, rendrez-le plus petit et réglez-le à # 000000.Appliquez un Dégradé radial (Radial Gradient) et rendez les couleurs très douces en utilisant les valeurs alpha. Maintenant nous allons appliquer un masque dans cette ombre. Copiez le « a » bleu (CTRL + C) et de répétez le dernier processus, sélectionnez l’ombre et aller Modifier> Masquer> Coller en tant que masque.
RÉSULTAT FINAL
Votre effet devrait ressembler à ceci. Nous pouvons aussi faire quelques ajouts et jouer avec les couleurs.
A propos de l’auteur
Je suis du Brésil, co-fondateur de Zee avec Fabio. Aujourd’hui, j’aime à jouer avec Fireworks, Photoshop et améliorer mes compétences en CSS. Je vous invite à me suivre sur Twitter.
Commentez, réagissez. Donnez nous votre avis.
Laisser un commentaire ci-dessous.