ＰＳ基础图案设计与制作
案例一：基础图案
本教程的效果图是由一片最为简单的弧形组成。制作的时候我们只要做出一片弧形，然后通过复制及变换角度组成新的图形。然后把组合的图形再复制并改变颜色和图层混合模式，即可得到非常绚丽的效果图。
最终效果
| 1、新建一个800 * 800像素的文档，背景选择白色。新建一个图层，用钢笔勾出下图所示的选区。 |
| <图1> |
| | 2、把选区填充黑色，按Ctrl + D 取消选区，效果如下图，图形的弧度尽量自然一点。 |
| 3、按Ctrl + J 把当前图层复制一层，再按Ctrl + T 变形，把中心点移到图形的底部，再在属性栏把角度设置为：60度，然后按回车键确认，效果如下图。 |
| <图3> |
| | 4、按Ctrl + Alt + Shift + T 复制4个图层，组成下图所示的图像。然后把除背景以外的几个图层合并为一个图层。 |
| 5、锁定图层后把图层填充颜色：#A491C5，效果如下图。 |
| 6、按Ctrl + J 把当前图层复制一层，把图形填充颜色：#94CA，按Ctrl + T 旋转，角度为：10度，效果如下图。 |
| <图6> |
| | 7、按Ctrl + J 把当前图层复制一层，把图形填充颜色：#D93D95，同样按Ctrl + T 旋转10度，效果如下图。 |
| 8、同上的操作把复制后的图形填充颜色：#DF7496，同样再旋转10度。 |
| 9、同上的操作这次填充颜色：#E69C92，同样旋转10度。 |
| <图9> |
| | 10、同上的操作这次填充颜色：#EFC585。 |
| 12、同上的操作这次填充颜色：#94CA，效果如图12，确定后把图层混合模式改为“叠加”，效果如图13。 |
| <图13> |
| | 13、把当前图层复制一层，并旋转10度，图形填充颜色：#D93D95，图层混合模式为“叠加”不变。 |
| 14、同上的操作，图形颜色填充：#DF7496，效果如下图。 |
| 15、同上的操作，图形颜色填充：#E69C92，效果如下图。 |
| <图16> |
| | 16、同上的操作，图形颜色填充：#EFC585，效果如下图。 |
案例二：闪光标志
本教程的动画制作相对有点复杂，其中包括文字动画及周围彩色光点的动画。不过只要我们熟悉了动画的制作流程，然后慢慢构思动画的大致效果及表现方法。再用PS做出图形及每一帧动画。后期用IR稍微加工连成动画即可。
| 1、新建一个文件，背景为黑色，大小自定(我这里用的是500*200), 点击“横排文字蒙版工具”输入design 也可自定。 |
| 2、刚才输入文字忘了新建个层，现在补建一个(图层1), 点击编辑-描边，参数如图，确定。 |
|
| | 3、执行：滤镜 > 模糊 > 高斯模糊，半径也1像素，如下图。 |
| 4、在图层1添加图层样式，设置外发光，参数自定也可，只要达到想要的效果就行了。如下图。 |
| 5、再勾先内发光，颜色要比外发光的淡。(有发亮的感觉吧), 注意：混合模式要调为正常，颜色才看得出来。 |
|
| | 6、按CTRL点图层1，加载选区，选择-修改-扩展，数值为20像素，确定后选择菜单：选择-羽毛-像素为15，确定后保留选区，新建一个空白图层(图层2)如下图： |
| 7、把前景色也改成同你刚才外发光相同的颜色(这里的是绿色)，按ALT+DEL填充上颜色，再把图层的不透明度改为60%，现在的霓虹灯就算是初步完成的，接下来重头戏才慢慢开始。 |
| 8、新建一个空图层，切换到路径面板。点击自定形状工具，再选择相应的形状，在工作区接出一个路径，然后可以用工具条上的直接选择工具对路径进行变形(按照自己爱好就行了。如下图： |
| 9、点画笔画工具，在笔画预设-笔画笔尖形状，把笔画的间距设置成如图： |
| 11、因颜色动态里我们勾先了前景/背景抖动，所以画笔扫描出来的路径颜色是根据前景和背景进行抖动的，所以再把背景把改成黄色让抖动的效果更鲜艳。(用其他颜色也可) |
| 13、按住CTRL点扫描出来的图层(图层3)，载入选区，点击选择-修改-收缩，收缩量为2个像素。确定。 |
|
| | 14、点击选择-羽化.1个像素，确定，再选择图像-调整-亮度/对比度，把亮度提高，确定后取消选区。 |
15、这里少了个载图，只好几个步骤一起说了。合并图层1到图层2，把图层2复制一个副本。在图层2中新建调整图层-色彩平衡，在窗口中把滑块移向绿色。
| 因我用的是PS2里面就有一个动画，如果是其他老版本的就得转到ImageReady里处理了。操作方法是一样的，这里就以PS2为例了，找开动画面板，默认里面有一个帧，再复制2个。如图： |
| 16、把动画里的1帧对应图层2前的眼睛勾掉，把动画里的2帧对应图层2副本眼睛勾掉，我想大家对帧都有一定的了解。我这里就不作说明了。 |
| 20、点击第4个帧按动画帧过渡，参数同第1个帧一样，如图： |
|
| | 22、点击图层3(周边圆点)，复制6个副本。如图： |
| 23、在第1个帧上把对应的图层3眼睛显示，其他图层3副本眼睛关掉。在图层3上按CTRL+U，在色相/饱和度中对色相进行调整。如图： |
24、把第2个帧对应的图层3副本旁的眼睛显示，其他图层3和图层3的副本都眼睛都关掉，再在图层3上按CTRL+U，对色相/饱和度中对色相进行调整，参数对刚才的稍大。如图：
| 以此类推,其他图层3也根据帧的变化而进行变化调整。最后补充：把所有动画帧的帧延迟时间都改为0.1秒，.如图完成。 |
| 最后选择菜单：文件 > 储存为Web和设备所用格式，格式为GIF，完成最终效果。 |
案例三：动态文字
本教程介绍用PS制作最为基础的GIF动画。制作的时候我们先要构思好动画展示效果。然后把用一组图片来显示动画的过程。再用IR把图片转成动态效果即可。
| 1、新建一个400 * 100像素的文档，背景选择白色，参数设置如下图。 |
2、设置前景色为细喜欢的颜色，这里设置为蓝色：#0091FC。
| 3、选择文字工具，在属性栏设置字体和字号，如下图，然后在画布上打上想要的文字。 |
|
| | 4、设置前景色为白色，给文字添加图层样式--渐变叠加。调成图层样式面板，设置如下图。注意设置完后不要点图层样式面板的确定。 |
| 如果图层样式面板挡住了画布，把画板移到一边，露出画布，鼠标放到画布上，按下鼠标左键不放，慢慢向左拖动，你发现了什么？对，流光在向左移动，好，继续向左拖动，知道看不见流光位置，现在点确定。 |
|
| | 5、选择菜单：窗口 > 动画，调出动画面板（其它PS版本可直接点工具面板下面的IR进入IR操作），如果时间轴模式，点转换为帧模式按钮，转换为帧模式。 |
| 设置延迟为0.15秒，循环次数为永远，点击复制帧按钮，复制一帧。 |
| 选择帧2，在文字图层上双击渐变叠加，调出图层样式面板。 |
| 在画布上按下鼠标左键向右拖动，知道流光在字的右边消失为止，确定后。按住Shift 键不放，点击第一帧，把两个真都选中，点击过渡动画帧按钮，设置添加帧数为3，确定后。 |
| 6、选择菜单：文件 > 储存为Web和设备所用格式，格式为GIF。最后要提醒的是，在点击储存后，还会弹出一个警告框，如果用CS3一定要看清楚确定按钮在哪，如果点到取消文件将不会被保存。 |
案例四：动态文字
本教程介绍简单的图形设计及GIF动画制作。现在网络很流行小图片动画效果，其实用PS很容易做出来，先把自己的图形或图片处理好，然后就可以随意的来制作动画，难度不大很容易上手。
| 1、新建文档，大小随意。新建一个图层，设置前景色为#FD7FA3，选择一个可爱的文字画笔刷上去。 |
| 2、选择自定义形状工具，找到心形，按住Shif键同时在画布上拉出心形，右键—删格化图层。 |
3、双击心形图层，给心形设置图层样式，各项参数如下：
|
| | 4、图层样式设置完后，将心形复制三个副本，选择副本1执行Ctrl+T，将属性栏的比例改为95%。 |
|
| | 5、好了，心形到这儿就做完了。接下来就是关键的步骤：做动画，打开动画编辑窗口（窗口—动画），按新建按钮六次，新建六个帧。 |
| 6、选择第一帧，然后在图层上将副本1、2、3的眼睛都隐藏掉，并设置帧延迟时间为0.05秒，具体如图： |
| 选择第二帧，将副本1的眼睛点开，其它三个心形图层的眼睛关掉，这一帧时间不用设置。 |
| 第五帧，返回来选副本2，因为震荡依次是从大到小，然后再荡回来，所以这一帧要选倒数第二个。 |
|
| | 第六帧选择副本1。好了，点击播放按钮看一下吧，成了！ |
| 7、做好后就保存下来，选择文件—存储为WEB所用格式。 |
| 点存储，弹出对话框，为你的动画命一个名字，保存，确定，这样就完成了~！ |
案例五：标志
水晶质感比较注重高光和暗调的配合。制作的时候需要根据实际的图形找到高光区域，然后用自己熟悉的方法去加高光，可以用渐变，画笔等工具加。如果不太满意可以多试几次。
| 1、新建一个600 * 600像素的文件，背景填充白色，新建一个图层，用钢笔勾出苹果部分的选区，如图1。 |
| <图1> |
| | 2、把选区填充深绿色：#2E8301，效果如下图。 |
| 3、新建一个图层，选择椭圆选框工具，按住Shift键拉出图3所示的正圆选区，按Ctrl + ALt + D 羽化45个像素，填充颜色：#ECF43F，取消选区后，按Ctrl + Alt + G与前一图层编组，效果如图4。 |
| <图4> |
| | 4、把当前图层复制一层，适当把图形调整下大小和位置，效果如下图。 |
| 5、同样把高光部分复制一份，放到左上角，效果如下图。然后调出苹果的选区，往右下移几个像素，如图7，再给图层加上图层蒙版，效果如图8。 |
| <图8> |
| | 6、新建一个图层，用钢笔勾出图9所示的路径，转为选区后填充颜色：#E9F23D，取消选区后加上图层蒙版，用黑白径向渐变拉出边角透明效果，如图10。 |
| 7、载入当前图层选区，如图11，新建一个图层，执行：编辑 > 描边，数值为1，颜色为白色。确定后把图层不透明度改为：40%，加上图层蒙版，擦掉不需要的部分，效果如图12。 |
| <图12> |
| | 8、新建一个图层，用钢笔勾出图13所示的选区，填充颜色：#77AF04。 |
| <图15> |
| | 11、叶子部分的制作方法相同，效果如下图。 |
案例六：网络标志
网标相对来制作要随意一些，它不像企业或商业标志一样有很多。不过要真正做好还是要花费很多的时间和精力。下面的教程是用PS来制作网标，如果要专业一点话需要用到AI等来制作。
| 1、新建一个大小适当的文档，背景填充淡黄色。新建一个空白图层1，选择椭圆选框工具，并设定好固定大小，画出一个圆形选区，并填充红色。 |
| 2、再新建一个空白图层2，选择矩形选框工具，并固定大小，画出一个正方形选区，并填充黑色。 |
|
| | 3、将图层2的左上角，左下角，右上角擦掉，并将颜色变成红色。然后把图层1和图层2合并。 |
| 4、用钢笔在左上角勾出一个三角路径，并转为选区，复制出图层4，将图层3的半圆部分删除，效果如下图。 |
|
| | 6、用椭圆选框工具，画个圆，复制几个，调整大小跟不透明度，并摆好位置，效果如下图。 |
| 7、在边角处做阴影，让边角有上翘的效果。用钢笔勾出一个三角形路径，转为选区后填充颜色：#98043c，并复制1层，执行：滤镜 > 模糊 > 高斯模糊，数值自定。 |
| 8、对半圆的边角进行上卷效果的制作。新建一个空白图层5，载入图层4为选区，在图层5上填充颜色：98043c，对图层5进行自由变换，稍微往下旋转一个角度，效果如下图，并复制1层，执行：滤镜 > 模糊 > 高斯模糊，数值自定。 |
| 9、到前面为止，标志已经大致完成，最后加上文字及网址，完成最终效果。 |
案例七：大众汽车标志
| 1、新建一250*250的文件，双击背景层，然后改名为“图层 0”，再新建一个“图层1”然后用椭圆选取工具在层的中间做一个正圆的选区（配合使用Shift键），如下图： |
| 2、设置你的前景色为#759DCD，背景色为#003366。选择“渐变工具”里的“径向渐变”。并且确定，渐变编辑器里的左标为前景色，右标为背景色。然后从圆的左上部向右下部拉一个径向渐变出来。如下图： |
| 3、接下来，我们用喷工具在淡蓝色的部分喷上高光，记得把前景色设置为白色啊。如下图： |
|
| 4、现在我们要选中这个圆，可以按住Ctrl不放，单击“图层1”。然后再建一个“图层2”，然后外描边6象素，颜色用#999999，如下图： |
| 5、现在，在我们进行更进一步的处理时，我们用快捷键“Ctrl+R”，让系统显示标尺。然后做出一些辅助线，如下图： |
| 6、新建“图层3”，在中间做一个和原来的圆一样正圆选区（用椭圆选取工具从坐标左上方拉到右下方即可）然后用白色外描边9象素，然后用快捷键“Ctrl+T”来调整它的尺寸位置，记得要同时按住Shift和Alt，以便保证它能够和原来的圆成为半径不一样的同心圆，如下图： |
| 7、接下来，我们要做的就是其中的那个VW字样的关键部分，我们的思路是做两个相互交叉的“V”然后从中间截断。现在开始，选择字体“Lucida sans unicode”，然后写一个V，用Ctrl+T做一些简单变形。然后用钢笔工具描边路径，然后再用“直接选取工具”将它们的几个顶点延伸到圆上，如下图： |
|
| 8、进入路径面板，点第三个按钮“将路径作为选区载入”，然后回到层面板，将“V”所在的层栅格化，接着将选区填充为白色，如下图： |
| 9、现在将这个变形以后的“V”复制，水平翻转一下，然后移动到右方合适的位置，如下图： |
| 10、还记得我们之前的思路吗？没错，我们还需要将它合并以后从中间截断。来吧，将“V”图层和它的副本合并，可以使用能够快捷键“Ctrl+E”，然后将中间一部分去除，如下图： |
| 11、将“图层3”和合并以后的“V图层”合并，也就是把所有白色填充过的层合并。并给它加上一点点的阴影（可用图层样式），然后再依次选择“滤镜”-“渲染”-“光照效果”，参数及效果如下图： |
