線是最基礎(chǔ)的,也是設(shè)計中最常見的,希望這篇文章對大家有所幫助。
一、線的概念
線是點運動的軌跡。幾何學(xué)上的線只有長度和方向,沒有粗細、寬窄、厚薄和形狀之分。平面構(gòu)成中,線的主要作用是強調(diào)方向和長度,并用以引導(dǎo)視線。
二、線的分類與情感色彩
在平面造型中,線比點更具有感情色彩,這主要體現(xiàn)在長短、粗細、曲線和虛實。線總體上可以分為直線和曲線兩類。直線可分為豎線、橫線、斜線、折線、放射線等。曲線可分為S曲線、弧線、螺旋線等。
1. 直線
直線讓人聯(lián)想到巍峨的山脈、高達的建筑物、參天大樹等。直線是男性的象征,簡單明快,給人一種穩(wěn)定、冷峻和堅強的感覺,富有速度感和緊張感,是一種力量的美。
豎線
為什么一根豎線會立著?一種情況就是沒有任何的力施加在上面;另一種情況就是所以施加的力正好相互抵消,所以它才可以穩(wěn)穩(wěn)的立在那里。
照片拍攝的是上海陸家嘴、上海中心大廈和環(huán)球金融中心,雖然是個很高很雄偉的建筑,但是它們豎立在城市中央?yún)s給人一種安靜、穩(wěn)定的感覺。
上圖拍攝的倆頭豹子,豹子平時給的人感覺是很兇猛,當豎線構(gòu)圖時卻給人一種安穩(wěn)、親密,不會讓人產(chǎn)生恐懼。
上圖是 Walid Beno 的設(shè)計作品,他也是用的豎線的構(gòu)圖方式,建筑有高有低錯落開來,加上冷暖配色的對比,能突出城市很有秩序積極向上的感覺。
豎線給人的感覺是「下落、上升、挺拔、穩(wěn)定、刻板、剛毅、有力、親密、利索、肅穆……」
橫線
橫線也同樣,它不需要任何的力就能保持水平狀態(tài),也可以因為是上下的力同時抵消達到水平狀態(tài)。
拍攝青海湖的一張照片,天空、湖面、地面都在同一條水平線上,給人很安逸、干凈、舒適的感覺。
上圖小魔女007畫的一張插圖,插圖中天空、湖面、地面、汽車、人物差不多都在同一水平線上,能感覺到大家在短暫的假期中旅游享受著安逸、舒適,長時間的工作讓大家失去了年輕人那時候活潑調(diào)皮的一面,畫面給人一種沉著、理性、安靜、舒適的感覺。
橫線給人的感覺是「安定、平穩(wěn)、沉著、理性、干凈、整齊、中規(guī)中矩、安靜、穩(wěn)定、安全、波瀾不驚、無聊……」
斜線
斜線受到的力并不穩(wěn)定,才會出現(xiàn)斜線的狀態(tài),具有動勢、上升下降連續(xù)狀態(tài)的運動感,富有朝氣。
上圖是一張攝影照片,畫面都整齊劃一的傾斜,給人一種干凈、力量、動感的感覺。
一個棒球運動的網(wǎng)頁設(shè)計,傾斜的感覺可以增加畫面的運動和力量之美,還能起到分割畫面的作用。
斜線給人的感覺是「活潑、傾斜、運動、不安定、動感、力量、刺激、危險……」
折線
折線本來是一根直線,不屈服于外面施加力而形成的。
北京的鳥巢,它的外輪廓就是用了大量折線構(gòu)成的,給人一種剛毅、對抗、力量、不屈服的精神,這種精神也代表了奧林匹克精神。
閃電的照片,閃電就是大量的折線構(gòu)成的,給人危險、緊張的感覺。
UI界面設(shè)計,地圖中用了折線做指引,給人一種明確指引,更加的突出。
折線給人的感覺是「緊張、不屈服、剛毅、對抗、力量、沖突……」
放射線
放射線有極大的沖擊力,有往里聚集也有往外噴發(fā)的力量。
我們小時候看包青天的時候,經(jīng)常出現(xiàn)這樣的圖片,太陽發(fā)出來發(fā)射線的光,代表著希望、威武、神圣,老百姓都希望得到公平公正。
我們小時候看的動畫片灌籃高手,有一個很厲害的阿里設(shè)計師UISTAR就用的這個圖片作為頭像,頭像中放射狀聚焦自我,動不動就自戀,很符合櫻木花道的性格。
banner圖,放射線在 banner 設(shè)計中經(jīng)常被用到,它有強調(diào)、聚集、突出的作用。
放射線給人的感覺是「強調(diào)、聚集、突出、速度、發(fā)射、力量、方向、沖擊……」
2. 曲線
曲線是女性的象征,讓人想起潺潺流水、風(fēng)擺春柳等。與直線的冷峻、硬朗不同,曲線是溫暖而柔美的,易產(chǎn)生豐滿、輕快、跳躍、流動而自由的感覺,發(fā)散而靈活,充滿生命力。
S型曲線
S型曲線原本是條直線,由于施加在它身上的力的不同,而且它本身柔軟的順應(yīng)這個力的,是一種包容的美。
一張美女的照片,很多女生都希望自己有 S型曲線,S型曲線符合人體美學(xué),給人舒適愉悅的女性魅力。
上圖是網(wǎng)頁設(shè)計,S型構(gòu)圖在網(wǎng)頁設(shè)計中能引導(dǎo)視覺,合理的分類信息能給人明快愉悅的沉浸感。
S型曲線給人的感覺是「柔軟、女性、包容、成長、舒適、愉悅、安全、母愛……」
弧線
弧線還可以細分為拋物線和圓弧。
一張鳥展開羽毛的照片,鳥兒展開的羽毛正好展開一張弧線,很優(yōu)雅自然,豐滿有張力。
UI設(shè)計中用到的弧線,正常情況下弧線表示進度、百分比,給人一種積極向上的努力的態(tài)度。
弧線給人的感覺是「彈性、豐滿、張力、生命力、果敢、優(yōu)雅、力量、規(guī)律……」
螺旋線
螺旋線是一邊前進時受到了側(cè)邊力的擠壓,如果它的外面始終都有外界施加的力就形成了螺旋線。
一個樓梯的螺旋線,很自然,有韻律,也很符合黃金螺旋線的美感。
上圖是 Mike 大神設(shè)計的網(wǎng)頁,在 banner 上半部分,視覺的重心也完全符合黃金分割中的興趣點。讓畫面很有張力也增加了韻律。
螺旋線給人的感覺是「神秘、神圣、韻律、引力、謎團、眩暈、優(yōu)雅……」
自由曲線
上圖是是蘇適的一幅書法作品,代表著放蕩不羈、自由灑脫的性格。
自由曲線給人的感覺是「自由、浪漫、灑脫、靈性……」
3. 隱藏的視「線」
隱藏的視「線」多指人的視線。
圖中兩個人物眼睛對視產(chǎn)生一條隱形的線。對視中眼神透入著希望、溫柔、包容。
隱藏的視「線」給人的感覺是「希望、活力、自信、神圣、溫柔、包容、智慧……」
三、線在設(shè)計中的常見應(yīng)用
1. 以線塑型
以線塑型即運用線的粗細、疏密來表現(xiàn)畫面的明暗關(guān)系及結(jié)構(gòu),從而塑造出物象的形體輪廓。
用線條在繪制人像,首先是需要深厚的繪畫功底,還要體現(xiàn)放蕩不羈灑脫的畫面感,雖然我們不能畫出來,但是我們可以觀察里面的結(jié)構(gòu)和明暗關(guān)系。
上圖這種很適合初學(xué)者,對著照片快速的提煉人物或物體的形態(tài),適當?shù)呐排虐婷,讓畫面看上去更豐富。
一幅好的插畫,前期也要很好的去構(gòu)圖,用鋼筆工具繪制好路徑,讓線條看上去流暢,簡單的交代明暗關(guān)系。
2. 高度概括,簡潔明了
在攝影中經(jīng)常能看到這種高度概括的光影關(guān)系,很簡潔明了,也很干凈舒適,粗細的曲線給人一種流動感,很大氣。
一筆畫 icon,在繪制這種 icon 也很考驗設(shè)計的功底,明快簡單的勾勒出大體的線條,還要讓畫面有一種統(tǒng)一感。
3. 提示強調(diào),突出重點
上圖是 MBE 大神的作品,他把線條用黑色或者深色來高度提煉輪廓,來保障畫面的統(tǒng)一。
奔跑的包子插畫鋪作品,他跟 MBE 一樣在用了黑色線條的基礎(chǔ)上加粗了線條,來起到突出強調(diào)的作用。
網(wǎng)頁設(shè)計,用方框的線條來區(qū)分信息,加強并突出。畫面中好幾個方框通過大小對比再次突出重點。
是網(wǎng)頁設(shè)計,用短線條來提示標注標題,畫面中用重復(fù)的短線給人統(tǒng)一的感覺。
4. 分割信息
app界面,通過線的分割讓畫面更清晰,層次更明確。
上圖是網(wǎng)頁,畫面中的線條不但有分割的作用,橙色的顯示還有交互含義。
5. 使畫面更柔美
上面兩張圖都是 UI設(shè)計,曲線運用恰到好處,讓畫面更有節(jié)奏感和韻律,沒有呆板的感覺。
兩張圖都是通過曲線來豐富畫面。更加的柔軟有親和力,讓畫面更加飽和。
6. 視覺引導(dǎo)
上圖的信息分類的引導(dǎo),有序的進行信息分類,通過線條指引代表先后順序讓畫面更流暢。
地圖中線條指引可以讓用戶快速的從出發(fā)地到達目的地。簡單明了。
網(wǎng)頁中也可以通過改變線條的色彩,按照色彩順序有序的排列指引。
7. 交互動效引導(dǎo)
動效中的線條正常都是指引的作用,從一端開始從另一端結(jié)束,引導(dǎo)用戶的眼睛按照線條變化走動。
△ 通過線條來顯示當?shù)?Tab 頁面,改變 tab 頁線條也跟著變動
總結(jié)
線的情感色彩:
- 豎線給人的感覺是「下落、上升、挺拔、穩(wěn)定、刻板、剛毅、有力、親密、利索、肅穆……」
- 橫線給人的感覺是「安定、平穩(wěn)、沉著、理性、干凈、整齊、中規(guī)中矩、安靜、穩(wěn)定、舒適、波瀾不驚、無聊……」
- 斜線給人的感覺是「活潑、傾斜、運動、不安定、動感、力量、刺激、危險……」
- 折線給人的感覺是「緊張、不屈服、剛毅、對抗、力量、指引、沖突……」
- 放射線給人的感覺是「強調(diào)、聚集、威武、神圣、突出、速度、發(fā)射、力量、方向、沖擊……」
- S型曲線給人的感覺是「柔軟、女性、包容、成長、舒適、愉悅、安全、母愛……」
- 弧線給人的感覺是「彈性、豐滿、張力、生命力、果敢、優(yōu)雅、力量、規(guī)律……」
- 螺旋線給人的感覺是「神秘、神圣、韻律、引力、謎團、眩暈、優(yōu)雅……」
- 自由曲線給人的感覺是「自由、浪漫、灑脫、靈性……」
- 隱藏的視「線」給人的感覺是「希望、活力、自信、神圣、溫柔、包容、智慧…..」
線在設(shè)計中的應(yīng)用:
以線塑型/高度概括,簡潔明了/提示強調(diào),突出重點/分割信息/使畫面更柔美/視覺引導(dǎo)/交互動效引導(dǎo)
承擔因您的行為而導(dǎo)致的法律責任,
本站有權(quán)保留或刪除有爭議評論。
參與本評論即表明您已經(jīng)閱讀并接受
上述條款。