當前位置:
首頁 > 最新 > 如何做好排版設計?格式塔原理?視覺補齊?

如何做好排版設計?格式塔原理?視覺補齊?

封面設計:Luca D Urbino

在日常生活中,大家肯定會看到非常多令人不舒服的排版。它們的畫面混亂不堪、零散,甚至沒有任何信息層級。以至於用戶無法在短時間內,迅速的從中get到主要信息。並且給用戶傳達了不舒適的視覺感受。

沒有人喜歡這種混亂的排版。即使你沒意識到,你的身體也會本能反應,不想多看它一眼。

身為設計師所需要知道的是:為什麼這樣的畫面處理會大大降低用戶體驗?原因是上圖畫面中沒有一個整體感與和諧感。在《設計師要懂的心理學》第四章第一節中提到:「人腦一次只能有意識的處理少量信息。」而許多新手最常犯的錯誤就是一次性把過多的消息傳達給用戶,比如上面的例子。這也就是為什麼很多網頁或者移動端界面的首頁,都是只簡短的列出各項功能的簡介與圖片,用戶進一步操作點擊後才能查看完整內容。

GIF/3K

GIF/2K

第四章第九節還提到人天生愛分類,如果你仔細觀察各種海報和網頁、甚至於說明書,你會發現很多信息都是按照功能或者其他共性分類有序放在一起,這樣用戶會更好更快的處理信息。

所以身為設計師處理組織信息的能力是非常重要的。

而我們今天所要討論的格式塔知覺原理,就可以幫助設計師將畫面中混亂的信息或者圖形整理清楚。

觀念

格式塔理論和研究述及了這樣一個觀念,即人們的審美觀對整體與和諧具有一種基本的要求。簡單地說,視覺形象首先是作為統一的整體被認知的,而後才以部分的形式被認知,也就是說,我們先「看見」一個構圖的整體,然後才「看見」組成這一構圖整體的各個部分。

本段文字摘自百度文庫 《格式塔原理及應用》

人腦會將複雜的內容簡化為容易理解的整體形狀,用圖形表示就是這樣:

接下來我們來說說平面設計中最重要的四個格式塔知覺原理。

一、接近律

說到接近律大家可能並不陌生,和我們在設計理論中反覆提及的四大原則中的親密性是一個道理。距離相近的物體是作為一個整體被看待的,這點我們在許多平面作品中都可以發現,互相關聯的元素位置總是很接近的。這樣更方便用戶快速在腦內整理並且提取信息。用戶體驗自然而然地就提高了。

實例分析

之前在微博上看過一個小吃店的菜單,找不到圖片了不過大概是這樣的排列。

看了半天看不懂賣的是啥,因為按照接近律我們會從上往下閱讀,但是這樣的組合讓我們摸不著頭腦。

如果改成這樣呢?所有漢字擠在一起,從哪開始讀也要找半天。

如果這樣,相關聯的文字靠近,閱讀起來就輕鬆多了。

還有最典型的就是信息繁多的網頁、移動端頁面與信息圖。

不同類型的信息都被各自安放在一個隱形的框里,便於用戶區分閱讀。從而更容易提取信息。

二、連續律

沿著某一平直或曲折的線排列的元素比那些不在同一條線上的元素看起來更整齊。四大原則中的對齊也是這麼一個道理。

各種網頁不管是首頁還是登陸頁抑或是其他頁面,所有的文字都嚴格的左對齊、右對齊或者居中對齊。這樣使整個頁面更加整齊沒有視覺負擔。易讀性與用戶體驗隨之提高。

很多攝影師也會運用這一原則。

當然適當的打破一點原則也可以突出主題讓人眼前一亮。

來自Maria Svarbova

三、完整律

不知道你們是否聽說過視覺補齊,即就算你看到的是缺失的字母或者漢字但大腦會幫你自動補齊缺失部分,並且辨識。

即使字母被遮擋,我們也能讀懂意思。同時也給畫面增添了層次感。

完整率其實和它有異曲同工之妙。

在這張圖中你看到了什麼?是不是一個三角形?或者三個圓形?其實三角形和圓形並不存在。但是我們下意識的會去想像會去補齊。

正負形就是這麼一個道理。很多形狀其實是不存在的。

四、相似律

相似的形狀、大小、或者顏色通常會被看做一個整體。顏色尤為明顯。

系列產品包裝通常會設計成一樣的形式,也是運用了這一原則讓整體性更加強。

最後

其實看了一些設計理論類書籍發現許多書理論都是相通的,所謂換湯不換藥。重要的是我們如何靈活地運用。那麼今天的閑扯就到這!趕緊把格式塔原理掌握好。

GIF/1K

喜歡這篇文章嗎?立刻分享出去讓更多人知道吧!

本站內容充實豐富,博大精深,小編精選每日熱門資訊,隨時更新,點擊「搶先收到最新資訊」瀏覽吧!


請您繼續閱讀更多來自 優秀網頁設計 的精彩文章:

男設計師和女設計師到底有什麼不同?

TAG:優秀網頁設計 |