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

最新发布

风景区网页
风景区网页

本实例的风景区网页页面,是对风景区的图片进行编辑修饰后,设计制作成类似于国画的画面效果,设计新颖,充满艺术气息。页面下半部分的空白,也是页面设计不可忽视的重要部分,使得在浏览信息的间隙,视觉得到适当的放松和调节。并且以虚衬托实的表现手法,可以获得更佳的视觉效果产生更加深刻的视觉印象。如图9-47所示,为本实例的完成效果。图9-47  本实例完成效果在本实例的制作中由于所介绍的景点在中国境内,所以在设计风格上要显示出东方的特色,以及中国古老的传统文化,因此将画面效果制作成类似国画的风格,黄色调的运用营造出祥和,美好的特点。另外,网页的主要作用是传达,在页面上结合风景来进行文字说明,图文并茂,可以使人们在浏览的过程能够快捷的了解最新信息。如图9-48所示,为本实例的制作流程。图9-48 本实例制作流程(1)启动Photoshop,执行“文件”→“新建”命令,参照图9-49所示对打开的“新建”对话框进行设置,创建出一个名为“风景区网页”空白文档。图9-49  新建文档(2)设置前景色为灰褐色(R211、G200、B171),按下<Alt+Delete>键,使用前景色填充背景。然后在“图层”调板中,

14 次浏览
服饰网页
服饰网页

在本节的实例学习中,将制作一幅牛仔服饰网页的页面效果,完整的形象形态一旦被打破,人们的注意力就会上升,适形的裁切使图像内容更突出并可以将主体形象于环境融合到一起,表达一种粗狂的文化气息,如图10-2所示,为本实例的完成效果。图10-2  本实例完成效果本实例的制作分为两部分:一部分是背景的制作,另一部分是添加装饰元素及文字。在背景制作中,结合素材图片,调整其色调,并对其中一幅素材图片与另一幅图片相接的边缘制作出扭曲效果,使图像能过渡自然,相互融合在一起。在为图像添加装饰元素时,要注意使图像与整体效果所要传达的中心一致,更改图像所在图层的混合模式能够很便捷的将图像与背景进行融合,并且在绘制字体的时候尽量制作出斑驳的效果,使之与画面的整体风格相统一。如图10-3所示,为本实例的制作流程。图10-3 本实例制作流程(1)运行Photoshop,执行“文件”→“新建”命令,打开“新建”对话框,参照图10-4所示设置对话框,创建一个“牛仔服饰网页”的空白文档。图10-4  “新建”对话框(2)执行“文件”→“打开”命令,打开本书附带光盘\Chapter-10\“砖墙.jpg”文件,使用“移动”工具,将砖墙图像拖移到“牛仔服饰网页”文档中,并调整大小和位置,如图10-5所示。

6 次浏览
特色美食网
特色美食网

在本实例特色美食网页的页面设计中,制作了一个传统餐饮店内常见的、挂在墙上的那种木制菜品招牌,在招牌内有特色美食的相关文字介绍和相关的链接按钮,形成比较独特的页面设计效果。本页面利用色块、图片、花纹等构件形成一个全封闭的边框,以包括杂多的内容,使网页的视觉效果更具有整体感。如图10-37所示,为本实例的完成效果。图10-37  本实例完成效果本实例制作的特色美食网页面效果古色古香,非常具有传统的东方风味,装饰纹样的运用极大的丰富了画面效果。制作的方法也非常容易,以一张木纹图像为素材,在此基础上通过编辑不同的图形,然后为不同的图形添加不同的图层样式的操作,来编辑图像。不管是绘制主体,还是装饰图像,注意都要保持图像的对称性,使之呈现出一种平稳的视觉效果。如图10-38所示,为本实例的制作流程。图10-38 本实例制作流程(1)启动Photoshop,执行“文件”→“打开”命令,打开本书附带光盘\Chapter-10\“木质纹理.jpg”文件,如图10-39所示。图10-39  打开素材图像(2)选择工具箱中的“圆角矩形”工具,在视图中绘制如图

6 次浏览
家具公司网页
家具公司网页

