首页 ui设计分割方式

ui设计分割方式

举报
开通vip

ui设计分割方式ui设计分割方式 在交互时代ui实训基地的独创课程中,许多实训项目考核重点不一,这些实训内容中有web网页的UI设计,有移动端APP的UI设计,还有移动端网页的UI设计等等。而做这些UI交互设计,无疑都会涉及到一个内容,即是区域的分割,当然,这也是交互时代的课程中的一个重点,大部分的分割方式都用线的形式,做出各种区域,这是一种传统的区域分割方式,今天跟大家分享一下什么是非传统的ui设计分割方式。 下面以一个网站为案例说明,如下图我们可以观察到,那条分割线其实是非常细的,隐隐约约可以看到,仅仅占两个像素那样的宽度。...

ui设计分割方式
ui设计分割方式 在交互时代ui实训基地的独创课程中,许多实训项目考核重点不一,这些实训内容中有web网页的UI设计,有移动端APP的UI设计,还有移动端网页的UI设计等等。而做这些UI交互设计,无疑都会涉及到一个内容,即是区域的分割,当然,这也是交互时代的课程中的一个重点,大部分的分割方式都用线的形式,做出各种区域,这是一种传统的区域分割方式,今天跟大家分享一下什么是非传统的ui设计分割方式。 下面以一个网站为 案例 全员育人导师制案例信息技术应用案例心得信息技术教学案例综合实践活动案例我余额宝案例 说明,如下图我们可以观察到,那条分割线其实是非常细的,隐隐约约可以看到,仅仅占两个像素那样的宽度。明线一个像素宽度,暗线一个像素的宽度。 传统的线条分割方式在以往的界面设计中都起到了不错的效果,不过在移动端的UI设计上却不适用,因为他们占用空间。或许大家都会想,不就一条线吗?还能占多大的空间?但其实,我们的一个页面需要隔开的内容有很多,分割线可少不了。因此如果使用传统的分割方式,必然是浪费空间的。 这样一来,分隔界面元素的时候用留白比用分隔线更加合适。更少使用的线让界面看起来更干净,更现代,视觉上也更富有张力。 留白 在一份UI设计中,既然是留白区域,那么里面肯定是不会有任何设计元素的。而留白能够让整个UI设计看起来很简单,并且,利用留白还可以凸显设计元素,让整个UI设计看上去更简洁,也更好看。红色全出来部分是现代ui设计分割方式; 用好留白,你能让界面以非侵略性的方式来区分不同的区域和元素。 色彩对比 色彩对比也是分隔的方式之一,可以说是一种强大的设计手法,运用的好,我们的UI设计能够相当吸引用户眼球。利用色彩之间的差异来区分不同的内容,而这就要看我们队色彩使用的程度了,要如何让两种色对更易区分而又不产生突兀的感觉,是很难的,但是运用的好,就可以让用户更快速的达成自己的目的,从而获得良好的用户体验。 阴影和高度 阴影和高度都能在UI界面上创造出“深度”,相当于是让元素在Z轴高度上产生差异。最典型的就是Material Design 的设计,谷歌日历的设计很好地展现了如何借助阴影和空间,非强制性地区分不同的部分。 阴影的另外一个作用是用来区分重叠内容的“高度差”,呈现相互关系,让其中的某个部分吸引用户的注意力。
本文档为【ui设计分割方式】,请使用软件OFFICE或WPS软件打开。作品中的文字与图均可以修改和编辑, 图片更改请在作品中右键图片并更换,文字修改请直接点击文字进行修改,也可以新增和删除文档中的内容。
该文档来自用户分享,如有侵权行为请发邮件ishare@vip.sina.com联系网站客服,我们会及时删除。
[版权声明] 本站所有资料为用户分享产生,若发现您的权利被侵害,请联系客服邮件isharekefu@iask.cn,我们尽快处理。
本作品所展示的图片、画像、字体、音乐的版权可能需版权方额外授权,请谨慎使用。
网站提供的党政主题相关内容(国旗、国徽、党徽..)目的在于配合国家政策宣传,仅限个人学习分享使用,禁止用于任何广告和商用目的。
下载需要: 免费 已有0 人下载
最新资料
资料动态
专题动态
is_358746
暂无简介~
格式:doc
大小:17KB
软件:Word
页数:0
分类:
上传时间:2019-07-19
浏览量:4