萬盛學電腦網

 萬盛學電腦網 >> 網頁制作 >> 交互設計 >> 交互設計法則之接近法則與格式塔

交互設計法則之接近法則與格式塔

交互設計法則之接近法則與格式塔 三聯

 

  早在20世紀早期,一個由德國心理學家組成的研究小組試圖解釋人類視覺的工作原理。他們觀察了許多重要的視覺現象並編訂了目錄。格式塔理論明確地提出:眼腦作用是一個不斷組織、簡化、統一的過程,正是通過這一過程,才產生出易於理解、協調的整體。我們的視覺系統自動對視覺輸入構建結構,並且在神經系統層面上感知形狀,圖形和物體,而不是只看到互不相連的邊,線和區域。“形狀”和“圖形”在德語中是“Gestalt”,因此這些理論也被稱為視覺感知的格式塔(Gestalt)原理。

  接近法則是格式塔理論中最為我們所熟知的,也是我們最常用到的一項法則。說的是物體之間的相對距離會影響我們感知它們是否以及如何在一起。相對於其它物體來說,彼此之間靠近的物體看起來屬於一組。越接近,組合在一起的可能性就越大,強調的是位置。如下圖(圖1),我們在意識中會將其分為兩組。

 

  圖1

  接近原則被廣泛應用於頁面內容的組織,以及分組設計中。對於引導用戶的視覺流及方便用戶對界面的解讀起到非常重要的作用,通過接近原則對同類內容進行分組,同時留下間距,會給用戶的視覺以秩序和合理的休憩。 設計者們經常使用分組框或分割線將屏幕上的控件和數據顯示分隔開,如圖2、圖3。

 

  圖2

 

  圖3

  除了接近法則之外,還有很多重要的原則你知道嗎?接下來我將逐一向大家介紹。

  相似原則:

  相似,聽起來跟接近非常類似,但是他們確實是不同的兩個概念。接近強調位置,而相似則強調內容。人們通常把那些明顯具有共同特性(如形狀、大小、顏色等)的事物組合在一起,即相似的部分在知覺中會形成若干組。在圖4中,我們會將黑帽子蛋和紅帽子蛋自然的分成兩組。

 

  圖4

  在頁面設計中分類使用文本、顏色、圖像等,可以更好的區分各個模塊和內容。如下圖(圖5)中雅虎讀書導航,通過相似原則我們很容易的將一級導航和二級導航區分開來。

 

  圖5

  換一個角度來思考,顏色的變化很清楚的區分了不同的內容,相似中的逆向思維是獲取焦點的好方法。這種方法在導航和強調部分信息的設計上有著廣泛地應用,如圖6。

 

  圖6

  封閉原則:

  當元素不完整或者不存在的時候,依然可以被人們所識別。根據過去以往的經驗和視知覺的整體意願驅使,我們習慣性的將圖形作為一個整體去觀看,於是我們在腦袋裡將缺少的形狀補充進去之後,便形成最終我們識別出來的圖形效果。如下圖(圖7),沒有三角形和圓,但是在我們心理模型中填充缺失的信息,創建我們熟知的形狀和圖形。

 

  圖7

  封閉原則常被應用於圖形界面和頁面設計中,例如:在頁面中經常會用堆疊的形式表示對象的集合,只要顯示一個完整的對象和其“背後”對象的一角就足以讓用戶感知到這是由一疊對象構成的整體,如圖8所示。

 

  圖8

  連續原則:

  與封閉性相關的是連續原則,連續原則說的是我們的視覺傾向於感知連續的形式而不是零散的碎片。在圖形設計中,使用了連續原則的一個最廣為人知的例子就是IBM的標志。它由非連續性的藍色塊組成,但一點也不含糊,我們很容易就能識別出三個粗體字母,就像透過百葉窗看到的效果一樣,見圖9。

 

  圖9

  關於格式塔的原則還有很多,而且可以復合使用。在我們設計了一個東西之後,可以試著使用格式塔原理來考量一下自己各個設計元素之間的關系是否復合設計的初衷。希望通過對格式塔原始理論的介紹可以給大家帶來一些啟發:

 

copyright © 萬盛學電腦網 all rights reserved