版式設(shè)計四大原則-【方法論之“視覺設(shè)計”篇】
在視覺傳達中,版式設(shè)計四大原則一直貫穿于我們的工作中。本文詳細闡述了這四大原則,希望能夠幫助你應(yīng)用于視覺設(shè)計中。
為了在別人吹牛逼的時候保持清醒,從2018年開始我整理了100多條互聯(lián)網(wǎng)設(shè)計方法論。
這些方法論里,我發(fā)現(xiàn)有的借鑒的是工業(yè)設(shè)計,有的是建筑學(xué)、心理學(xué)的,還有傳播學(xué),甚至連語義學(xué)都出現(xiàn)了……
然后就想,怎么這么多互聯(lián)網(wǎng)設(shè)計方法論?每個方法論如何應(yīng)用?哪些又是瞎扯模型?
把這些分享出來希望能幫到更多的人!
我把這些方法論總結(jié)成了六大類:
版式設(shè)計四大原則(對比、親密、對齊、重復(fù))是視覺傳達中,最基礎(chǔ)也是最重要的設(shè)計原則,它一直貫穿于我們的設(shè)計工作,但又經(jīng)常被忽視。
當(dāng)我們在設(shè)計提升階段中遇到瓶頸的時候,不妨好好回顧一下夯實一下版式基礎(chǔ),基礎(chǔ)決定我們走多遠。
視覺傳達其本質(zhì)也是表達方式的一種,我們需要通過設(shè)計方法手段,通過將元素建立聯(lián)系有目的得引導(dǎo)用戶視覺流向,將信息在“最短時間”內(nèi)“快速”傳達給用戶。
任何元素都不能在頁面上隨意擺放,每個元素應(yīng)當(dāng)與頁面上另一個元素有某種視覺聯(lián)系,這樣才能建立一種清晰且輕巧的閱讀邏輯。
所以,我們的設(shè)計行為,是否讓信息更快速、更直接、更有效得傳達給用戶了?
對比
無對比,不設(shè)計。(沒有對比就沒有設(shè)計可言)
合理劃分好信息層級,來引導(dǎo)用戶視覺流向。
親密
在版式設(shè)計中,親密和對比是相輔相成的。
彼此相關(guān)的元素應(yīng)當(dāng)靠近,歸組在一起,為讀者提供清晰的閱讀架構(gòu)。
對齊
對齊對比無處不在,對齊是設(shè)計的標(biāo)配。
我們在做設(shè)計的過程中,腦海中已經(jīng)養(yǎng)成習(xí)慣得提醒自己“對齊對齊對齊對齊!”
重復(fù)
設(shè)計的某些元素或手法需要在整個作品中重復(fù)。降低了用戶的適應(yīng)成本,其本質(zhì)還是讓信息傳遞更快速有效。
一、對比
無對比,不設(shè)計。(沒有對比就沒有設(shè)計可言)
對比的目的:
- 使有層級、有主次、有節(jié)奏、有設(shè)計感
- 使閱讀方便
- 突出重點;強化要點;表達核心信息
做好對比的前提是我們透徹得理解了業(yè)務(wù)和將要呈現(xiàn)的內(nèi)容。有目的得將元素拉開對比,合理劃分好信息層級,來引導(dǎo)用戶視覺流向,第一視覺、第二視覺、第三視覺…之后讓用戶視線最終又落在哪里。
對比的手法:
形態(tài):方vs圓、長vs短、粗vs細、大vs小、高vs矮、胖vs瘦、凹vs凸;
狀態(tài):動vs靜、虛vs實、近vs遠;
色彩:黑vs白、明vs暗、炫彩vs單色、輕vs重色;
二、親密
在版式設(shè)計中,親密和對比是相輔相成的。
親密的目的:
- 使元素間有關(guān)系成為一個家族,使有關(guān)聯(lián)
- 合理分組
彼此相關(guān)的元素應(yīng)當(dāng)靠近,歸組在一起,如果多個項相互之間存在很近的親密性,它們就會成為一個視覺單元,而不是多個孤立的設(shè)計單元,這有助于組織信息減少混亂,為讀者提供清晰的閱讀架構(gòu)。
親密的手法:
親密即編組,將相關(guān)聯(lián)的信息進行編組區(qū)分,關(guān)聯(lián)的元素組織在一起,移動元素,使它們的物理位置相互靠近,使其形成閱讀秩序。使之成為整體的一個組,而不再是一堆彼此無關(guān)的片段。物理位置靠近的,就意味著存在關(guān)聯(lián)。(我們可以把它理解為元素間的父子關(guān)系)
文字與文字、文字與圖、圖與圖間通過物理距離,控制元素之間的關(guān)系。除了物理距離劃分,也可以用線條色塊切割。
三、對齊
對齊對比無處不在,對齊是設(shè)計的標(biāo)配。
我們在做設(shè)計的過程中,腦海中已經(jīng)養(yǎng)成習(xí)慣得提醒自己“對齊對齊對齊對齊!”如果你還沒有養(yǎng)成習(xí)慣,那就逼著自己有目的得時刻提醒自己。
對齊的目的:
- 對齊讓設(shè)計變得更有條理
- 對齊讓設(shè)計變得更有邏輯
- 對齊讓閱讀變得更輕松
對齊的手法:
對齊分為,左右對齊、上下對齊、居中對齊
- 右對齊——最常見的對齊方式
- 左對齊——最裝逼的對齊方式
- 居中對齊——最無能的對齊方式
- 右對齊不一定非要放右邊
四、重復(fù)
設(shè)計的某些元素或手法需要在整個作品中重復(fù)。其本質(zhì)還是讓信息傳遞更快速有效。
重復(fù)的目的:
- 重復(fù)的作用:統(tǒng)一信息、強調(diào)信息、強化信息
- 重復(fù)就是保持設(shè)計的一致性
- 重復(fù)縮短了我們二次閱讀的時間(比如在商品詳情介紹中,如果沒有運用重復(fù)原則版式不一致的話,用戶在閱讀過程中,需要時間適應(yīng)、習(xí)慣新的版式)
重復(fù)的手法:
- 標(biāo)題的字體
- 符號
- 圖片的主色調(diào)
- 版面的留白比例
- 標(biāo)題與內(nèi)文的距離
- 內(nèi)文大小統(tǒng)一
本文由 @胡冰茜 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)作者許可,禁止轉(zhuǎn)載。
題圖來自Unsplash,基于CC0協(xié)議。
該文觀點僅代表作者本人,人人都是產(chǎn)品經(jīng)理平臺僅提供信息存儲空間服務(wù)。
- 目前還沒評論,等你發(fā)揮!