020-29815005
预约专线时间:09:00-23:59

“UI设计中的背景颜色应该取什么色值?

新闻来源:优漫教育 日期:2021-12-14
比如说微信的首页中,大范围的是对话列表的列表项,只有在顶部状态栏和导航栏以及下方的标签栏才是真正的背景色,而列表项的背景颜色又属于梁歪的背景颜色了,是局部的。我们这里所说的背景色是整体的,全屏的,大面积的背景色。二者还是应该有所区分的。再比如拼多多来说…

  比如说微信的首页中,大范围的是对话列表的列表项,只有在顶部状态栏和导航栏以及下方的标签栏才是真正的背景色,而列表项的背景颜色又属于梁歪的背景颜色了,是局部的。我们这里所说的背景色是整体的,全屏的,大面积的背景色。二者还是应该有所区分的。再比如拼多多来说,只有其搜索框和列表项与列表项之间的分割条之间的区域是真正的背景色,而其列表项的背景色又是另外的一种背景色(ffffff)。


 UI设计中的背景颜色应该取什么色值?


  设置局部背景色的意义是让不同的内容块之间形成差异化,丰富页面的层次感,这有点类似于我们在网页设计中经常会用到的在背景上添加一个稍微亮一点的或者稍微暗一点的色块(容器),然后再在色块中装入其他东西。证书由于不同色块与色块之间的间隔,才形成了分隔条,所以说分隔条不是我们设置的,而是由内容块与内容块之间的间距而形成的。

  了解了背景色、分隔线、分隔条和列表项,其实我们对于一个页面的设计框架就有了。首先用背景色填充整个背景,这就不需要多说了。然后需要做的是将页面所要表现的内容划分为多个模块,比如说拼多多的首页可以划分为顶部导航栏(包括搜索框导航和文字导航)、百亿补贴专题页面和普通的商品列表项目。那么我们设计的思路就很简单了,将需要设计的页面整体上分为三块,第一块是导航,第二块是百亿补贴,第三块是列表项,然后分开去单独设计就好了。在块与块之间用分隔条进行分割,这样体现页面的层级关系。所以这么理解的,UI设计的框架布局还是比较简单的。

  UI设计中的背景颜色应该取什么色值?这里可以借鉴的经验就是将背景色设置为提到的三种颜色的其中一种,页面主体的颜色采用#ffffff这个颜色,然后分割线的颜色采用#dddddd或者#cccccc,高度为1像素,宽度为出去图片缩略图之外的区域。内容块与内容块之间间隔所想成的分隔条的宽度在20-30像素,即内容块与内容块之间的间距最近距离为20像素,最远距离为30像素。内容块的背景色其实就是我们所说的页面主体颜色,可以先设置我ffffff,如果是顶部banner或者导航区的,可以特殊对待。一般性的内容块,直接采用ffffff的背景颜色就可以了。

       以上就是有关“UI设计中的背景颜色应该取什么色值?”的相关内容,希望能帮到大家!学习ui设计培训,可以参考优漫教育提供的ui学习路线,优漫教育,作为职业能力培训中的新模块,坚持核心价值观做善良的人,充分利用现有IT培训优势,致力于帮助低学历、年龄小的学员提供技能+学历+就业的培训,培养面向互联网领域的高端人才,以提升学员综合素质,达到优质就业就业为目的。