家具公司网页的页面在设计上，使用了一张怀旧的家具照片，并将该照片和一个红木柜子并列安排在页面的*，形成相互对比、相互衬托的画面效果，在设计过程中，要注意比例关系、色彩关系、疏密关系等，使之构成具有美感的整体关系。如图10-59所示，为本实例的完成效果。

图10-59  本实例完成效果

技术提示

在棕红色调的图像中，一幅黑白照片打破了这种色调的，同时也打破了规则的构图方式，使画面变得活泼，具有了动势。本实例的制作中运用了大量的素材，其中红木柜子是刻画的重点，通过添加图层样式效果制作出柜子的立体效果和光泽变化，柜子上的装饰图像使用了大量的素材，为素材图片添加图层样式以及调整素材图片的混合模式，使其在柜子上的效果更加真实自然。如图10-60所示，为本实例的制作流程。

图10-60 本实例制作流程

制作步骤

（1）启动Photoshop，执行“文件”→“新建”命令，参照图10-61所示设置“新建”对话框，创建一个名为“家具公司网页”的空白文档。

图10-61  设置“新建”对话框

（2）在“图层”调板中新建“图层 1”，将前景色设置为深褐色（R123、

G49、B0），按下<Alt+Delete>键，使用前景色填充“图层 1”，如图10-62所示。

图10-62  填充颜色

（3）选择工具箱中的“矩形选框”工具，在视图底部绘制一个矩形选区，然后使用浅褐色（R150、G76、B0）填充选区，按下<Ctrl+D>键取消选区，如图10-63所示。

图10-63  绘制浅褐色图像

（4）执行“滤镜”→“杂色”→“添加杂色”命令，打开“添加杂色”对话框，参照图10-64所示设置对话框，为图像添加杂色效果。

提示：在添加杂色对话框中，平均选项使用随机数值（介于0以及正/负指定值之间）分布杂色的颜色值以获得细微效果，“单色”选项将此滤镜只应用于图像中的色调元素，而不改变颜色。通过执行此命令可以使经过修饰的区域看起来更真实。

图10-64  设置“添加杂色”对话框

（5）下面再执行“滤镜”→“杂色”→“中间值”命令，打开“中间值”对话框，参照图10-65所示设置对话框，应用滤镜效果。

提示：执行中间值命令可以混合选区中像素的亮度来减少图像的杂色。通过扔掉与相邻像素差异太大的像素，并用搜索到的像素的中间亮度值替换中心像素，使添加杂色后的图像变得比较柔和。

图10-65  设置“中间值”对话框

（6）在“图层”调板中新建“图层 2”，选择工具箱中的“矩形”工具，对选项栏中的参数进行设置，然后在视图中绘制两个矩形路径，如图10-66所示。

图10-66  绘制矩形路径

（7）按下<Ctrl+Enter>键，将路径转换为选区，然后将选区填充为淡黄色（R240、G220、B170），接着再将选区取消，如图10-67所示。

图10-67  将路径转换为选区并填充颜色

（8）配合使用工具箱中的“加深”和“减淡”工具，对图像进行处理，如图10-68所示。

图10-68  处理图像

（9）单击“图层”调板底部的“添加图层样式”按钮，在弹出的菜单中执行“投影”命令，参照图10-69所示对打开的“图层样式”对话框进行设置，为图像添加“投影”和“斜面和浮雕”效果。

图10-69  设置图层样式

（10）执行“文件”→“打开”命令，打开本书附带光盘\Chapter-10\“木纹1.jpg”文件，使用“移动”工具，将该文档中的图像拖动到“家具公司网页”文档中的相应位置，在“图层”调板中生成“图层 3”

，然后再将“图层 3”拖动到“图层 2”的下方，如图10-70所示。

