查看: 50|回复: 0

充满设计感的登录界面都是这么做的

[复制链接]

3

主题

3

帖子

10

积分

新手上路

Rank: 1

积分
10
发表于 2018-2-7 10:02:48 | 显示全部楼层 |阅读模式
登录界面几乎都是APP和一些界面,登录界面包含的内容通常非常简单,用户名和密码,特别是现在的APP大多支持主流社交账号绑定登录,登录界面中的注册表单已不再常见。

但是用户体验的进步并不意味着设计的结束。今天我们来看看那些有趣的、充满设计界面的登录界面。

一、色彩变化

除了对已选/未选标签的透明度进行区别,在不同的标签上,界面的颜色也有所区别,除了让界面的设计上更具多样性,同样也让不同的颜色对用户起到不同的心理暗示

登录界面.jpg
二、前后交替
本设计可以看到下面的切换室在设计登录注册表上的两张牌,前后的操作不再是小卡片上的小面积变化,而是像卡一样交替,交互动画等相比我们普通登录界面更自然更新鲜有趣,不是吗?

三、左右横滑
登录界面2.jpg
看似常见的登录界面,在瞬间点击按钮,左右滑动切换的形式,除了改变信息的形式,在切换的过程中,背景图片仍然侧滑变化,并且都显示了登录界面僵硬单调的情况,给用户一种惊喜的感觉。

四、中轴翻转

在平面的网页表单上使用了 3D 反转的效果,让表单在点击标签进行切换的时候,沿中轴翻转,如果是空间局限性较大的设计当中,采用这样的方式进行转场,也不失为一种聪明的选择


五、缩放背景
登录界面3.jpg
虽然转场动画是常见的左右滑动,但是在表单项目由少变多的切换过程中,登录界面的背景图片被放大了,给用户一种拉近距离,展示更多具体内容的心理暗示,让表单项目数目变化不再突兀


六、Z 轴伸展

在 2D 的界面里,通过巧妙地利用 Z 轴方向位置的变化,让用户有种 3D 翻转的感受,但是要注意保留加载动画在用户的视线内,否则对登录进程不了解会让用户产生紧张感


七、形状变化
登录界面4.jpg
这种设计在我们的日常设计中已经很普遍,特别是在材料设计上,魔术纸的设计者已经达到了极限,我们也可以在通常的设计过程中使用这种方式,以按钮为单位,根据其相互作用和过渡。


八、排列交替

虽然是叫排列交替,但实际上也是利用了 Z 轴方向上距离的差异在用户视觉上产生前后排列交替的效果,事实上,这种交互效果在很多 App 上也被大量使用,可以说在寸土寸金的屏幕上最大化的利用了空间


今天简单总结一下一些有趣的登录界面设计,看看这些案例,我们也可以借鉴设计思想来推广我们的产品设计使用的任何地方,也欢迎在评论中与我们互动,分享更多有趣的设计理念。

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

最新精华

更多
logo设计   扁平化设计   交互设计   logo设计软件   美工培训   美工设计   ui设计培训   UI设计培训学校   游戏ui   ui设计教程   图标设计   Logo教程   ui界面设计   AI教程   UI设计师   ui交互设计   ui设计师招聘   淘宝美工设计   logo创意设计   淘宝美工培训   淘宝美工   ui素材   按钮素材   人机界面设计   手机界面设计   游戏ui设计   图标素材   

快速回复 返回顶部 返回列表