Her

Home Photoshop Tutorials Drawing Techniques Zoom Player Skin Design

Zoom Player Skin Design

Author: Adobetutorialz.com Author's URL: www.adobetutorialz.com More by this author

Start by creating a new file (File>New) with 1024x768 px and 72 dpi. Using the Paint Bucket Tool (G), it's possible to give black color to the new file.

image 1

Select the Rectangle Tool (U) to represent the same plane surface from below:

image 2

Select for the new layer the next shown parameters by making a mouse click on the processed layer on the layers' panel: Fill 0%

Blending Options>Gradient Overlay

image 3

Gradient's parameters:

image 4

image 5

Applying the Rounded Rectangle Tool (U) with a radius of 5 px, it's possible to represent the primary layer of a media player on the picture we already have.

image 6

The layer's parameters: Blending Options>Bevel and Emboss

image 7

Blending Options>Gradient Overlay

image 8

Gradient's parameters:

image 9

image 10

Select again the Rectangle Tool (U) and try to represent a special zone reserved for the media player's screen.

image 11

The layer's parameters: Blending Options>Gradient Overlay

image 12

Gradient's parameters:

image 13

Blending Options>Stroke

image 14

image 15

On the bottom part of the media player we'll have to represent a zone reserved for the menu's buttons. Use in this case the Rounded Rectangle Tool (U) with a radius of 20 px. Then press Alt button while using the Ellipse Tool (U) to cut out a special zone reserved for the main central button.

image 16

The layer's parameters: Fill 0%

Blending Options>Inner Glow

image 17

Blending Options>Stroke

image 18

image 19

Use next the Rounded Rectangle Tool (U) with a radius of 10 px to represent the panel of play indicator.

image 20

The layer's parameters: Blending Options>Inner Glow

image 21

Blending Options>Gradient Overlay

Gradient's parameters:

image 22

Blending Options>Stroke

image 23

image 24

Use again the Ellipse Tool (U) with the color #282D33 to draw on the top part of the media player several elements reserved for the system buttons.

image 25

image 26

The Rounded Rectangle Tool (U) will be helpful in drawing a special frame for the system buttons.

image 27

The layer's parameters: Fill 0%

Blending Options>Inner Glow

image 28

Blending Options>Stroke

image 29

image 30

Create a new layer on which we shall use the Pencil Tool (B) (brush of 1 px) with white color (Fill 50%) to represent the symbols on the system buttons and on the top left corner.

image 31

image 32

image 33

Take the Ellipse Tool (U) and start drawing the Play button for the player.

image 34

The layer's parameters: Blending Options>Inner Glow

image 35

Blending Options>Gradient Overlay

image 36

Gradient's parameters:

image 37

Blending Options>Stroke

image 38

Gradient's parameters:

image 39

image 40

Make five copies of the layer containing the button and select the Free Transform option to make the necessary changes on the copies' sizes and on their placement on the picture.

image 41

Create again a new layer and use on it the Pencil Tool (B) (brush of 1 px) with the color #2C3437 to represent different symbols on the player's buttons.

image 42

Make copies of the layers composing the buttons' symbols and select Free Transform option to turn over the copies and place them the way shown below:

image 43

Next we have to draw on the left side of the play panel the sound's indicator. The instrument applied in this case is Rounded Rectangle Tool (U) with a radius of 10 px.

image 44

The layer's parameters: Fill 0%

Blending Options>Inner Glow

image 45

Blending Options>Stroke

image 46

Zoom Player Skin Design