APP制作教程Word版

1、传播优秀Word版文档 ，希望对您有帮助，可双击去除！笔记信息用Photoshop绘制音乐播放器界面第一步：制作界面上用到的icon（1）点击菜单“文件 新建”或者快捷键“CTRL+N”，在“新建”对话窗口中，大小设为200200，分辨率设为72，如图所示。传播优秀Word版文档 ，希望对您有帮助，可双击去除！（2）鼠标左键点击“菜单首选项参考线、网格与切片”，设置网格线间隔为25像素，使网格为4，如图所示。鼠标左键点击“视图显示网格，使网格处于勾选状态。（3）鼠标左键在工具箱上点击“椭圆工具”，在画布上画一个圆，结果如图所示。（4）再用矩形工具画出钟面上一长一短两个指针，然后将圆所在图层和矩

2、形所在图层分别合并（CTRL+E），并减去顶层形状，具体方法参考“Photoshop矢量图形工具”这一章，然后用颜色“#b3b3b3”填充该图层，最后结果如图所示。传播优秀Word版文档 ，希望对您有帮助，可双击去除！（5）继续通过矢量形状相减的方法制作电池图标，如图所示。（6）通过矩形工具和图层合并，制作信号强度图标，如图所示。（7）用矢量图形工具，制作如图所示的图标，制作的过程中会用到“图层合并”、“减去顶层形状”、“合并形状组件”、“变换路径水平翻转”，“变换路径垂直翻转”等方法。传播优秀Word版文档 ，希望对您有帮助，可双击去除！传播优秀Word版文档 ，希望对您有帮助，可双击去除！

3、第二步：制作界面（1）点击菜单“文件 新建”或者快捷键“CTRL+N”，在“新建”对话窗口中，选择“移动设备”，大小设置为320480，分辨率自动设置为72，设置如图所示。（2）为新建的画布设置“中间略亮、周边略暗”的背景，前面已经用过多种方法来实现这一目的，现在采用一个新的方法。新建一个图层，然后用工具箱中的矩形工具，画一个550650像素的矩形。然后在工具选项栏上选择渐变填充，渐变类型为“径向”，色标的设置如图所示。传播优秀Word版文档 ，希望对您有帮助，可双击去除！（3）鼠标左键点击工具箱上的“路径选择工具”，在工具选项栏上，先勾选“对齐到画布”，然后选择“水平居中”和“垂直居中”，这

4、样绘制的矩形就和画布对齐了，如图所示。传播优秀Word版文档 ，希望对您有帮助，可双击去除！（4）先将前景色设置为“#1b1b1b”，鼠标左键点击工具箱上的“矩形工具”，在画布的顶端，绘制一个32022像素的矩形，作为状态栏，如图所示。（5）现在要将前面第一步制作的各种图标拷贝到当前文件当中，两个PSD文件之间拷贝图层的步骤：在图层面板中，鼠标右键单击图标所在的图层，在弹出的菜单栏中选择“复制图层”，这时会打开复制图层对话窗口，在窗口中选择目标文档为当前文档，然后鼠标左键点击“确定”，当前PSD文档中的图层就会复制到目标文档中，如图所示。（6）通过自由变换，将这些图标调整到合适大小，并且放到适

5、当的位置上，结果如图所示。然后将这些图层放到一个图层组中。（7）用工具箱中的圆角矩形工具画一个32043像素的圆角矩形作为“状态栏”，在属性面板中将圆角设置为3像素。在工具选项栏上，对圆角矩形做渐变填充，设置如图所示。传播优秀Word版文档 ，希望对您有帮助，可双击去除！（8）鼠标左键在图层面板中，双击刚才创建的状态栏图层，打开图层样式对话窗口，勾选“内阴影”，设置如图所示。（9）在图层样式对话窗口，勾选“投影”，设置如图所示。传播优秀Word版文档 ，希望对您有帮助，可双击去除！（10）鼠标左键点击工具箱当中的圆角矩形工具，在如图所示的位置画一个大小为2727像素，圆角为3像素的圆角矩形，如

6、图所示。（11）鼠标左键在图层面板中双击刚才创建的圆角矩形图层，打开图层样式对话窗口。将图层的填充不透明度设置为零，这样只有图层样式起作用，图层的内容不会被显示出来，如图所示。（11）在图层样式对话窗口，勾选“描边”，设置如图所示。传播优秀Word版文档 ，希望对您有帮助，可双击去除！（12）用和前面类似的方法将齿轮图标图层加入到本文件当中，通过自由变换修改为合适的大小，然后放在适当的位置上，然后为该图层添加一个“投影”图层样式，设置如图所示。（13）用和前面类似的方法在导航栏的左侧画一个“回退”按钮，可以采用把右边的“圆角矩形”复制到左边的方法。箭头的画法是：用钢笔工具在圆角矩形的左侧边添加

