织梦CMS - 轻松建站从此开始!

我的网站

Photoshop设计简洁灰色用户登录界面(2)

时间:2014-06-11 21:03来源:思源教程 作者:设计癖 点击:
步骤5 登陆界面的背景效果处理完毕,不过还需完善一下,添加1px的细线可以使整个背景看起来不会太过空洞。细线的颜色与此前的应,除了灰色的细线,

步骤5

Photoshop设计简洁灰色用户登录界面

登陆界面的背景效果处理完毕,不过还需完善一下,添加1px的细线可以使整个背景看起来不会太过空洞。细线的颜色与此前的应,除了灰色的细线,1px的白色细线刚好放在灰色线之下。

步骤6

Photoshop设计简洁灰色用户登录界面

在登录背景的左上角写上”Login Form”的字样。写不写文字对PS布局并无大碍,倒是在实际的网站中更为重要。文字采用深灰色,与背景色形成反差,突出强调效果。

步骤7

Photoshop设计简洁灰色用户登录界面

使用圆角矩形工具(U)创建两个白色形状,作为用户名和密码的输入框。为这两个形状应用描边样式,大小1px,颜色为#dbdada,在用户名的输入框中随便写一个电邮名,在密码输入栏中输入星标(*)。文字字体采用Droid Sans,可在Google Fonts找到。

步骤8

Photoshop设计简洁灰色用户登录界面

在两个输入框中添加上小图标,提升用户友好度,方便用户找到对应的输入区。

步骤9

Photoshop设计简洁灰色用户登录界面

使用圆角矩形工具(U)创建两个10×10像素的形状,接下来为他们描边,颜色为#dbdada。使用自定义形状工具(U),从中选择“打钩”的图案放入形状的中央。

(责任编辑:RGB)
织梦二维码生成器
顶一下
(1)
100%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片
栏目列表
推荐内容