Photoshop设计简洁大方的个人作品网页界面（3）

• 个人作品
• 界面
• 网页
• 设计

Step 22

前景色改成#11171c，打字，随喜，按照作者的例子也行。大小14pt，加粗，位置：距圆形和顶部都是20px。

恩，到这个时候你可能注意到整个设计的节奏感了，如何去平衡页面的各个元素非常重要，这也是这个教程的目的。

Step 23

前景色改成#5e5e5e，颜色的减淡使页面有层次感，阅读更加容易。

文字改成正常，不加粗，打出简介的内容，间距18pt。

回车两次，介绍客户，贴上标签，加粗文字，以便突出，间距同上，如图：

Step 24

复制圆形，重复步骤，圆形的位置取决于后面内容的篇幅。

Step 25

最后一个区域了，回到作品图层组

创建610x400px大小的矩形，颜色可以先搁下，位置：紧贴第六条参考线与第八条，距顶部20px

Step 26

将素材的笔记本PSD拖进来，同样转成矩形的剪切模板，调整到合适大小。

Step 27

复制矩形，移动到离第一个矩形20px处，以此类推，再加上素材里的图片，重复蒙版的步骤。

Step 28

重复简介部分的操作，记得对齐。

Step 29

把矢量素材的刷新图标拖进来，颜色叠加#a0a2a4，大小20x20px，位置：距图片下方20px，

Step 30

最后一步咯

打字，大小14pt，加粗，输入Loading…移动到距图标10px处，水平对齐。然后一起移动两个图层，直到在参考线的中间。

现在一个作品集时间轴的效果图已经完成了，你随时可以交给网页设计师，在浏览器上实现它。