当前位置:主页 > 平面设计 > PS教程 > 制作实例 > 网页制作

最新发布

结合通道优化图像
结合通道优化图像

在前面的操作中,我们学习如何对整幅图像以及切片图像的优化方法。通过“存储为Web所用格式”对话框还可以对选择选区内的图像进行局部优化。但在优化前必须将选区存储为Alpha通道,这样才能在“存储为Web所用格式”对话框被调用。接下来将通过一组操作,介绍怎样在“存储为Web所用格式”对话框中使用通道对图像进行局部优化的方法。(1)首先,读者可直接打开本书附带光盘\Chapter-17\“塑料按钮.jpg”文件,如图17-46所示。图17-46  打开本书附带光盘文件(2)然后在“路径”调板中选择“路径 1”,然后单击调板底部的“将路径作为选区载入”按钮,将其转换为选区,如图17-47所示。图17-47  选择路径并将其转换为选区(3)接着执行“选择”→“羽化”命令,在弹出的“羽化选区”对话框中设置参数,如图17-48所示。

4 次浏览
使用Photoshop发布简单的网页
使用Photoshop发布简单的网页

本节采用了第7章中的网页设计完成图,将该网页界面在Photoshop中继续进行编辑,通过建立切片、设置链接、优化图像、存储为Web所用的HTML格式等操作,最终完成网页的发布。图18-51所示为本实例的完成效果。图18-1  本实例完成效果在实例制作中使用“切片”工具对网页进行切片划分,然后使用“切片选择”工具选择需要链接的切片,并设置链接地址。接着在“存储为Web所用格式”对话框中对网页进行优化,最终完成网页的发布。图18-2所示为本实例的制作概览。图18-2  实例的制作概览(1)运行Photoshop,执行“文件”→“打开”命令,打开本书附带光盘\Chapter-18\“艺术中心网页.jpg”文件,如图18-3所示。图18-3  打开图像(2)在工具箱中选择“切片工具”,然后在画面中拖出一个矩形框,松开鼠标后即可得到一个用户切片,如图18-4所示。

2 次浏览
摇滚音乐网站
摇滚音乐网站

摇滚音乐通常以强烈的节拍和通俗简单的乐句为特点,充满了另类、时尚的吸引力,深受年轻人的喜爱。本实例制作的就是摇滚音乐的网页页面特效,夸张的人物造型配以均衡的文字编排,使整幅画面具有动势,表现出狂野的视觉印象。不对称式的构图方式,以避免画面呆板。如图7-2所示,为本实例的完成效果。图7-2  本实例完成效果在本实例中,通过对几幅素材图片的编辑和调整,以及相互之间的混合,形成纹理鲜明、人物形象饱满的画面效果。通过使用色调调整命令调整图像色调,使调整后的颜色与整幅画面的色调相协调,使用画笔工具添加粗糙的画笔装饰效果,使之更贴近于表达内容,最后对画面作进一步的修饰和调整,如图7-3所示,为本实例的制作流程。图7-3 本实例制作流程(1)运行Photoshop,执行“文件”→“新建”命令,打开“新建”对话框,参照图7-4所示设置对话框,新建一个“摇滚音乐网站”的空白文档。图7-4  设置“新建”对话框(2)执行“文件”→“打开”命令,打开本书附带光盘\Chapter-07\“背景.jpg”文件,使用“移动”工具,将背景图像拖动至“摇滚音乐网站”文档中并调整图像大小,使

10 次浏览
游戏网页
游戏网页

