Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos.  Home Photoshop Web Layout Mobile Theme Design

Mobile Theme Design


Create a new file having 200x210 px and 350 dpi. Select this instrument to represent the background also.

image 2

Blending Options-Gradient Overlay

image 3

Gradient's parameters:

image 4

Take after that the shown tool image 5 to represent the corps designed for a button. It will have black color.

image 6

Blending Options-Stroke

image 7

Gradient Editor

image 8

Applying the previous instrument we must create on the upper part of the button a layer having the following parameters:

image 9

image 10

Fill 0% on the layers.

Blending Options-Gradient Overlay

image 11

Gradient's parameters:

image 12

Blending Options-Stroke

image 13

Gradient's parameters:

image 14

Take the next tool to draw the central part of the button's corps.

image 16

Blending Options-Gradient Overlay

image 17

Gradient's parameters:

image 18

Using the last instrument, it's possible to represent the flare on the upper part of the central button's part. The flare's color is 464646.

image 19

Select the same instrument for drawing a black stripe on the same upper part of the button's corps.

image 20

Blending Options-Stroke

image 21

Gradient's parameters:

image 22

Using the following instrument image 23 , create a circle on the left side.

image 24

Blending Options-Inner Glow

image 25

Blending Options-Gradient Overlay

image 26

Gradient's parameters:

image 27

Blending Options-Stroke

image 28

Gradient's parameters:

image 29

Selecting the previous instrument, represent the flare inside the created earlier circle.

image 30

image 31

Fill 0% on the layers.

Blending Options-Gradient Overlay

image 32

Gradient's parameters:

image 33

Write now the button's tile. You have the demands below for writing it.

image 34

image 35

Take the shown tool image 36 for drawing on the upper part of the button's corps gleam.

image 37

Fill 0% on the layers.

Blending Options-Gradient Overlay

image 38

Gradient's parameters:

image 39

Mobile Theme Design Tutorial: Final Result

The final result!



Author's URL: Adobetutorialz.com
Thank you for voting.
Rate this Materials:
Bad 
1 2 3 4 5 Excellent
print this page subscribe to newsletter subscribe to rss

Advance your current skills or acquire new skills in Photoshop by creating projects using our step-by-step tutorials. More Tutorials: Most Popular Materials | Fresh Materials | TutorialKit New Photoshop Tutorials

Add comments to "Mobile Theme Design"

Only registered users can write comment

No comments yet...