7、一个锚点，然后用直接选择工具，选中这一点向左拖动。传播优秀Word版文档 ，希望对您有帮助，可双击去除！（14）然后在导航栏上加入歌曲名，结果如图所示。然后将导航栏的个图层归到一个组中。（15）鼠标左键点击工具箱中的矩形工具在导航栏下画一个大小为32036的矩形，作为显示音乐播放位置的“位置栏”，该矩形和上面的导航栏保持1像素的间距。在工具选项栏上，对矩形做渐变填充，设置如图所示。（16）在图层面板中，鼠标左键双击刚才创建的状态栏图层，打开图层样式对话窗口，勾选“内阴影”，设置如图所示。传播优秀Word版文档 ，希望对您有帮助，可双击去除！（17）在图层样式对话窗口中勾选“投影”，设置如图所示

8、。（18）鼠标左键点击工具箱上的圆角矩形工具，在“位置栏”上画一个大小为26010，圆角为5像素的圆角矩形，然后在工具选项栏上设置渐变填充，设置如图所示。传播优秀Word版文档 ，希望对您有帮助，可双击去除！（19）打开图层样式对话窗口，勾选“内阴影”，设置如图所示。（20）图层样式对话窗口中勾选“投影”，设置如图所示。（21）在如图所示的位置再画一个圆角矩形。传播优秀Word版文档 ，希望对您有帮助，可双击去除！（22）在工具选项栏上，对矩形做渐变填充，设置如图所示。（23）打开图层样式对话窗口，勾选“内阴影”，设置如图所示。传播优秀Word版文档 ，希望对您有帮助，可双击去除！（24）打开

9、图层样式对话窗口，勾选“渐变叠加”，设置如图所示。（25）鼠标左键点击工具箱上的椭圆工具，在如图所示的位置画一个圆，渐变填充如图所示。传播优秀Word版文档 ，希望对您有帮助，可双击去除！（26）打开图层样式对话窗口，勾选“内阴影”，设置如图所示。（27）在图层样式对话窗口，勾选“投影”，设置如图所示。传播优秀Word版文档 ，希望对您有帮助，可双击去除！（28）鼠标左键点击工具箱上的椭圆工具，在如图所示的位置画一个圆。（29）在工具选项栏上，对圆做渐变填充，设置如图所示。传播优秀Word版文档 ，希望对您有帮助，可双击去除！（30）然后再位置栏两侧加入时间，如图所示。（31）鼠标左键点击工具

10、箱上的椭圆工具，画一个大小为5050像素的圆，并在工具选项栏设置填充如图所示，传播优秀Word版文档 ，希望对您有帮助，可双击去除！（32）打开图层样式对话窗口，勾选“内阴影”，设置如图所示。（33）在图层样式对话窗口，勾选“投影”，设置如图所示。传播优秀Word版文档 ，希望对您有帮助，可双击去除！（34）复制播放按钮图层，大小改为3434，并移动到播放按钮的两侧，如图所示。（35）播放按钮图层下面新建一个图层，画一个圆，大小为6464，设置渐变填充如图所示。传播优秀Word版文档 ，希望对您有帮助，可双击去除！（36）以同样的方法在快进和快退图层下添加大小为4646的两个圆，结果如图所示。

11、（37）通过和前面一样的在不同PSD文件之间复制图层的方法，给上面的三个按钮加上图标，结果如图所示。传播优秀Word版文档 ，希望对您有帮助，可双击去除！（38）在加入静音和重复播放图标，如图所示。（39）对静音和重复播放图标所在的图层，打开图层样式对话窗口，勾选“内阴影”，设置如图所示。（40）在图层样式对话窗口，勾选“投影”，设置如图所示。传播优秀Word版文档 ，希望对您有帮助，可双击去除！（41）鼠标左键点击菜单“文件 置入”将素材图片加入到指定的位置，如图所示。（42）将两侧图片所在的图层的填充降低为50%，结果如图所示。传播优秀Word版文档 ，希望对您有帮助，可双击去除！（43）用矩形工具在界面的底部画一个32048大小的矩形，并且设置渐变填充如图，结果如图所示。（44）分别在60，120，160，200，260像素的位置添加参考线，如图所示。传播优秀Word版文档 ，希望对您有帮助，可双击去除！（45）用工具箱中的添加锚点工具在，120，200像素的位置，和邻近的位置添加锚点，如图所示。（46）用