制作带有蠕动线框的Logo

在建造网站的时候，一个设计精妙、富有动态感的Logo能够为网页增色不少。而有些Logo周围有一圈细细的虚线围绕着Logo缓缓蠕动的效果，这个效果是用Photoshop和ImageReady共同实现的一个视觉欺骗。下面我们就来探讨制作这种蠕动虚线框的方法。

步骤一：新建文件

使用菜单命令“File（文件）→New（新建）”新建一个800像素，背景色为白色的文件，然后按下“Ctrl ”键数次，将文件视图放大到合适比例以便于操作。

步骤二：制作黑白方格

选择矩形选择工具（快捷键为M），在左上角画出一个边长为4像素的正方形选框。再按住Shift键，在右下角添加一个同样的选框。确认当前的前景色为默认的黑色，如果不是可以按下D键将它恢复为默认的。然后按下“Alt BackSpace”键使用前景色黑色填充选区，最后按下“Ctrl D”键取消选择。接着，选择菜单命令“Edit（编辑）→Define Pattern（定义图案）”，在对话框中为新图案命名为“黑白方格”，然后按下OK按钮，保存自定义的图案。

步骤三：制作虚线框

回到Logo所在的文件，在Layers面板上，选择下面的Layer 1图层，然后选择菜单命令“Edit（编辑）→Fill（填充）”，在对话框中选择使用Pattern填充，在下面的下拉列表中选择我们刚才自定义的“黑白方格”图案，其余选项保持默认值。确定后，Layer 1图层将被密布而有规律的黑白方格填满。

在Layers面板上，单击面板底部的新建图层按钮，建立空白图层Layer 2。按住Ctrl键单击“Logo”图层，将其轮廓作为选区载入。再选择菜单命令“Select（选择）→Modify（改变）→Expand（扩展）”，在对话框中输入1，按下OK按钮，选区将向外扩张一个像素。按下“Ctrl Shift I”键，将选区反向。确认当前图层为Layer 2，按下“Ctrl BackSpace”键，使用背景色白色填充选区。将图层Layer 2命名为“白边”。按下“Ctrl D”键取消选择，可以看到Logo周围出现了一圈虚线框。

步骤四：制作蠕动线框动画

在这一步中，我们将制作蠕动的虚线框动画。首先，我们需要在时间轴上创建一个新的图层。在每一个关键帧上，我们需要微调虚线框的位置，然后逐渐改变它的形状来产生动画效果。我们可以使用选区工具和移动工具来完成这些微调。

在时间轴上选择第1帧，确保图层“白边”处于选中状态，然后使用矩形选区工具选择整个虚线框。使用移动工具，微调虚线框的位置，使其紧密地贴合在Logo周围。然后按下“Ctrl C”键，将虚线框复制到剪贴板中。

在图层面板中，选择新建的图层，然后在时间轴上选择第2帧。使用“Ctrl V”键将虚线框从剪贴板中粘贴到当前帧。使用移动工具，略微调整虚线框的位置，在当前帧中形成微小的位移。在时间轴上选择第3帧，在这一帧中，进一步调整虚线框的位置，使其再次微小地移动。重复这个步骤，直到你完成整个动画效果。

步骤五：导出动画

最后一步就是导出我们的动画效果了。打开时间轴窗口，选择“Save for Web”，在对话框中选中GIF格式，并设置循环次数。点击“保存”按钮即可导出你制作的蠕动线框动画。

总结

通过以上步骤，我们可以制作出一个带有蠕动线框的Logo，并将其导出为GIF格式的动画。这种特效能够为网站增添动态感，吸引用户的注意力。因此，在设计网站时，这种特效是相当实用的，能够为网站带来更多的流量和曝光率。

版权声明：本文内容由互联网用户自发贡献，本站不承担相关法律责任.如有侵权/违法内容,本站将立刻删除。