Your location:Tech News>Tips>Photoshop>Use ps to make radio icon retro wood UI icon, photoshop web icon

Latest News

Use ps to make radio icon retro wood UI icon, photoshop web icon

Author:fsadmin

Views:

  Examples of this tutorial is to teach you how to use ps to make radio icon retro wood UI icon, photoshop web icon tutorial is to design by layer style, you can say the difficulty of the tutorial itself is not great, as long as careful observation of the students step by step operation, we will be able to make a ps making radio icon retro wooden icons and other UI icon page use the following, we will do it together to practice it.

  We observe first before design, and how the whole point of difficulty is constituted under the icon where.We can see the icon is divided into three parts: the base, knobs, display, horizontal line, these are not considered a big problem, but mainly the base and display some trouble, we need to use multiple layers to make and use high light effect, this analysis has been completed count is half the battle, we use ps from the radio icon to make far.

  图标设计,设计黄色渐变木质复古收音机UI图标_www.29jc.com

  The following is a detailed procedure, you have to be careful Kane.

  step one:

  Create a page canvas to 500px * 500px, and rename radio to find and easy to remember, filled with the background color # c8beae.

  图标设计,设计黄色渐变木质复古收音机UI图标_www.29jc.com

  图标设计,设计黄色渐变木质复古收音机UI图标_www.29jc.com

  Step two:

  Draws a rectangle with rounded corners.Rounded Rectangle tool create a 320px * 320px 60px radius of a rounded rectangle, and the fill color to the color value # d29b4d rename base, adding a layer style.

  图标设计,设计黄色渐变木质复古收音机UI图标_www.29jc.com

  图标设计,设计黄色渐变木质复古收音机UI图标_www.29jc.com

  www.29jc.com

  图标设计,设计黄色渐变木质复古收音机UI图标_www.29jc.com

  Step three:

  Open the material, add a layer style to the material and hold ctrl + alt + g key to create a clipping mask layer in the end seat.

  图标设计,设计黄色渐变木质复古收音机UI图标_www.29jc.com

  图标设计,设计黄色渐变木质复古收音机UI图标_www.29jc.com

  Step Four:

  The production of high light portion of the base, to produce both a rounded rectangle, black used to select tool, click the step shape, the shape of the top layer and subtracts.

  图标设计,设计黄色渐变木质复古收音机UI图标_www.29jc.com

  图标设计,设计黄色渐变木质复古收音机UI图标_www.29jc.com

  Step five:

  The blend mode to Screen and the opacity to 40%, add layer mask, we do not need to erase the part.

  Step Six:

  Then use a tool to create rounded rectangle 283px * 278px 60px radius of the rounded rectangle, fill color value is set to # f8bf86 bright base rename.

  图标设计,设计黄色渐变木质复古收音机UI图标_www.29jc.com

  Step 7:

  A light-colored base layer replicate, set the color to # 96622f, rename base dark, and then moved into position.

  图标设计,设计黄色渐变木质复古收音机UI图标_www.29jc.com

  Step Eight:

  Continue to open the material, and the steps as above: Add a layer style to material Convert to Smart Object and create a clipping mask in the end seat dark.The group named as the base layer fight.

  图标设计,设计黄色渐变木质复古收音机UI图标_www.29jc.com

  图标设计,设计黄色渐变木质复古收音机UI图标_www.29jc.com

  图标设计,设计黄色渐变木质复古收音机UI图标_www.29jc.com

  Step 9:

  Now the display can be made, or create a 238px * 119px radius rounded rectangle with rounded rectangle tool 90px, and fill color value is set to # a4a29e rename screen base, a layer style added.

  图标设计,设计黄色渐变木质复古收音机UI图标_www.29jc.com

  图标设计,设计黄色渐变木质复古收音机UI图标_www.29jc.com

  图标设计,设计黄色渐变木质复古收音机UI图标_www.29jc.com

  Tutorial unfinished, see next page!

  12/2 Next

Recommend article

Relate article