提示：选择“图层 3”，按下<Ctrl+[>键可以向下移动图层到“图层 2”的下方。

图10-70  添加素材图像

（11）按下<Ctrl+U>键，打开“色相/饱和度”对话框，参照图10-71所示设置对话框，调整图像的色调。

图10-71  调整图像色调

（12）打开本书附带光盘\Chapter-10\“木纹2.jpg”文件，然后将该素材图像拷贝到“家具公司网页”文档中，执行“图像”→“调整”→“亮度/对比度”命令，参照图10-72所示设置“亮度/对比度”对话框，调整图像。

图10-72  调整图像

（13）参照图10-73所示，为木纹图像添加“投影”和“斜面和浮雕”图层样式效果。

图10-73  添加“图层样式”效果

（14）新建“图层 5”，设置前景色为淡黄色（R242、G228、B191），选择工具箱中的“直线”工具，在视图相应位置绘制一条粗细为5px的直线图像，如图10-74所示。

图10-74  绘制直线图像

（15）在“图层”调板中将“图层 5”的混合模式设置为“正片叠底”，然后参照图10-75所示，为图像添加“斜面和浮雕”图层样式效果。

提示：在对图像进行调整时候，将图层混合模式设置为正常，填充参数设置为0%

也可以得到相同的效果。

图10-75  设置图层样式

（16）接下来对“图层 5”中的图像进行复制并分别在视图中对图像进行调整，然后再分别调整复制图像所在图层的混合模式，制作出如图10-76所示的图像效果。

图10-76  复制出其他图像

（17）打开本书附带光盘\Chapter-10\“柜子把手.psd”文件，使用“移动”工具，将该文档中的把手图像拖动到“家具公司网页”文档中的相应位置，生成“图层 6”，然后参照图10-77所示为图像添加“投影”效果，并将“图层 6”的混合模式设置为“叠加”。

图10

-77  添加把手图像

（18）将该把手图像复制，并将复制的图像放置到另一侧。接下来，再将本书附带光盘\Chapter-10\“花纹1.psd”文档中的图像拷贝到“家具公司网页”文档中，并对其进行复制，调整两个图像在视图中的位置，如图10-78所示。

图10-78  添加花纹图像

（19）使用同样操作方法，将本书附带光盘\Chapter-10\“花纹2.psd”和“花纹3.psd”文档中的图像分别拷贝到“家具公司网页”文档中的相应位置，然后复制图像，并分别调整图像所在图层的混合模式和不透明度，如图10-79所示。

图10-79  添加其他花纹图像

（20）结合使用工具箱中的“直线”工具，制作出抽屉以及柜子之间的缝隙，如图10-80所示。

提示：立体效果是通过相邻两条直线图像的颜色对比制作而成的。

图10-80  绘制缝隙图像

（21）结合本书附带光盘\Chapter-10\“抽屉把手.psd”文档中的图像，制作出如图10-81所示的图像效果，并为其添加与柜子把手图像相同的图层样式效果。

图10-81  制作抽屉把手图像

（22）打开本书附带光盘\Chapter-10\“花边.jpg”文件，然后将该文档中的图像拷贝到“家具公司网页”文档中，并为图像添加“斜面和浮雕”效果，接着对其复制放置到对称的一侧，如图10-82所示。

图10-82  添加花边图像

（23）依次将本书附带光盘\Chapter-10\“装饰图像.psd”和“装饰纹理.jpg”文档中的图像拷贝到“家具公司网页”文档中的相应位置，然后对“装饰纹理”图像所在图层的混合模式和不透明度进行设置，效果如图10-83所示。

图10-83  添加素材图像

（

24）选择工具箱中的“圆角矩形”工具，在视图相应位置绘制一个圆角矩形路径，确定木纹图像所在“图层 4”为当前可编辑状态，将路径转换为选区，对选区内的图像复制，然后将其粘贴到新的图层中，参照图10-84所示调整图像的位置。

图10-84  复制图像

（25）执行“图像”→“调整”→“亮度/对比度”命令，打开“亮度/对比度”对话框，参照图10-85所示设置对话框，调整图像亮度。

提示：若对整幅画面进行亮度/对比度的调整时，可以选择图层调板底部的“创建新的填充或调整图层”按钮，在弹出的菜单中选择“色相/饱和度”命令即可。

图10-85  调整图像亮度

（26）接下来参照图10-86所示为图像添加“斜面和浮雕”图层样式效果。

图10-86  添加图层样式

（27）使用

“矩形选框”工具，选择图像上侧的多余部分将其删除，然后使用同样方法制作出如图10-87所示的其他按钮图像。

图10-87  制作按钮图像

（28）接下来将本书附带光盘\Chapter-10\“照片.jpg”文档中的图像拷贝到“家具公司网页”文档中，并对图像的大小、角度和位置进行调整，如图10-88所示。

图10-88  添加照片素材

（29）最后在视图中添加相关的文字信息和装饰图像，完成本次实例的制作，如图10-89所示。如果读者在制作的过程中遇到什么问题，可打开本书附带光盘\Chapter-10\“家具公司网页.psd”文件进行查看。

图10-89  实例完成效果

 << 上一页  [11]