用Photoshop图层样式制作发光按钮_网页logo教程

┆死┆ 发表于 2007-10-31 15:45:28

用Photoshop图层样式制作发光按钮

<DIV id=gg_bbs> </DIV>作者：<A href="http://www.16xx8.com/" target=_blank>发条桔子  </A>  <A href="http://bbs.16xx8.com/" target=_blank>教程</A>来源：eNet硅谷动力    
 先看一下效果： <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112425802.jpg" border=0> 在下面的例子中我们将研究怎么样运用图层样式来为我们制作出优美的图案<A href="http://bbs.16xx8.com/" target=_blank>。</A>新建825×595像素大小的工作窗口，选择渐变工具为背景添加渐变效果<A href="http://bbs.16xx8.com/" target=_blank>。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112426967.jpg" border=0> 双击背景图层，打开“新建图层”对话框，单击确定<A href="http://bbs.16xx8.com/" target=_blank>。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112427555.jpg" border=0> 在图层面板中单击“添加图层样式”，在下拉菜单中选择“渐变叠加”，然后如图设置弹出对话框<A href="http://bbs.16xx8.com/" target=_blank>。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112427457.jpg" border=0> 在图层面板中再次单击“添加图层样式”，在下拉菜单中选择“图案叠加”，然后如图设置弹出对话框<A href="http://bbs.16xx8.com/" target=_blank>。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112428306.jpg" border=0> 新建一个图层1，选择椭圆选框工具，在窗口中央创建一个椭圆，设置前景色为暗红，然后填充选区<A href="http://bbs.16xx8.com/" target=_blank>。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112428757.jpg" border=0> 使用“Ctrl+T”打开自由变换命令，将椭圆调整到如图效果<A href="http://bbs.16xx8.com/" target=_blank>。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112429114.jpg" border=0> 在图层面板中单击“添加图层样式”，在下拉菜单中选择“投影”命令，然后如图设置弹出对话框<A href="http://bbs.16xx8.com/" target=_blank>。 <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112429341.jpg" border=0> 在图层面板中再次单击“添加图层样式”，在下拉菜单中选择“内发光”命令，然后如图设置弹出对话框。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112430959.jpg" border=0>复制图层1得到图层1副本，删去图层1副本中的图层样式，在图层面板中单击“添加图层样式”，在下拉菜单中选择“外发光”命令，然后如图设置弹出对话框<A href="http://bbs.16xx8.com/" target=_blank>。 <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112430387.jpg" border=0> 在工具箱中选择移动工具，移动图层2到如图位置。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112431910.jpg" border=0>在图层1副本的上方单击“锁定透明像素”按钮，然后设置前景色为黑色，按“Alt+Del”键在图层1副本填充黑色<A href="http://bbs.16xx8.com/" target=_blank>。 <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112432967.jpg" border=0> 选择椭圆选区工具，绘制如图选区。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112432987.jpg" border=0>在图层面板中单击“添加图层样式”，在下拉菜单中选择“投影”命令，然后如图设置弹出对话框<A href="http://bbs.16xx8.com/" target=_blank>。 <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112433935.jpg" border=0> 在下拉菜单中选择“内阴影”命令，然后如图设置弹出对话框。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112433528.jpg" border=0>在下拉菜单中选择“内发光”命令，然后如图设置弹出对话框<A href="http://bbs.16xx8.com/" target=_blank>。 <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112434789.jpg" border=0> 在下拉菜单中选择“斜面和浮雕”命令，然后如图设置弹出对话框。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112435879.jpg" border=0>在下拉菜单中选择“等高线”命令，然后如图设置弹出对话框<A href="http://bbs.16xx8.com/" target=_blank>。 <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112436230.jpg" border=0> 在下拉菜单中选择“光泽”命令，然后如图设置弹出对话框。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112437448.jpg" border=0>在下拉菜单中选择“渐变叠加”命令，然后如图设置弹出对话框<A href="http://bbs.16xx8.com/" target=_blank>。 <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112437233.jpg" border=0> 按“Ctrl+T”键打开自由变换，调节图层2到如图效果。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112438529.jpg" border=0>设置图层2的填充值为30%<A href="http://bbs.16xx8.com/" target=_blank>。 <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112438149.jpg" border=0> 新建图层3，然后使用椭圆选区工具在图层3绘制一个椭圆，并且填充白色。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112439735.jpg" border=0>打开样式调板，为图层3中的椭圆选择一个蓝色的“web样式”<A href="http://bbs.16xx8.com/" target=_blank>。 <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112440533.jpg" border=0> 只用自由变换命令将图层3的位子调整好，这时会发现图层3的高光位置与其它图层不一样。</A>我们打开图层3的图层样式，选择“斜面和浮雕”命令，进行如图设置<A href="http://bbs.16xx8.com/" target=_blank>。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112440845.jpg" border=0>在图层面板下方单击“添加蒙版”按钮，为图层3添加蒙版，使用柔边画笔，用灰色在蒙版上涂抹<A href="http://bbs.16xx8.com/" target=_blank>。 <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112441130.jpg" border=0> 复制图层3得到图层3副本，删除图层3副本的蒙版，并设置填充为100%。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112442535.jpg" border=0>在图层3副本的图层样式按钮上单击鼠标右键，选择清除图层样式<A href="http://bbs.16xx8.com/" target=_blank>。 <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112443142.jpg" border=0> 使用自由变换命令调节图层3副本到如图大小。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112443164.jpg" border=0>选择渐变工具，使用白色到黑色的径向渐变为图层3副本添加一个渐变效果<A href="http://bbs.16xx8.com/" target=_blank>。 <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112445971.jpg" border=0> 选择图层3副本，单击“添加图层样式”，在下滑菜单中选择“内发光”，如图设置参数。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112445951.jpg" border=0>新建图层4，按下“Ctrl”键，用鼠标单击图层3副本缩览图，载入它的选区<A href="http://bbs.16xx8.com/" target=_blank>。将前景色设置为绿色，并填充选区。</A>选择画笔工具，设置前景色为白色，使用柔边画笔在图中所示位置点上两个白点<A href="http://bbs.16xx8.com/" target=_blank>。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112446889.jpg" border=0> 在图层面板中单击“添加图层样式”，在下拉菜单中选择“外发光”命令，然后如图设置弹出对话框<A href="http://bbs.16xx8.com/" target=_blank>。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112446319.jpg" border=0>在下拉菜单中选择“内发光”命令，然后如图设置弹出对话框<A href="http://bbs.16xx8.com/" target=_blank>。 <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112447535.jpg" border=0> 在下拉菜单中选择“斜面和浮雕”命令，然后如图设置弹出对话框。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112448581.jpg" border=0>在下拉菜单中选择“等高线”命令，然后如图设置弹出对话框<A href="http://bbs.16xx8.com/" target=_blank>。 <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112448264.jpg" border=0> 复制图层4得到图层4副本，选择图层4副本，按住“Ctrl”键用鼠标单击“创建新图层”按钮，在图层4副本的下方建立一个图层5。将图层4副本和图层5同时选择，按“Ctrl+E”将他们合并。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112449219.jpg" border=0>复制图层4副本得到图层4副本2，将图层4副本2隐藏<A href="http://bbs.16xx8.com/" target=_blank>。选择图层4副本，执行“滤镜”→“扭曲”→“旋转扭曲”命令，设置角度为-236度。</A>