游戏网页的页面通常具有较高的注目度和吸引力,常通过画面中的某一部分的突出的、引人注目的图像,来达到醒目而且具有视觉冲击力的效果。而图像的表现力又非文字可以替代,在此将文字与图像结合起来,可以更加直观,生动的表现所要传达的信息。如图7-28所示,为本实例的完成效果。图7-28  本实例完成效果在本实例中字体图像的效果比较醒目突出,明确的表达了所要传达的内容。在绘制的过程中,使用通道与滤镜命令相结合的方法来表现图像的立体效果,然后添加图层样式效果制作出字体的光泽变化。字体下方的按钮图像的视觉效果比较厚重,制作方法同样是使用图层样式命令来制作图像的立体效果和光影变化,结合导入的素材图片,为按钮图像制作出纹理效果。如图7-29所示,为本实例的制作流程。图7-29 本实例制作流程(1)运行Photoshop,在菜单栏中执行“文件”→“新建”命令,参照图7-30所示设置“新建”对话框,创建出一个名为“游戏网页”的空白文档。图7-30  设置“新建”对话框(2)确定前景色为黑色,按下<Alt+Delete>使用前景色将背景填充。然后执行“文件”→“打开”命令,打开本书附带光盘\Chapter-07\“纹理1.jpg”文件,使用工具箱中的

5 次浏览
艺术中心网页
艺术中心网页

设计公司网页页面一般都设计的比较时上、新颖,本实例巧妙的利用了画面的构图结构,来创建一种比较有创意的画面效果。文字、图片、符号的相互作用建立起一种整体的信息,而信息的主次分类,通过秩序化、条理化构成一个整体的网页形式。如图7-63所示,为本实例的完成效果。图7-63  本实例完成效果本实例构图灵活,设计感强烈,画面中的绿色图像是绘制的主题内容,在绘制过程中绿色图像主要是通过编辑通道图像来进行绘制,然后将导入的素材图片通过编辑与绿色图像和谐的统一在一起,如图7-64所示,为本实例的制作流程。图7-64 本实例制作流程(1)启动Photoshop,执行“文件”→“新建”命令,参照图7-65所示对“新建”对话框进行设置,完毕后单击“确定”按钮,关闭对话框,创建出一个新文档。图7-65  设置“新建”对话框(2)在“图层”调板中,新建“图层 1”,使用工具箱中的“矩形选框”工具,在视图的两侧创建出如图7-66所示的选区。

4 次浏览
珠宝制造公司网页
珠宝制造公司网页

珠宝制造公司网页的页面设计比较抽象,在页面的左下角设计安排了大小不同的三颗红宝石,成为整幅画面的点题之笔。而右侧的红色图像又与之遥相呼应,整幅画面对比鲜明,视觉效果突出。在调和过程中,若要使红色的调和不排斥对比,要适当控制红色的分量。如图8-2所示,为本实例的完成效果。图8-2  本实例完成效果在本实例的制作过程中,通过编辑素材图片来制作背景图像,使背景图像达到丰富多变的视觉效果,非常具有科技感、现代感,在画面中效果最突出的就是红颜色的运用。其中左下角的红宝石图像通过设置图层样式制作出来,如图8-3所示,为本实例的制作流程。图8-3 本实例制作流程(1)启动Photoshop,执行菜单中的“文件”→“新建”命令,打开“新建”对话框,参照图8-4所示设置对话框,创建出一个空白文档。图8-4  设置“新建”对话框(2)执行“文件”→“打开”命令,打开本书附带光盘\Chapter-08\“背景1.jpg”文件,使用工具箱中的“移动”工具,将该文档中的图像拖动到创建的空白文档中,在“图层”调板中生成“图层 1

4 次浏览
艺术中心网页
艺术中心网页

本实例网页页面的制作,是以文字作为画面的主要构图元素,在整体上给人以比较理性的视觉印象。页面中的主要文字从字体样式和色彩都和页面中其他元素加以明显的区别,在页面中显得出众而夺目。如图8-32所示,为本实例的完成效果。图8-32  本实例完成效果本实例主要是以文字作为画面的主要构成元素的。其实文字本身也是一种艺术形式,它在个性和情感方面对人们也有着很大影响,一般来说文字部分都是理性而平静的。因此在编排文字的过程中,需要先构思版面,然后再考虑主要文字、次要文字以及辅助文字等的表达方式。在制作过程中将页面的中心位置的发光字体图像定位为主要文字,页面上部的图像进行细节刻画,使之不空洞。页面最下部的文字进行弱化处理,从而使整幅画面具有层次感。如图8-33所示,为本实例的制作流程。图8-33  本实例制作流程(1)启动Photoshop,在菜单栏中执行“文件”→“打开”命令,打开本书附带光盘\Chapter-08\“粗糙颗粒背景.jpg”文件,如图8-34所示。图8-34  打开背景素材(2)单击“图层”调板底部的“创建新图层”按钮,新建“图层 1”。设置前景色为深蓝色(R17、G19、B31),按下<Alt+Delete>键,使用前景色填充“图层 1”,然后将“图层 1”的混合模式设置为“叠加”,如图8-35所示。

