提交需求
赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!
空间是具体事物的组成部分,是具体事物具有的一般规定。
眼睛可以看到、手可以触到的具体事物,都是处在一定空间位置中的具体事物,都具有空间的具体规定,没有空间规定的具体事物是根本不存在的,因此它确实存在,并时刻影响着设计师在设计过程中执行的每个环节。
因此,本文将详细阐述空间在产品UI设计中的使用方式以及对界面设计的影响作用。
1.周围空间
在UI设计中,我们通过考虑板块与板块的间距,元素与元素之间的放置,来引入空间这一概念。
当元素放在一起时,他们可以视为一个单一元素或者一个群体元素,那么元素之间的距离在某种意义上来说直接影响界面整体的美观度,整齐度,一个合理的空间安排,将会增加可用性并减少产品的认知负担。在移动端产品设计中,我们也可称其微空间。
元素间距过于松散会导致用户视觉混乱,缺乏清晰结构。收紧相关元素之间的间距可以提高连贯性并减少混乱。
使用邻近组元素和间距来创建订单
空间的存在,使设计中产生留白,这是主要板块或元素之间的负空间,决定设计中的整体美感,不但可以提升视觉美观程度,而且可以很好的指引用户在整个页面的关注程度,元素周围有充足的空间会引起用户视线的停留。
在设计中,我们可以改变板块之间的距离来更清晰的呈现界面的层次结构,有所突出主要内容,提高连贯性,减少混乱,并通过扩展页面上单独元素的数量来引导用户的注意力。
2.占用空间
与负空间相反的空间我们称之为正面空间或占用空间,在设计中,我们不仅要考虑元素之间的空间,而且要考虑元素本身的大小,通过改变元素的大小可以合理控制页面视觉布局,让其产生层次结构。
无对比,不设计。元素大小的对比是创造有趣设计的一种方式,它往往会让页面提升设计感,也是影响设计好坏平庸差异的因由之一。
不同文字的粗细大小使页面产生对比
布局中有太多不同的视觉可能会让整体杂乱无章,一个有规则设计,是在大约3-4个不同元素或者模块来组成,可能是大标题,段落文本,图像和一组按钮或者链接。
3.内部空间
元素内的空间包含容器的填充(比如:按钮的填充)和文本的间距(比如:字符间距和文本段落),这种空间我们称其为内部空间,主要控制设计的可见性,但是同样也是创造视觉感受的一种方式。
a.字符间距产生的空间
字间距是文本之间的空白,对于可读性而言,太紧或太松都会影响字体之间的空间,注意这里字符间距是字符之间的整体空间(不要与字距混淆),在文字空间排版中,分享一个小技巧:正文文字大小设置为文本大小的150%,可满足于用户的可访问性。(之前有详细介绍字体排版的设计参考,所以我不会在这里详细介绍,但如果你想了解更多,我建议阅读这篇文章http://www.ui.cn/detail/367559.html)
b.按钮填充和描边产生的空间
填充元素和描边元素之间产生的空间,在UI设计中依然很重要,我们可以给按钮填充颜色,可以给主要元素填充颜色,如果在设计中,我们遇到要很多按钮或者元素要展示,通常按钮填充的宽松比较安全,而过于紧密的填充则会使界面显得杂乱无章,难以区分各个元素。
板块之间的填充间距产生的空间
4.总结
设计师可以通过空间的改变来提升界面设计感,间距影响界面的美观程度,希望每一位设计师在UI设计中都可以根据自己的产品来判断要如何控制界面的空间体验,如果这篇文章对你有帮助,那就点个赞,么么踹。
原文地址:https://medium.com/@bsharman/space-in-ui-design-129eab618bc8
原作者:Brendan Sharman
译者:栗子
自媒体:栗子的产品笔记
大牛,别默默的看了,快登录帮我点评一下吧!:)
登录 立即注册