家具公司网页的页面在设计上,使用了一张怀旧的家具照片,并将该照片和一个红木柜子并列安排在页面的*,形成相互对比、相互衬托的画面效果,在设计过程中,要注意比例关系、色彩关系、疏密关系等,使之构成具有美感的整体关系。如图10-59所示,为本实例的完成效果。图10-59  本实例完成效果在棕红色调的图像中,一幅黑白照片打破了这种色调的,同时也打破了规则的构图方式,使画面变得活泼,具有了动势。本实例的制作中运用了大量的素材,其中红木柜子是刻画的重点,通过添加图层样式效果制作出柜子的立体效果和光泽变化,柜子上的装饰图像使用了大量的素材,为素材图片添加图层样式以及调整素材图片的混合模式,使其在柜子上的效果更加真实自然。如图10-60所示,为本实例的制作流程。图10-60 本实例制作流程(1)启动Photoshop,执行“文件”→“新建”命令,参照图10-61所示设置“新建”对话框,创建一个名为“家具公司网页”的空白文档。图10-61  设置“新建”对话框(2)在“图层”调板中新建“图层 1”,将前景色设置为深褐色(R123、

5 次浏览
三维软件教学网页
三维软件教学网页

三维软件教学网页的页面设计,是以模拟三维软件制作的物体形象,作为画面的主体构图元素,形成与网页信息内容相照应的画面效果。各种视觉要素组成一个有机整体,不仅各得其所,而且各有分工,其中各种元素的大小、主次、位置以及疏密、均衡等关系的恰当组合,使页面具有强烈的视觉冲击力。如图11-2所示,为本实例的完成效果。图11-2  本实例完成效果本实例给人以厚重,机械味浓重的视觉感受。图像分成好多部分组成,按照由下向上的绘图顺序,先绘制最底层的图形,并添加图层样式效果制作出图像的立体效果。然后使用相同的操作方法继续绘制图像。在绘制过程中添加图层样式效果是塑造立体图像的主要编辑方法。应仔细体会添加不同的图层样式所得到的不同的立体效果。如图11-3所示,为本实例的制作流程。图11-3 本实例制作流程(1)启动Photoshop,执行“文件”→“打开”命令,打开本书附带光盘\Chapter-11\“火焰背景.jpg”文件,如图11-4所示。图11-4  打开素材图像(2)在“图层”调板中,新建“图层 1”,使用工具箱中的“矩形选框”工具,在视图中绘制一个矩形选区,然后将选区填充为灰色(R110、G110、B108),接着再将选区取消,如图11-5所示。

6 次浏览
插画艺术网
插画艺术网

本实例以造型优美的、抽象的花朵形象和渐变的、绚丽的花朵色彩,来表现插花艺术网页页面的设计主题。该设计效果强烈,点、线、面、色彩和图形的组合运用是构成网页的装饰要素。紫红色的运用为画面增添了浪漫气息。如图11-40所示,为本实例的完成效果。图11-40  本实例完成效果在本实例中所设计的内容与主题相符,体现插花这门艺术的优美与浪漫。协调的处理色彩与其他设计要素之间的相互关系,增强网页的信息和情感传递效果,使人们在浏览的时候产生共鸣。在制作过程中主要采用绘制路径、描边路径来绘制图像,使用“画笔”工具来修饰图像的颜色,更改图像的混合模式使两幅图像叠加起来,能得到更加丰富的图像效果。如图11-41所示,为本实例的制作流程。图11-41  本实例制作流程(1)启动Photoshop,执行“文件”→“新建”命令,参照图11-42所示对打开的“新建”对话框进行设置,创建一个名为“插画艺术网”的新文档。图11-42  设置“新建”对话框(2)单击“图层”调板底部的“创建新图层”按钮,新建“图层 1”,然后使用工具箱中的“矩形选框”工具,参照图11-43所示在视图中绘制一个矩形选区。

17 次浏览
古典文学网
古典文学网

网页界面上的图像本身比文字更容易吸引人,在本节制作的古典文学网页中,以书籍、信纸、鸡毛笔等图像作为画面的主体构图元素,这些元素的巧妙组合以及色调的合理把握,为画面营造出比较浓厚的文学色彩,如图11-79所示,为本实例的完成效果。图11-79  本实例完成效果在本实例中选择一种棕色作为主色调,通过微调色彩的名度和色相的方法来产生色彩的微妙变化,这样的处理使页面看起来色彩统一,有层次感。各种元素的搭配处理,使画面带有一种浓厚的文学气息,羽毛图像调节了整个画面的气氛,使其不会显得太过沉闷。在制作过程中,使用云彩命令制作出书籍封面的纹理效果,并添加图层样式制作出立体效果,然后对细节部位进行调整,信纸的制作相对比较简单,使用加深和减淡工作制作出纸张的褶皱变化。如图11-80所示,为本实例的制作流程。图11-80  本实例制作流程(1)启动Photoshop,执行“文件”→“打开”命令,打开本书附带光盘\Chapter-11\“背景花纹.jpg”文件,如图11-81所示。图11-81  打开素材图片(2)在“图层”调板中,单击调板底部的“创建新组”按钮,新建

18 次浏览
Photoshop制作碳纤维风格的插入式导航菜单
Photoshop制作碳纤维风格的插入式导航菜单

 接着添加”模糊滤镜”(滤镜->模糊->动态模糊)

7 次浏览
Photoshop设计3D效果的网页模板
Photoshop设计3D效果的网页模板

使背景图层可编辑 5 使用任意颜色填充选区(Alt+Backspace)增加图层样式.

8 次浏览
如何轻松制作一个漂亮透明的水印
如何轻松制作一个漂亮透明的水印

本教程将告诉你如何轻松制作一个漂亮透明的水印,过程只有几步应该说不难,是一些PHOTOSHOP基本功的运用:1.打开图片 2.打上文字-文字的颜色不限。 3.把文字层的填充不透明度设为0%。这时。除了图片什么也看不见了。别急!4.对文字层,加样式-斜面/浮雕。默认好了。透明的文字出来了吧! 做到这里,请考虑考虑是为什么?道理是:填充不透明度只影响本图层,对样式无影响。所以你看到的文字是透明的,但样式的阴影,你能看见。还能做什么?想加点个人的标记!好的,请跟我来!1.设计个人标记,定义为图案。2.加样式-图案叠加。OK! 看看过程,超简单吧!

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