我要投稿
当前位置:首页 > 经验分享 > 2018网页UI设计:轻松搞定视觉层次感
2018网页UI设计:轻松搞定视觉层次感
2018-7-4 16:10:00   作者:就放过自己   人气:3次  评论(0)
所属标签: 设计经验 

  众所周知,相较于平淡无奇,毫无重点的网页ui设计,具有良好视觉层次结构的网页UI设计更受用户青睐。为什么呢?答案其实很简单。极赋视觉层次感的页面设计不仅极具设计美感,取悦用户身心。而且还建立了清晰直观的视觉层级, 方便用户简单快速的识别和读取需要的页面内容,从而提升用户体验,降低跳出率。但是,究竟如何才能结合网页/产品特色和用户的真实需求, 将页面视觉内容层级化, 从而提供更加优质的用户体验,实现与用户的互动, 最终促成产品购买呢?
  
  下面小编就结合最新且具有极佳视觉层次感的网页设计实例分析和介绍视觉内容组织技巧,以及在原型化这些网页设计的过程中需要注意的原型设计技巧:
  

设计经验

  1.利用界面元素尺寸大小建立层级结构界面元素(例如文字,图片或形状等)尺寸越大,越突出,越容易吸引用户的注意。所以,在具体的网页界面设计中,设计师可以通过有梯度的尺寸变化,创建页面信息的层级关系。当然内容重要性上,也应该是与尺寸大小成正比的(即越大越重要)。利用文字的尺寸大小,体现网页信息的层级。注意:尺寸大小也要控制在用户能够接受的范围内太大,能够展示的内容有限。太小,易读性差,也会比较繁杂。
  
  2.利用界面元素明暗,阴影以及透明度的不同,体现简单层级如白底黑字般,同类元素,同一色彩,不同的明暗,阴影以及透明度,也可体现简单的层级关系。当然,在没有过多颜色的参与下,不同文字,图片等多种的页面元素结合透明度,阴影以及明暗,也可使整款设计极具简约风和层次感。
  
  3.利用色彩,划分页面层级色彩,作为设计师最常使用的视觉层次工具,也为他们创建极富层级感的网页设计发挥着举足轻重的作用。而具体的设计技巧,大家可以参考以下几点:首先,色彩明亮的页面元素更容易从相对柔和的元素中脱颖而出。
  
  4.利用页面布局,展现网页层级结构页面布局也是设计师们常用的视觉工具之一。一方面,同一网站,内部各个页面可以根据软件或产品展示内容需求,采用多样的布局模式,增加页面的多变性和可读性。另一方面,也可直接在不同页面采用重复的页面布局,方便帮助用户形成一定的阅读习惯,快速有效的查询需要的信息。