内容提要：我们继续前行，看看我的第一个UI作品教程，详尽的操作步骤分享给大家.
这个图标的设计来源于我父亲，我记得小时候我父亲的职业是木匠和油漆工。那个时候我就觉得我的父亲就是神，一双手可以做出很多我想不到的东西，例如板车、衣柜门上的绣球花等等，那时候我是极崇拜他的，同时他也是我画画的启蒙老师。
所以在画这个图标的时候我希望可以用木刻的方式表现，主要想表达一种精致、细腻、古朴的感觉，设计过程中也参考了不少大神的作品。
制作背景
（1）打开Photoshop，然后按快捷键Ctrl＋N，打开“新建”对话框，接着在对话框中设置文档“名称”为“木质图标”，画布“宽度”为800像素，“高度”为550像素，“分辨率”为72像素/英寸，如图1所示，最后单击“确定”按钮即可完成画布的新建，如图2所示。
（2）在上图中可以看到背景的颜色为白色，我们可以通过一个简单的方法来改变背景的纹理，执行“文件/打开”菜单命令，如图3所示，然后在弹出的窗口中选择事先准备好的“布纹”素材，如图4所示，接着单击“打开”按钮，即可使素材图片打开到Photoshop中，如图5所示。
（3）执行，如图6所示，打开“图案名称”对话框，然后输入“名称”为“木纹”，接着单击“确定”按钮即可将图片保存为填充图案，如图7所示。
（4）关闭“布纹”文档，选中“”文档，然后执行“编辑/填充”菜单命令，如图8所示，打开“填充”对话框，接着设置“使用”为“图案”，并单击“自定图案”右侧的按钮在弹出的图案选项中选择最后一个图案，如图9所示，设置完成后单击“确定”按钮即可使图案平铺到画布中，如图10所示。
绘制图标底纹
（1）移动鼠标至工具箱中“矩形工具”处，然后按下鼠标左键，在打开的菜单选项中选择“圆角矩形工具”，如图11所示。
（2）移动鼠标至画布中，然后单击鼠标左键，打开“创建圆角矩形”对话框，接着在对话框中设置“宽度”和“高度”均为200像素，“半径”为30像素，如图12所示，再单击“确定”按钮即可在舞台中创建一个圆角矩形，如图13所示。
（3）打开素材文件夹，将文件夹中的木纹材质拖曳到Photoshop中，然后按住Shift键等比缩小图片至合适大小，接着在“图层”面板中选择木纹图层，再按住Alt键，在木纹图层和圆角矩形之间单击鼠标左键，即可将木纹剪切到圆角矩形中，如图14所示。
（4）双击圆角矩形所在图层，打开，勾选“内阴影”样式，然后双击该样式，可以对内阴影进行设置，本例中设置内阴影 的“混合模式”为“正片叠底”，“颜色”为深棕色（R:48,G:29,B:2）,“距离”为6像素，如图15所示。
（5）添加“内阴影”样式的目的主要是为了制作出木板的厚度感，接下来为圆角矩形添加轮廓高光。勾选“内发光”，然后双击该样式，接着设置“混合模式”为“滤色”，“不透明度”为37%，“大小”为“7像素”，“范围”为50%，如图16所示。
（6）轮廓光制作完成，接下来开始制作木板的投影。勾选“投影”样式，然后双击该样式，接着设置“混合模式”为“正常”，“颜色”为棕色，“不透明度”为16%，“距离”为31像素，“大小”为59像素，如图17所示，设置完成后单击“确定”按钮。
提示： 我们最终做两层投影。一层投影位置离木板较近，通常这个位置的投影会受到木板颜色的影响，因此在选择这个位置的颜色时应选择与木板接近的颜色，另一层投影为距离木板较远的部分，颜色通常为深色的背景色。下面步骤七就是制作距离更远部分的投影。
（7）选中圆角矩形所在的图层，按快捷键Ctrl+J复制图层，然后选中处于下层的图层，并删除图层样式“内阴影”和“内发光”，接着双击图层，打开“图层样式”对话框，设置投影的“样式”为“正片叠底”，颜色为深棕色，“不透明度”为70%，“距离”为36像素，“扩展”为7%，“大小”为68像素，如图18所示。
提示：如果采用将图层拖至图层面板创建新图层图标上的方法复制图层，则会出现木纹剪切效果失效的情况，遇到这种情况时只需要重新剪切一次即可。
（8）设置完成后，单击“确定”按钮保存设置，至此，如图19所示。
