当前位置:中国商贸新闻网 -> 文化

杭州北大青鸟:如何设计出更高级的UI界面

时间:2018-08-28 17:39:53

  人们都希望通过规则来让事情变得更容易理解。对于平面设计师如此,对于数字化也是如此。经过组织和整理之后的UI界面,无论是APP还是网站,都希望能够被用户更好的了解、使用和吸收,这也就是真正让用户满意的产品必由之路。那么为了更好的组织UI内容,设计师需要具备让视觉内容层次化的设计技能。那么,今天就让杭州北大青鸟来带你探讨一下如何真正有效地组织视觉内容。

  视觉层次是什么?构建视觉层次是设计师在设计过程中最为核心的设计技术之一。通过检测用户和元素之间关系的视觉感知,发现人们倾向于将视觉关系靠近元素群视作为有关系的一组。

  

  通过将内容按照一定的视觉层次进行构建,从而让用户在看到APP和网站内容的时候,能够轻松理解元素之间的关系以及他们的重要程度差异,通过视觉元素之间的视觉差异,让他们可以彼此区分。

  排版层次——文本内容是UI设计中需要处理的重要组成部分,这也就是为什么视觉层次的构建很大程度上依赖排版的原因。通常,设计师会通过排版系统将文本内容以最适宜用户感知的方式组织起来,让最重要、最迫切需要被用户关注到的内容突出显示,字体的大小、色彩和字体都在样式调整的范围内。在排版层次中,包含着不同的排版元素,为了建立层次感,这些内容和元素会被分割成为不同层级。简单可以分为3个层级。

  第一层级:例如标题,这些元素旨在为用户童工核心信息,能够立刻引起注意。

  第二层级:例如普通标题和副标题,能够让用户快速阅读到,尽可能快熟了解到主要内容。

  第三层级:例如正文和一些额外信息,在这部分设计师一般会使用较小的文字,确保内容的可读性。

  由于正文内容通常是以设计中的内容信息载体,而大量的信息和内容需要逐步的呈现,因此设计师和编辑通常会将信息切割成不同的段落,让用户可以更佳直观的了解和吸收信息。但在做移动端设备进行排版设计的时候,设计师都会尽量控制在两个层级之内。主要是因为移动端的屏幕有限,无法承载3个层级的信息。

  当设计师已经确定了基本的内容和组件之后,就需要为它们制定呈现的层次和顺序了。区分层次最有效的手段则是通过尺寸大小差异化。大的比小的更重要,这种认知是根深蒂固的。用户会自然而然地关注到尺寸较大的文本和尺寸较大的图,设计师可以根据袁术的重要性,在尺寸上做文章。当然色彩也是尤为重要的,合理的色彩运用会产生更为明显的效果。不同的色彩加持在UI元素上能够构成微妙的层次结构。设计师在设计CTA按钮的时候,通常会选用和背景颜色差异明显的、大胆而扎眼的色彩。但是颜色在对比的时候还是要尽量保持整体上的均衡,尽量不要因为对比而让某些元素被用户忽略掉。

  

  当用户界面当中的元素和组件设计完成后,还需要让这些元素周围有足够的留白,这样留白和元素之间可以构成一定的疏密对比,让用户注意到留白包围下的内容。除此之外,UI元素之间的靠近度也是需要设计师重视的,将不同的元素分为不同的组。让相关的相似的元素更靠近一点,让不同和无关的元素隔得远一些,不同的靠近度让元素成为了不同的类别和分组。不断重复的元素、样式、色彩、文本会被用户注意到,它们会被识别为一种固定的模式,或者说规律,这样也就构成了统一的推则。比如,设计师会在文章中引用重要的句子,这些句子会用单独的样式和色彩高亮突出,当你下一次在另一篇文章当中看到类似的色彩和文本,会迅速明白你看到的是一句引用。视觉层次是搭建有效信息架构的基础。当用户界面的元素需要结构化和组织化的时候,视觉层次的构建能够有效地帮你达成这个目标。清晰的视觉层级是整个导航体系中不可分割的一部分,它们让用户更快了解产品的特征。

  杭州北大青鸟专门开设的UI设计师课程,为学员进行专业对口发展的专业辅导,还开设有模拟课堂,让学员们在学习和实践过程中,综合发展,全面提升。如果你有需求,欢迎咨询。

来源:   作者:   编辑: 王金雷
  • 商贸
  • 独家
  • 娱乐
  • 体育
  • 健康
  • 文化
国际对外汉语教师资格证书,老
国际对外汉语教师资格证书,老

国际对外汉语教师资格证书,老外认哪个?

Bugaboo隆重推出Stellar夜精灵
Bugaboo隆重推出Stellar夜精灵

映客上半年财报广告营收4784万 同比增长24倍

创业电影《燃点》:创业不晚 圆梦未来
创业电影《燃点》:创业不晚 圆梦未来

创业电影《燃点》:创业不晚 圆梦未来

金诚集团象山项目正式启动 为体育产
金诚集团象山项目正式启动 为体育产

金诚集团象山项目正式启动 为体育产业带来更多发展契

 智特医疗携程首场美国辅助生殖及冻
智特医疗携程首场美国辅助生殖及冻

智特医疗携程首场美国辅助生殖及冻卵讲座圆满成功

“幸福手拉手 梦想齐飞扬”——聚源
“幸福手拉手 梦想齐飞扬”——聚源

杭州北大青鸟:如何设计出更高级的UI界面