手把手教你制作新手引导图片

现在越来越多的网站都很注重用户的体验度，特别对新手，在用户注册成功后，都会有一个新手引导的界面。

让新手了解平台一些关键字或新增加功能，那些这些图片是怎么做的呢？

我只是一个程序员，不是美工。所以我想了很久，自己慢慢找到了感觉。虽然做的不专业，但对我来说已经足够了。

 

下面我就把制作新手引导图片的过程记录下来。方便自己以后查阅，同时也给有这方面使用的朋友一点帮助。

下面我就用我的平台来例：http://www.5iads.cn

第一步：需要先准备一张和背景图片。

　　　　打开QQ截图，把我需要做为背景的网页截图下来，保存到自己电脑磁盘里。

　　　　然后使用PS打开这张背景图片。

　　　　

 

第二步：在PS软件里操作，下面是关键步骤。

　　1.选择需要突出显示的部位，这里我使用了椭圆形来选择。

　　

　　如果你有多个部位需要突出显示，可以按住Shift键，然后再去选择其它的地方，

　　

 

　　位置已经选择了，下面就要动真功夫了。

　　鼠标右键，选择羽化，羽化半径设置为5像素，然后再鼠标右键，选择反向选择，如下图片：

　　

　　2.新建图层，然后把新建图层油漆成黑色。

　　

　　先把前景色修改为黑色#000000，再选择油漆桶工具，在新建层内点一下鼠标左键。

　　

　　完成后的效果：

　　

 

　　效果已经出来了，突出显示了3个位置，任务大厅，打码平台，游戏平台。下面将增加一些形状及文字。这些操作就简单一些了。

　　3.选择自定义图形工具，并选择自己喜欢的形状来显示文字背景。

　　

　　我选择了填充桔黄色，及黄色描边。形状选择凹四边形。然后把一些需要告诉新手知道的文字写上去。字体选择你喜欢的就可以了，效果如下：

　　

　　

 

　　到了这里基本上已经完成了。如果你还想搞得到更人性化一些，你可以添加一些人物形状或箭头，来指示一下操作。

　　最后我的效果是这样的。