利用PS制作网站的基本流程

查查

<P>步骤&nbsp;1: Banner 制作</P>
<P>创建新的画布（780x600），利用矩形选框工具选取如下矩形选区用来制作Banner。</P>
<P><IMG height=316 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195137584.jpg" width=405></P>
<P>创建新的图层，并插入游戏截图。 </P>
<P><IMG height=314 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195154845.jpg" width=401></P>
<P>创建另一图层，&nbsp;在Banner边缘绘制两条直线。<IMG height=211 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195216694.jpg" width=400></P>
<P>暂时最小化窗口。</P>
<P>创建新的画布（3x3），按如下方式填充，并将下图定义为图案。</P>
<P><IMG height=100 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195220849.jpg" width=340><BR></P>
<P>选择双线边框图层，使用魔术棒工具选择两条直线之间的区域。选择油漆桶工具，使用“图案”填充。 </P>
<P><IMG height=294 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195221485.jpg" width=300></P>
<P>复制双线层并将其拖动到Banner的底边。 </P>
<P>图层 &gt;&gt; 合并图层，将两个Banner边框层合并，并命名为“Banner边框”。 </P>
<P>使用魔术棒工具选择上下边框之间的部分。</P>
<P>创建新的图层。</P>
<P>按如下方式定义新的图案。 </P>
<P><IMG height=61 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195223372.jpg" width=61></P>
<P>在新图层中填充该图案，得到如下效果。&nbsp;</P>
<P><IMG height=200 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195226299.jpg" width=406></P>
<P>使用椭圆选框工具，创建如下选区。 </P>
<P><IMG height=233 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195230760.jpg" width=500></P>
<P>选择 &gt;&gt; 羽化，羽化度50。 </P>
<P>编辑 &gt;&gt; 清除。 </P>
<P><IMG height=92 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195232483.jpg" width=600></P>
<P>打开另一幅图像文件。&nbsp;</P>
<P><IMG height=407 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195234754.jpg" width=591></P>
<P>选择钢笔工具，并打开快速蒙版。</P>
<P><IMG height=442 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195243902.jpg" width=200></P>
<P>沿着人物边缘描点。</P>
<P><IMG height=125 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195312687.jpg" width=179></P>
<P><IMG height=129 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195336183.jpg" width=195></P>
<P><IMG height=133 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195415597.jpg" width=213></P>
<P>完成描点后，右键打开快捷菜单选择“建立选区”。&nbsp;</P>
<P><IMG height=201 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195428391.jpg" width=307></P>
<P>复制人物到Banner中，并置于适当位置，删除边线之外的部分。</P>
<P><IMG height=286 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195438793.jpg" width=633></P>
<P>使用文字工具输入网站标题。</P>
<P><IMG height=186 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195503634.jpg" width=267>. </P>
<P>步骤 2、导航栏制作</P>
<P>创建新的图层，并在如下位置建立矩形选区。 </P>
<P><IMG height=211 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195505614.jpg" width=800></P>
<P>选择渐变工具，并按下图所示设置前景色和背景色。 </P>
<P><IMG height=54 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195521852.jpg" width=59></P>
<P>创建新的图层，按住Shift拖动渐变工具制作淡淡的渐变效果。 </P>
<P><IMG height=364 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195521461.jpg" width=413></P>
<P>输入导航栏文字。&nbsp;</P>
<P><IMG height=64 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195535524.jpg" width=326></P>
<P>步骤&nbsp;3：主体和背景制作</P>
<P>利用之前创建的图案填充背景层。</P>
<P><IMG height=179 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195537355.jpg" width=574></P>
<P>建立内容栏。</P>
<P>创建新的图层，并绘制如下矩形选区。&nbsp;</P>
<P><IMG height=495 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195546379.jpg" width=128></P>
<P>使用白色填充，将网站分为两个部分。&nbsp;</P>
<P><IMG height=264 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195550624.jpg" width=350></P>
<P>添加内容文字。</P>
<P><IMG height=290 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195604339.jpg" width=518></P>
<P>在右侧分栏内建立链接。&nbsp;</P>
<P><IMG height=155 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195623527.jpg" width=206></P>
<P>一个利用PS制作的游戏网站就完成了。</P>
<P><IMG height=577 src="http://www.cgfancy.com/Article/UploadFiles/200606/20060604195625114.jpg" width=780></P>
<BR><script language="JavaScript" src="http://www.16xx8.com/bbs/10.js"></script><BR>