格式塔心理學揭示:視覺系統自動構建結構,感知整體而非離散碎片。七大核心原理指導頁面佈局,讓信息分組、層級、流向符合直覺。
相近物體自動歸組。財經網站索引模塊,按列分組卻以行排列導致視覺衝突;調整為行分組與視覺一致,查找更直觀。兩組相同設計元素,拉大間距即清晰劃分兩組。



外形相同的同心圓自動成組。模塊外形一致,首個顏色區分即區隔功能;內容差異化同理。註冊頁當前執行區特殊填充色脫離同組,引導視線焦點。對齊方式不同導致視覺解析錯位(左側字成列 vs 右側輸入框成列)。





相交線被感知為兩條連續線而非四段;離散藍線組合成 IBM 三字母。活動頁大膽切角主視覺,視覺自動腦補完整,增強衝擊力與延展感。


空白區被解析為圓形。同形狀疊加構建豐滿場景擬真效果。


傾向解析為簡單對稱組合。專題頁疊加幾何面營造立體舞美感;按鈕疊加陰影/高光解決「不像按鈕」質疑。


重疊時小者為主體。主要內容後置印象背景傳遞主題;彈層信息成新主體,保留環境脈絡助用戶定位。



同向運動元素自動歸組。同功能按鈕 Hover 效果一致;拖動資料夾時同選項共同反白移動。


現實中原理交織共現,需逐一檢視元素關係是否符合設計初衷,在常識層面零失誤。