在设计界面的时候为了将主界面更加简单易用,经常会需要隐藏一部分内容或者有组织的划分这些复杂内容。今天这篇文章主要分享的是通过层级隐藏的界面方式。

这是一个非常流行的隐藏方式,甚至动效都非常容易完成。

视觉表现方法就是使用大圆角为底部。但用户触发入口时将画面上移,露出在“底部“隐藏的二级内容。二级内容主要是用用黑色/亮度低的背景。

无论是功能组件还是列表都可以采用层级式隐藏的表现手法。

这样做的好处主要是在于每一个功能切换一个页面会让用户操作起来变得复杂,每加载一个页面不仅需要时间,而且体验会出现断层,不够流畅。使用这种层级式隐藏用户只需要使用上滑手势就能够看到隐藏的功能。

这种方式还会给人一种真实的错觉。让人感受到第一个接触的一级框架是在高处、点击之后就会展现低处的东西。这和我们拉开抽屉的现实行为和视觉刺激相同,人们很乐意接受这种交互方式。

现在手机屏幕大多采用圆角设计,那么将带有圆角的整体屏幕上移会让这种体验更加真实和惊艳。

当然,有高层级点击展开低层级这种,也有低层级点击展开高层级悬浮窗。这种就比较常见了,现有的商业化app基本都会考虑过这种方式。已经见怪不怪习以为常了。

(图片来自于互联网,版权归原作者所有。作者信息详见我的 Pinterest,仅供学习使用,请勿转载和商用。Hoocan 仅提供作品的展示,Hoocan 未通过任何渠道进行盈利。)