在交互時(shí)代的獨(dú)創(chuàng)課程中，有許多實(shí)訓(xùn)的部分，這些實(shí)訓(xùn)內(nèi)容中有web網(wǎng)頁的UI設(shè)計(jì)，有移動(dòng)端APP的UI設(shè)計(jì)，還有移動(dòng)端網(wǎng)頁的UI設(shè)計(jì)等等。而做這些UI設(shè)計(jì)，無疑都會(huì)涉及到一個(gè)內(nèi)容，即是區(qū)域的分割，當(dāng)然，這也是交互時(shí)代的課程中的一個(gè)重點(diǎn)，大部分的分割方式都用線的形式，做出各種區(qū)域，這是一種傳統(tǒng)的區(qū)域分割方式，而今天交互時(shí)代給大家?guī)淼模欠莻鹘y(tǒng)的，接下來，就開始我們的正文吧。

傳統(tǒng)的線條分割方式在以往的界面設(shè)計(jì)中都起到了不錯(cuò)的效果，不過在移動(dòng)端的UI設(shè)計(jì)上卻不適用，因?yàn)樗麄冋加每臻g?；蛟S大家都會(huì)想，不就一條線嗎？還能占多大的空間？但其實(shí)，我們的一個(gè)頁面需要隔開的內(nèi)容有很多，分割線可少不了。因此如果使用傳統(tǒng)的分割方式，必然是浪費(fèi)空間的。

這樣一來，分隔界面元素的時(shí)候用留白比用分隔線更加合適。更少使用的線讓界面看起來更干凈，更現(xiàn)代，視覺上也更富有張力。

留白

在一份UI設(shè)計(jì)中，既然是留白區(qū)域，那么里面肯定是不會(huì)有任何設(shè)計(jì)元素的。而留白能夠讓整個(gè)UI設(shè)計(jì)看起來很簡單，并且，利用留白還可以凸顯設(shè)計(jì)元素，讓整個(gè)UI設(shè)計(jì)看上去更簡潔，也更好看。

用好留白，你能讓界面以非侵略性的方式來區(qū)分不同的區(qū)域和元素。

色彩對(duì)比

色彩對(duì)比也是分隔的方式之一，可以說是一種強(qiáng)大的設(shè)計(jì)手法，運(yùn)用的好，我們的UI設(shè)計(jì)能夠相當(dāng)吸引用戶眼球。利用色彩之間的差異來區(qū)分不同的內(nèi)容，而這就要看我們隊(duì)色彩使用的程度了，要如何讓兩種色對(duì)更易區(qū)分而又不產(chǎn)生突兀的感覺，是很難的，但是運(yùn)用的好，就可以讓用戶更快速的達(dá)成自己的目的，從而獲得良好的用戶體驗(yàn)。

陰影和高度

陰影和高度都能在UI界面上創(chuàng)造出“深度”，相當(dāng)于是讓元素在Z軸高度上產(chǎn)生差異。最典型的就是MaterialDesign的設(shè)計(jì)，谷歌日歷的設(shè)計(jì)很好地展現(xiàn)了如何借助陰影和空間，非強(qiáng)制性地區(qū)分不同的部分。

陰影的另外一個(gè)作用是用來區(qū)分重疊內(nèi)容的“高度差”，呈現(xiàn)相互關(guān)系，讓其中的某個(gè)部分吸引用戶的注意力。

以上，就是交互時(shí)代關(guān)于分隔方式的一點(diǎn)粗淺見解，當(dāng)然，在UI設(shè)計(jì)中可不僅僅這幾種分隔方式，但是如果你想要了解更多關(guān)于UI設(shè)計(jì)方面的知識(shí)，就多多關(guān)注交互時(shí)代官網(wǎng)吧。

請(qǐng)聯(lián)系網(wǎng)站客服，了解詳細(xì)的優(yōu)惠課程信息~

優(yōu)質(zhì)、權(quán)威、便捷、省心