Hey guys back-to-back Tutoriaux Photoshop. Dans ce tutoriel, je vais vous apprendre à créer I-Phone tels que le bouton dans Photoshop. C'est très simple et très efficace tutoriel. J'espère que vous apprécierez ce didacticiel.

Final Preview

C'est ce que nous allés faire aujourd'hui

Étape # 1

Ouvrir Photoshop et créer un nouveau document, la mienne est de 550 × 398px avec un fond blanc.

Étape # 2

Remplir la couleur dans la couche de fond, la couleur le mien est # 333333.

Étape # 3

Créez un nouveau calque nom du gradient couche Stripe. Choisissez l'outil Rectangle de sélection et de créer des bandes blanches.

Styling cliquez sur le Stripe double-couche sur la vignette du calque à rayures dans le panneau Infos pratiques, d'ouvrir le boîte de dialogue Styles de calques, nous allons appliquer un effet de gradient vertical de votre arrière-plan. Cliquez ensuite sur le gradient c olor sur la droite de l'option de dégradé pour ouvrir les couleurs Éditeur de dégradé.

Double-cliquez sur left-color-stop et entrez la valeur de couleur # aaaaaa, double-cliquez sur la gauche-centre-color-stop et entrez la valeur de la couleur # cccccc, double-cliquez sur la droite-centre-color-stop et entrez le valeur de la couleur # dddddd, puis double-cliquez sur right-color-stop et entrez la valeur de couleur # ffffff.

Devrait ressembler à ceci.

Étape # 4

Sélectionnez l'outil Rectangle arrondi et bouton de création, de rayon mine est 90X40px.

Maintenant, appliquez un effet

Gradient Overlay

Styling le double-cliquez sur le bouton sur la vignette du calque bouton dans le panneau Infos pratiques pour ouvrir les Styles de calques boîte de dialogue, nous allons appliquer un effet de dégradé vertical pour votre bouton. Cliquez ensuite sur le gradient de couleur sur la droite de l'option de dégradé pour ouvrir les couleurs Éditeur de dégradé.

Double-cliquez sur left-color-stop et entrez la valeur de la couleur # 000000, double-cliquez sur la gauche-centre-color-stop et entrez la valeur de la couleur # 222222, double-cliquez sur la droite-centre-color-stop et entrez le valeur de la couleur # 444444, puis double-cliquez sur right-color-stop et entrez la valeur de couleur # 666666.

Biseautage et estampage

Appliquez ensuite le biseau et estampage style de calque. Modification du style de la Outer Bevel, que de changer les valeurs de la profondeur, la taille et ramollir. Je choisis de régler la profondeur à 100%, la taille à 1px et ramollir à 10px

Une partie importante de ce tutoriel: garder l'angle à -90 ^o, Altitude à 40 ^o

Highlight Mode: Je choisis de régler l'Opacité à 100%.

Mode Shadow: Je choisis de régler l'Opacité à 100%.

Mouvement

Enfin, nous allons appliquer les accidents cérébrovasculaires. Changeant d'abord les valeurs de la taille. Je choisis pour définir la taille de 1px. Le changement de position à l'intérieur

Je choisis de régler l'opacité à 80%.

Changer la couleur du trait de la valeur par défaut à # 222222

Devrait ressembler à ceci.

Étape # 5

Sélectionnez l'outil texte et tapez du texte sur le devant.

Nous allons appliquer un effet pour le texte.

Bevel Emboss

Double-cliquez sur la vignette du calque de texte dans le panneau Infos pratiques, d'ouvrir les Styles de calques boîte de dialogue. Nous allons appliquer Bevel Emboss, changeant d'abord le style pour Outer Bevel et Technique de forage Soft, que de changer les valeurs de la profondeur, direction, la taille et ramollissent. Je choisis de régler la profondeur à 130%, Direction de taille en dessous à 1px et ramollir à 0px

Une partie importante de ce tutoriel: garder l'angle à ⁹⁰ °, Altitude à 30 ^o

Highlight Mode: Je choisis de régler l'opacité à 0%.

Mode Shadow: Je choisis de régler l'opacité à 50%.

Final Preview

Enfin, nous avons fait ce tutoriel.

C'est ce que nous allés faire aujourd'hui

Télécharger le fichier source

Si vous souhaitez vérifier votre travail, vous mai télécharger le fichier PSD pour ce tutoriel.

iphone-like-buttons.rar (21.3 ko)

Classé sous: Photoshop, Tutoriels par admin