对内容进行分组,使界面的信息传达更加清晰

2021-09-06 21:29:40  23 浏览  0 评论   赞

结构设计———内容的分组;使用线、框、背景色来分组;使用线来分组;使用框来分组;使用背景色分组;利用空间的远近来对界面内容进行分组

对内容进行分组,使界面的信息传达更加清晰

图15578-1:

构建界面视觉层级的元素有颜色的显著程度,图片、文字的尺寸大小,还有最基础的,内容的组织结构。

结构设计是指对界面内容进行分组,对界面中的信息、数据进行设计使之结构化呈现的过程。

好的结构设计能使界面信息传达更加清晰、快捷。那么,如果进行结构设计呢?

结构设计———内容的分组

使用线、框、背景色来分组

这是最常见的分组方式,在UI设计中历史悠久。

使用线来分组

使用框来分组

使用背景色分组

不管是线、框,还是背景色,都是可见的边界,本来引入这些可见边界的目的就是为了使信息的呈现更加清晰,但是这些视觉元素的加入也在一定程度上增加了界面的凌乱感。所以,现在越来越多的会利用空间的远近来对界面内容进行分组。

利用空间的远近来对界面内容进行分组

从XP到win7,变化很明显。

网页设计中也是一样,越来越多的新界面采用极简主义的思路,只保留了极少的线和背景色,更多时候是通过拉大区块之间的距离来分组。

喜欢深究的人也许会问,为何没有可见边界,我们也能清楚的根据距离的远近来对信息进行分组呢?

关于这一现象,在20世纪早期,一个德国的心理学家研究小组就进行过研究,试图解释人类视觉的工作原理。他们观察了许多视觉现象,并提出了格式塔(Gestalt)原理。针对这一现象,是其中的"接近性"原理。

 

转载请注明:网创网 www.netcyw.cn/b15578.html

赞 ()
发表评论
  • 昵称
  • 网址
(0) 个小伙伴发表了自己的观点
    暂无评论

Copyright © 2018-2019 小王子工作室 版权所有 滇ICP备14007766号-3 邮箱:yangzy187@126.com