在日常的設(shè)計(jì)工作中,版式即一個(gè)畫面的骨架,也是視覺傳達(dá)的重要組成部分,版式整體的活躍程度也能起到改變畫面基調(diào)的作用,這也就是為什么很多作品看似很「簡單」,但卻不失設(shè)計(jì)感的原因。如何把原本比較中規(guī)中矩的版式結(jié)構(gòu)通過設(shè)計(jì)手法將其差異化、提升設(shè)計(jì)感、增強(qiáng)活躍度,這樣做的目的是為了打破墨守成規(guī)的形式,提升用戶停留時(shí)間,以及畫面的趣味性,所以本期就和大家一起總結(jié)一些常用增強(qiáng)版式活躍度、提升版式設(shè)計(jì)感的設(shè)計(jì)手法。
01#色塊疊壓法
色塊疊壓法,顧名思義就是改變色塊的擺放方式,可以分為兩類,第一類是色塊與色塊之間的疊壓。通過色塊與色塊之間的非常規(guī)擺放形式,打破原本常規(guī)的版式結(jié)構(gòu),增強(qiáng)其形式感、活躍度。下面我們舉個(gè)例子:
通過上下對(duì)比,我們不難發(fā)現(xiàn),下側(cè)畫面整體版式結(jié)構(gòu)更跳躍,直白地說就是不死板,而且形式感更強(qiáng),給人的感覺也更舒服、有趣味性;而上側(cè)畫面的整體感受并不是說不合理,只不過相對(duì)比而言,這種結(jié)構(gòu)形式很常見,版式結(jié)構(gòu)變化性不高,形式感和設(shè)計(jì)感也稍有欠缺,那么造成這種現(xiàn)象的原因是什么呢?
頂部 logo 區(qū)域因采用了色塊疊壓的手法且故意將 logo 處的色塊放大,使其超出導(dǎo)航欄的固定范圍,在視覺感受本身來說就已經(jīng)形成了很強(qiáng)烈的形式感,打破了原本色塊區(qū)域分明的布局,因此,版式的跳躍性也更加強(qiáng)烈。
時(shí)間說明區(qū)域?qū)⒃旧舷玛P(guān)系的色塊劃分通過疊壓的手法將其改變?yōu)榍昂箨P(guān)系,且合理將海報(bào)、時(shí)間說明,以及下半部分三個(gè)不同模塊連接為一個(gè)整體,在提升版式活躍度的同時(shí)也增強(qiáng)了視覺的整體性。
色塊疊壓的形式在很多優(yōu)秀作品中也是很常見的,這種手法對(duì)于版式結(jié)構(gòu)的重組、改變也是最直觀的一種。比如:
通過色塊之間的相互疊壓,形成了打破常規(guī)的效果,使得頁面版式的跳躍性更強(qiáng)。
第二類是色塊與主體的疊壓方式,通過色塊與主體物或者產(chǎn)品之間的相互疊壓作用,營造出非常規(guī)的設(shè)計(jì)形式,從而提升版式整體的靈活度以及設(shè)計(jì)感。舉個(gè)例子:
這里運(yùn)用的就是將主體物與色塊之間相互疊壓的手法,形成了一定的前后關(guān)系,而且這里主體處色塊最大作用還是打破常規(guī)的版面形式,目的是在視覺上給人以更加新穎、更具形式感的感受,且雖然做了結(jié)構(gòu)上的改變,但并沒有影響到主體信息的傳達(dá)。切記,不能一味地追求非常規(guī)而忽略了設(shè)計(jì)本質(zhì)問題,一定要合理運(yùn)用。
當(dāng)作品版式不夠活躍的時(shí)候,我們可以嘗試刻意改變某處的局部信息,將其放大,提升視覺變化的對(duì)比性,因?yàn)榉糯蟮脑仄浔旧砭途哂泻軓?qiáng)烈的視覺沖擊力以及裝飾性,比如大號(hào)字體、數(shù)字、圖形等等,所以局部放大的手法在頁面版式設(shè)計(jì)中也是很常用的一種表達(dá)形式。比如:
將主體的某一處細(xì)節(jié)或者某一局部放大處理,與原本偏常規(guī)布局形成了鮮明的對(duì)比關(guān)系,對(duì)頁面整體而言也起到了很好的打破版式關(guān)系的作用。試想一下:當(dāng)用戶前面一直在瀏覽比較常規(guī)的布局結(jié)構(gòu)時(shí),突然有 1-2 處這樣非常規(guī)的處理模塊,會(huì)很大程度上提升頁面對(duì)于用戶視覺的沖擊力,給用戶留下更深刻的印象,同時(shí)也使得作品整體的版面結(jié)構(gòu)更加富有跳躍性。
還有另外一種局部放大形式,即在放大的基礎(chǔ)上故意按照非常規(guī)的形式擺放,往往也能起到很好的打破版面布局的作用,只不過這種形式在使用時(shí)相對(duì)不好把握。比如:
類似案例中所展示的一樣,通過產(chǎn)品非常規(guī)的局部放大以及擺放形式,畫面給人的感受更加大氣,視覺沖擊力更強(qiáng)烈,同時(shí)版式的跳躍性也更強(qiáng)。只不過這種形式在運(yùn)用時(shí)要注意:頁面整體中最多出現(xiàn) 1-2 次即可,用于活躍版式、提升設(shè)計(jì)感,一旦出現(xiàn)次數(shù)過多,很容易形成雜亂的現(xiàn)象,之所以叫做非常規(guī)是因?yàn)橛谐R?guī)方式加以襯托、輔助,所以才會(huì)在視覺上形成反差。
既然是為了提升版面的活躍度,那么版面中所有的元素都可以是嘗試改變的元素,比如常用到的按鈕,再或者線條等等。使用非常規(guī)的形狀、圖形也是方式之一,比如最簡單的:
說到矩形,很多人都會(huì)想到常規(guī)形式,而也有一部分設(shè)計(jì)師會(huì)聯(lián)想到非常規(guī)形式 1,少數(shù)人會(huì)想到 2 和 3 的形式,這四類并沒有設(shè)計(jì)上的好壞之分,而是當(dāng)我們習(xí)慣了常規(guī)形式的色塊之后,也可以嘗試一下其他形式,也是會(huì)有意想不到的效果。比如非常規(guī)形式 2 的運(yùn)用:
相比平時(shí)看到的矩形排列方式,這一作品則給人很新穎的感覺,原本平面的作品,因?yàn)樯珘K形狀的改變使得整體有了很強(qiáng)烈的縱深感,版面的跳躍性很強(qiáng)烈,這樣的版式還會(huì)有人說死板、常規(guī)嗎?
非常規(guī)形狀 3 的使用可以參考下面這個(gè)案例:
在原本頁面中完全統(tǒng)一的形狀圖形中變換其中一處的形式,對(duì)于頁面整體跳躍性的提升還是一目了然的,原因在于:此處矩形的形態(tài)就屬于非常規(guī)類型,本身就具有一定的跳躍性、設(shè)計(jì)感,而用在此頁面中又與上下形成了一定的反差對(duì)比,所以使得版面整體更加活躍。
還有很多非常規(guī)的形狀,同樣也可以嘗試,比如:
想要版面看起來不古板,就要在頁面中的每一個(gè)視覺元素上找突破。版式聽起來好像一個(gè)很大的整體一樣,其實(shí)一樣可以拋開整體,把每一個(gè)局部作為突破點(diǎn),尋找合適的視覺表達(dá)形式。當(dāng)某一種形式已經(jīng)讓大家所熟知甚至成為常識(shí)的時(shí)候,我們不妨稍作改變,在不影響辨識(shí)度以及視覺傳達(dá)的基礎(chǔ)上,做一些形式上的調(diào)整,往往可以給予版式更強(qiáng)烈的跳躍性以及設(shè)計(jì)感。
04#總結(jié)
版式就像配色一樣,很感性,沒有完全一成不變的理論。當(dāng)我們想要提升版面整體跳躍性的時(shí)候,我們不妨試試以上方法,也許小小的改變對(duì)于整體而言就是完全不同的兩種感受。當(dāng)然,也不能盲目地追求形式感、特殊性。要切記:特殊是通過對(duì)比體現(xiàn)出來的,沒有對(duì)比,就無法形成很好的視覺反差,同時(shí)也起不到應(yīng)有的作用。還是要提醒大家,一個(gè)整體非常規(guī)的手法用在 1-2 處即可,太多的話是很難把握的。
作者的微信公眾號(hào):「美工美邦」
全部評(píng)論