新万博万博_万博出事了

当前位置: 万博 > 新万博教程 > 网页新万博教程 > Photoshop新万博时尚的个人作品网页界面

在本教程中我们将使用Photoshop CS6新万博一个简单痴扦刑、干净沸、三列的作品集时间轴酿傅。在这个过程中炽袜镭,我们将着眼于自定义网格桃捍,排版样式石猴,并利用不同的颜色和对比度实现我们想要的美感耸。

同学们可以从这个教程学习如何在一个页面平衡不同的元素骋卷,使整个新万博富有韵律感与呼吸感拟恃。快毕业的童鞋们可以尝试这样展示你的作品集哟敛岗堆。

先上效果图殴肝:

Photoshop新万博时尚的个人作品网页界面

Step 1

创建新文件标郎,参数如图费慨:

Photoshop新万博时尚的个人作品网页界面

Step 2

新建参考线锈糠,以便平衡视觉避。位置看荷:水平 60px肆,垂直分别是 20px,冻疯,50px侍,115px识煌,230px市饱马,550px逼耐,570px霉残,875px和1180px届挖,这里推荐同学们使用神器「GuideGuide」廓,具体使用有劳移步丰:PS 参考线插件GUID末末说:好的。水文与水资源工程EGUIDE下载及使用说明娇司,非常方便递黑。

Photoshop新万博时尚的个人作品网页界面

Step 3

为了保证我们的新万博有序专业舜硷郎,我们先新建3个图层组史故鸿,分别命名为膳妊:左侧栏佬迪、简介叫巳闻、作品糙。平常没关注规范的同学绿呵辱,优设哥特别向您和您所在的团队推荐《PS礼仪手册》!网页新万博师必须修炼的内功技法脯犯嚼,更是不可或缺的WEB新万博指南氯咐赫。

Photoshop新万博时尚的个人作品网页界面
Photoshop新万博时尚的个人作品网页界面

准备工作就此完毕咯卿。

Step 4

侧边栏为我们展示联系方式兴危、作导航和,让我们来建设它吧勺味。

选择矩形工具逆欣,前景色改为 #11171c墩邦羔,在左侧栏的图层组里画一个大小230x1320px的矩形臣辩观,移到左侧边缘绒厕,紧贴着第四条参考线就对咯费把辽,如图杜蟹:

Photoshop新万博时尚的个人作品网页界面

Step 5

在左侧栏的图层组新建一个图层组炉,位置在矩形上边嚷,命名为轮廓图冻。

然后利用椭圆工具起,摁住Shift幂剩,绘制大小100x100px的圆形壕,移到左数第三条参考线的中间乖康叹,上边紧贴水平参考线勿赡嘲,如图挤跋瘁:

Photoshop新万博时尚的个人作品网页界面

Step 6

现在腾混,请听指挥 ^_^ 完睫小,把电脑里最帅气最漂酿的头像找出来獭,拖进去纷,摁住Alt饱绢氓,单击圆形钠,作为剪切蒙版吐古慨,然后移动调整到合适第七章永不分离(2)太阳散步过来。(看得到脸)的位置猾估。

Photoshop新万博时尚的个人作品网页界面

Step 7

改变前景色为 #FFFFFF签,选择文字工具揣,选择安装好的字体乌端闲,大小16pt阀粉露,写上你的英文名浮间,移动到距头像下25px的位置辰敢壤,确保在第三条参考线的中间火。

Photoshop新万博时尚的个人作品网页界面

Step 8

现在为自己添加点个人介绍吧惕石怪,作者使用的字体大小14pt劣,距名字20px焦,这样界面看起来有呼吸感颈叔栖。

Photoshop新万博时尚的个人作品网页界面

Step 9

棒极了放敢,现在继续在左侧栏的图“真的,感觉如何?”物竞天择我做异乡人层组下新建一个图层组偏,命名为社交媒体晒诺。把素材里的图标拖进组里秀涸,双击图层街,颜色叠加——选择白色池备白。将图层样式复制到其他图标上玖怯。

Photoshop新万博时尚的个人作品网页界面

图标间距调整为10px榔慕孝,整个图标的图层组距离 简介 20px

Photoshop新万博时尚的个人作品网页界面

分享到: 
Photoshop制作透明大气的导航按钮
Photoshop新万博电影导演工作室网站万博

热门推荐