8 次浏览
飞行者网站
飞行者网站

本实例将制作一幅飞行者网站的网页页面,该页面以各种与飞行有关的器械图像来组织画面,在组织页面的时候,要将不同的视觉元素在版面内进行有序的组织、编排,构成一个有机的空间联系形成空间秩序感,使画面零而不乱,有效的传达了该网站的主题信息。如图8-76所示,为本实例的完成效果。图8-76  本实例完成效果本实例由一些机械图像组成,技术效果强烈。整幅画面在视觉上看起来比较复杂,零碎的东西比较多,但是在制作过程中只需要合理利用工具并结合使用图片素材,即可轻松的完成。其中页面的背景图像和一些器械图像的制作是使用的素材图片,而其他图像的编辑主要是绘制图形、设置填充颜色和添加图层样式的操作。如图8-77所示,为本实例的制作流程。图8-77 本实例制作流程(1)运行Photoshop,执行“文件”→“新建”命令,打开“新建”对话框,参照图8-78所示设置对话框,创建一个名为“飞行者网站”的空白文档。图8-78  新建文档(2)执行“文件”→“打开”命令,打开本书附带光盘\Chapter-08\“光点背景.jpg”文件,使用

4 次浏览
旅行社网页
旅行社网页

旅行社网页中的信息内容,应该都与其景点业务有关。使人们足不出户就可以了解更多旅游景点的情况,因此在旅行社网页的页面设计,应以景点介绍为主,并辅以必要的文字说明。如图9-2所示,为本实例的完成效果。图9-2  本实例完成效果该实例艺术效果强烈,画面色彩浓重犹如画,作为旅游社的网页页面非常吸引人。在制作的过程中,主要是编辑素材图片的操作,通过蒙版的编辑,将几幅不同的素材图片经修饰后组织在一幅画面中,然后将画面分为天空、草地和河流三部分来分别调整色调,最后添加装饰光线和小船,提亮画面。如图9-3所示,为本实例的制作流程。图9-3 本实例制作流程(1)启动Photoshop,执行“文件”→“打开”命令,打开本附带光盘\Chapter-09\“风景1.jpg”文件。如图9-4所示。图9-4  打开素材图片(2)再次打开本书附带光盘\Chapter-09\“风景2.jpg”文件,使用工具箱中的

4 次浏览
民俗古玩网页
民俗古玩网页

民俗古玩网页的页面设计以古玩器皿为画面的主体图像,形成古色古香的画面气氛,给人一种怀旧的视觉印象。页面上各视觉元素按照其形态的大小、色彩、明暗、轻重等关系在页面上平衡地进行布局。通过协调各个要素在主次、强弱的差异关系,来取得设计视觉平衡的美感以及内容上的统一。如图9-21所示,为本实例的完成效果。图9-21  本实例完成效果民俗古玩网页顾名思义就是以介绍古玩器皿为主。在本实例的制作中使用了大量的素材图片,对这些素材图片的修饰操作包括:调整图片的颜色、更改图片的混合模式、为图片添加图层样式效果等。通过对素材图片的修饰,使图片和谐的统一在一幅画面中。整幅图像以黑红两种色调为主,使画面具浓厚的中国特色,如图9-22所示,为本实例的制作流程。图9-22 本实例制作流程(1)启动Photoshop,执行“文件”→“新建”命令,参照图9-23所示设置对话框,创建一个名为“民俗古玩网页”的新文档。图9-23  设置“新建”对话框(2)设置前景色为红色(R171、G0、B11),按下<Alt+Delete>键,使用前景色填充背景。接着执行“文件”→“打开”命令,打开本书附带光盘

6 次浏览
共计33条记录 上一页 1 2 3 4 下一页