2020-3-27 資深UI設(shè)計者
有句話叫：「設(shè)計無小事」，很多看似不起眼的東西卻起著至關(guān)重要的作用，比如這期要說的線條，很多人對于線條的理解有局限性，比如：線條的形態(tài)可以是曲線、直線、折線、粗線、細線、實線、虛線等等。其實已經(jīng)牽扯到了點、線、面的知識，這也是很多科班生在學校必學的知識點，但是這期所說的線與點線面中的線還是有所不同的，點線面中的線可以是線條、可以是文字或者是看不到的視線，而是今天著重說的是設(shè)計中很直觀的線條。下面我們還是通過實際的案例逐一分析：
設(shè)計類的知識很多都和日常生活息息相關(guān)，嘗試著把設(shè)計類的知識點與日常生活想結(jié)合，對于記憶和理解來說會更加得心應手，例如：
圖中的閃電可以視作為設(shè)計中的線條，給人的視覺感受是通過閃電把天與地連接為一個整體，而閃電在圖中的作用就是串聯(lián)整體，那么回到這里的正題：線條有引導視覺的作用該怎么理解呢？再舉一個現(xiàn)實生活中的案例：
我們選擇從北京到拉薩開車去，出發(fā)之前可能需要在地圖上看下路線，知道途徑哪些省市，規(guī)劃好行程路線，這里綠色的虛線就起到了引導視覺的作用。回歸設(shè)計中道理是一樣的，線條可以引導用戶把原本雜亂無章的視覺點規(guī)整為有次序的視覺元素，例如：
當看到左側(cè)這張海報時我們視覺次序會出現(xiàn)很多變化，比如：1>A>3>B>4>C>2 或者 A>2>C>4>B>3>1 等等 N 多種順序，這時給人的感覺就是雜亂無章的，毫無視覺次序而言；而看右側(cè)的海報給人的感覺卻是條例清晰的，相比而言只是多了兩條線，但是卻在整個海報中起到了引導視覺的作用，它可以給與用戶閱讀海報時視覺輔助的作用，讓用戶以右>左>右的視覺次序欣賞、閱讀，看似很不起眼，其作用卻至關(guān)重要。
前面也說了，線的形態(tài)可以有很多種，例如：
這里是以真實的可口可樂吸管作為設(shè)計中的線條，同樣起到了視覺引導的作用，但是我們不難發(fā)現(xiàn)，這里的線條不僅僅只有一個作用，也牽扯到另一個作用：線條有串聯(lián)整體的作用。
在排版時我們有分組原則，即把互想關(guān)聯(lián)的元素彼此靠近，無關(guān)聯(lián)的相互疏遠。在頁面中我們會把同一色塊上的元素視作為一個整體；下面我們說下線條所帶來的串聯(lián)整體的作用是如何體現(xiàn)的，比如：
△ 圖一
△ 圖二
圖一因為大面積的留白能使得用戶很容易分辨出自行車與文案是一個整體，但是相較于圖二而言，其整體性略顯不足，而且給人的感覺太過單薄、重心不穩(wěn)；圖二的整體性更強，這里的矩形線條就起到了串聯(lián)主題的作用，類似的還有：
不難看出，這些案例中的線條都有串聯(lián)主題的作用，線條使得主題元素整體感更強、畫面板式更加嚴謹；對于整體的視覺傳達也起到了串聯(lián)、引導的作用；在文字排版中，也有類似的線條，比如：
同樣是通過線條把文案更加整體化，也起到了串聯(lián)的作用。
突出主題的方式有很多種，像我們之前所說到的留白、對比。接下來繼續(xù)說下另一個可以突出主題的方式—線條，下面看個案例：
通過對比觀察我們發(fā)現(xiàn)，右側(cè)海報整體感更強，主題文案信息更加清晰，主體更明確。其中的原理可以理解為：因為線條的存在，使得主題信息有了一定的范圍，在視覺上等于是在海報中劃定了視覺焦點，從而起到了突出主題的作用。當然還有其他的表現(xiàn)形式，比如：
很好的詮釋了線條的作用——突出標題序號。在進行創(chuàng)作時，作品的每個元素都要做到有理有據(jù)，否則只是一味的抄襲，到再創(chuàng)作時腦袋里還是一片空白，只有明白了其中的設(shè)計原理，才能做到活學活用。再看幾個案例：
突出主題也許一個線條就可以表現(xiàn)的淋漓盡致，因設(shè)計目的的不同，線條所發(fā)揮的作用也不盡相同。下面繼續(xù)分析：
前面說了線條有串聯(lián)整體的作用，而這里又說可以分割整體，是否存在矛盾呢？下面舉個簡單的例子：
在小文案的區(qū)域中間我加了兩個線條，看似很小的改變，其目的是把文案很準確、嚴謹?shù)胤指顬槿齻€小整體，希望能給用戶帶來識別性更強的閱讀性，再舉個例子：
這里的線條把月份和日期分割、英文和中文分割開，使得用戶對于信息的捕捉能力以及可辨識性都提升了很多，而線條的作用就起到了分割的作用。
線條也能起到修飾、襯托的作用，很多小伙伴會忽視這一點，其實線條也可以成為海報中襯托畫面、修飾主題的元素，例如：
海報中的線條起到了襯托、修飾主題的作用，假如把這些線條都刪除，畫面整體會顯得相對單薄。
更多設(shè)計中線條的應用：
線條的作用我們分為四個逐一分析，其實它們之間也存在著相輔相成的作用，不能以一概全，線條所起到的作用可以是一種，也可以是多種，比如：我們前面「可口可樂」的案例，即有串聯(lián)整體的作用，又有引導視覺的作用。只要我們在使用的時候能明確目的，而不是機械式的抄襲，那么最終一定會得心應手。
文章來源：優(yōu)設(shè) 作者：美工美邦
藍藍設(shè)計的小編 http://www.gyxygd.cn