Ce tutorial présente une technique permettant de créer des boutons sauce Web 2.0 avec Fireworks.
Deux versions de boutons sont disponibles : une version sobre avec peu de reliefs, et un autre bouton plus “glossy” comme ils disent là-bas. Avant toute chose, commençons par voir le résultat que nous voulons obtenir.
Commencez par créer une forme vectorielle “étoile” sur un nouveau document.
Il faut ensuite augmenter le nombre d’extrémités. Nous plaçons ici le nombre de points à 25. Votre étoile devrait alors avoir cette forme bizarre que nous pouvons voir ci-dessous.
Pour réduire la hauteur des pics, jouez sur la propriété radius de l’étoile jusqu’à obtenir le résultat suivant.
Donnons maintenant un peu de caractère à notre bouton. Appliquez un dégradé radial de la couleur que vous souhaitez en veillant à mettre la couleur la plus claire au centre du dégradé.
Dupliquez la forme de votre étoile et réduisez la taille de ce second calque à l’aide de l’outil de redimensionnement (Q). Vous pouvez maintenir les touches ALT et SHIFT lors du redimensionnement afin de garder un ratio égal à l’original (SHIFT), et appliquer une réduction de taille par rapport au centre de la forme (ALT).
Appliquez ensuite une ombre intérieure (inner shadow) selon les réglages suivants (voir l’image).
Si vous voulez donner un effet “glossy” ou “aqua” à votre bouton, il vous suffit de dupliquer une nouvelle fois la forme de votre étoile.
Créer ensuite une forme rectangulaire appliquée au dessus du bouton.
Sélectionnez cette forme et en restant appuyé sur (SHIFT), sélectionnez la dernière étoile que nous avons créé. Allez dans le menu “Modifier > Combiner > Poinçonner”. Ceci devrait avoir pour effet de couper la dernière forme d’étoile créée. Sélectionnez l’outil Plume (P) pour créer un nouveau point sur la ligne diagonale.
Modifiez le point afin d’arriver à un résultat tel que celui ci-dessous
Définissez une opacité à 30 afin d’aller la couleur blanche de la forme, et voilà le travail. Il ne vous reste qu’à ajouter du texte à votre bouton si nécessaire.
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.
Bsr
un bon tuto et la manière très passionnante.
Merci Bcp pour ce tuto.
je souhaite être parmi les membres de ce site si possible. pour aider les débutant en design et Développement.
Vous avez mon adresse mail.
Le 12/24/2008 à 12:00 PM
Faites nous part de ce qui vous inspire sur le web en ce moment.
