Handy Web 2.0 Icons Dans Photoshop

Lorsque nous travaillons sur un projet de conception Web, nous avons souvent besoin d'icônes pour afficher des commandes telles que Ajouter, Supprimer ou Modifier. Avec la tendance Web 2.0, l’utilisation de badges et de 3D subtile est devenue très populaire. Dans ce didacticiel, je vais vous montrer comment créer un effet 3D très simple à utiliser dans les boutons et les icônes ou les éléments nécessitant une certaine profondeur..

Étape 1

Créez un nouveau document et sélectionnez l'outil Ellipse (U). Peu importe la couleur que vous utilisez car elle sera remplacée plus tard par les styles de calque..

Étape 2

Double-cliquez sur le calque ellipse pour ouvrir la boîte de dialogue Style de calque. Sélectionnez ensuite le calque dégradé et utilisez une nuance de bleu et une nuance de bleu plus claire pour les couleurs de dégradé. Pour le style, utilisez Radial. Ajoutez ensuite un biseau et un estampage comme indiqué ci-dessous.

Conseil: déplacez le dégradé radial plus en haut du cercle. Pour ce faire avec la boîte de dialogue Style de calque toujours ouverte, assurez-vous que vous vous trouvez dans la section Incrustation en dégradé, cliquez et maintenez le bouton enfoncé pour commencer à déplacer le dégradé..

Étape 3

Dupliquez le calque circulaire et redimensionnez-le pour le rendre légèrement plus petit, comme dans l'image ci-dessous.

Étape 4

Double-cliquez sur le nouveau calque pour ouvrir la boîte de dialogue Styles de calque. Désélectionnez tous les effets précédents (Bevel and Emboss and Gradient Overlay). Maintenant, sélectionnez Stroke et pour le type de remplissage, sélectionnez Gradient. Pour les couleurs, sélectionnez le blanc aux deux extrémités du dégradé et réglez l'opacité sur 0% pour le début et sur 100% jusqu'à la fin..

Étape 5

Sélectionnez l'outil de type horizontal (T) et créez un calque de texte. Assurez-vous que cette couche est en haut. Maintenant, ouvrez la boîte Styles de calque et modifiez le calque couleur en blanc, sélectionnez Inner Shadow et utilisez les paramètres indiqués ci-dessous..

Étape 6

Regroupez les trois couches et appelez-le "Cercle bleu".

Étape 7

Sélectionnez l'outil Polygone (U) et modifiez certains paramètres comme indiqué ci-dessous pour créer un badge étoile. Dupliquez le calque et redimensionnez-le comme à l'étape 3.

Au lieu d'appliquer ces styles de calque au calque, copiez simplement le style de l'icône précédente créée et collez-le dans notre nouveau calque. Pour ce faire, sélectionnez le calque dont vous souhaitez copier le style, calquez le bouton droit de la souris (Macs: Option-Click) et choisissez Copier le style du calque. Sélectionnez ensuite le calque auquel vous souhaitez ajouter le style, cliquez de nouveau avec le bouton droit de la souris et choisissez Coller les styles de calque..

La seule chose que vous devrez changer sera les couleurs de dégradé sous le calque dégradé..

Conclusion

C'est l'un des moyens les plus simples de créer un bouton de style 3D cool. Vous pouvez modifier certains paramètres tels que la couleur du dégradé du trait et créer différents styles 3D..