本新闻共2 <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112451916.jpg" border=0> 使用自由变换工具调节图层4副本到如图效果<A href="http://bbs.16xx8.com/" target=_blank>。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112452388.jpg" border=0>复制图层4副本得到图层4副本3，将图层4副本隐藏<A href="http://bbs.16xx8.com/" target=_blank>。按“Ctrl+U”打开“色相/饱和度”命令，如图设置弹出对话框。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112452382.jpg" border=0> 设置图层4副本3的缓和模式为“滤色”，不透明度为65%<A href="http://bbs.16xx8.com/" target=_blank>。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112454455.jpg" border=0>为图层4副本3添加一个图层蒙版，设置前景色为黑色，使用柔边画笔工具，将图层4副本3种图案的外侧抹去<A href="http://bbs.16xx8.com/" target=_blank>。 <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112456747.jpg" border=0> 显示图层4副本，按“Ctrl+U”打开“色相/饱和度”命令，如图设置弹出对话框。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112456131.jpg" border=0>使用自由变换命令，调节图层4副本到如图位置<A href="http://bbs.16xx8.com/" target=_blank>。 <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112458549.jpg" border=0> 按住“Ctrl”键单击图层4副本的缩览图，得到图层4副本的选区。</A>选择移动工具，按住“Alt”键拖动鼠标，复制图像<A href="http://bbs.16xx8.com/" target=_blank>。</A>然后只用自由变换命令调节到如图效果<A href="http://bbs.16xx8.com/" target=_blank>。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112458897.jpg" border=0>设置图层4副本的图层混合模式为“差值”，不透明度为28%<A href="http://bbs.16xx8.com/" target=_blank>。 <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112459391.jpg" border=0> 显示图层4副本2，执行“滤镜”→“扭曲”→“旋转扭曲”命令，设置角度为-688度。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/2007103011250386.jpg" border=0>使用自由变换命令将图层4副本2调节到如图效果<A href="http://bbs.16xx8.com/" target=_blank>。 <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/2007103011251836.jpg" border=0> 设置图层4副本2的混合模式为“颜色减淡”，不透明度为40%。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/2007103011252119.jpg" border=0>为图层4副本2添加一个图层蒙版，设置前景色为黑色，使用柔边画笔工具，将图层4副本2种图案的外侧抹去。 <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/2007103011253100.jpg" border=0> 现在我们来看看按钮的最后效果吧<A href="http://bbs.16xx8.com/" target=_blank>。</A> <IMG alt="" src="http://pic.16xx8.com/article/UploadPic/2007/10/30/20071030112425802.jpg" border=0>

页: [1]

ps教程论坛's Archiver

用Photoshop图层样式制作发光按钮