2023年6個用戶體驗設計師應了解的視覺設計原則

個用戶體驗設計師應了解的視覺設計原則當我在高校學習視覺傳達設計時，我著迷于設計師讓人們以某種方式思索，感受和行動的力氣。

在作為產品和UX設計師關心產品擴展到數以百萬計的用戶并實現收入的十年之后，我仍舊使用在我頭幾年學到的很多基本課程-檢查外形，布局，并思索形式如何影響使用我的產品的人們。

我們都聽過的VI的小號UAL設計元素狀，線等，我們已經有一個像對比，重點，節(jié)奏等打成了我們頭上的原則。

我將共享一些微妙的學問，而不是像我作為平面設計師所學的訓練那樣常常提到的原則，但直到今日我仍舊會使用；稱它們?yōu)楦呒?，稱其為鮮為人知，但我盼望通過共享它們，可以提升整個設計社區(qū)的水平！

一、原則

1.重力

重力適用于對象和外形，即使在視覺傳達中也是如此；這聽起來可能很驚奇-重力并不像現實生活中那樣是一種真正的力氣將二維物體向下拉。

但是引力深深地扎根于我們對現實的感知之中，以至于它甚至可以轉換為頁面上的二維物體；以下面的圖片為例，似乎您正在等待頂部的圓環(huán)隨時掉落一樣，應當會感到有點不舒適。

現在看下面的這張圖片-相反。

這種構圖應當不像要掉落的球，而更像是一個物體只是停留在頁面底部，接地、安靜的。

當您設計頂部的視覺重物可能會感到不舒適并感到焦慮時，要有意識和認知（當然，除非您要傳達這種感覺）。

2.閱讀方向

在西方社會（反之則相反），我們從左到右，從上到下閱讀；由于這，左側的對象被視為進入，而右側的對象被視為離開。

這是左邊的圓圈，同樣，由于我們從左到右閱讀，所以圓感覺就像它進入了合成；在下面，圓圈感覺像是在退出。

您也可以使用它來傳達某些心情，例如，想讓一個物體看起來像在偷窺嗎？您可以創(chuàng)建如下所示的構圖：

或者相反，想要傳達一個逃跑的對象（或角色）嗎？

3.閱讀優(yōu)先

由于我們從左到右從上到下閱讀，所以我們自然會先看到左上角的物體，然后我們的眼睛自然會移到右下角，然后再看那里的東西。

這很重要，由于假如您嘗試創(chuàng)建視覺層次結構（或許您盼望用戶先看到標題，然后再看到內容），即使它們的外形/顏色/大小相同，也可以使它們放置在其中有所不同。

請在以下示例中：

最有可能的是，假如您是從左上角到右下角閱讀英語書籍的，那么您首先應當在右下角之前先查看左上角的圓圈。

4.視覺張力

我曾經把這種描述描述為我的身體緊急感得到了轉化和增加，當您看到一桌裝滿液體的杯子坐在桌子邊緣時，就會有這種感覺。

通常，視覺張力只是無意識的-設計師沒有意識到他們不當心將外形彼此相鄰，從而在不知不覺中產生了張力，這可能會遇到馬虎。

看一下下面的圖片：

感到不舒適嗎？這是下面突出顯示的全部張力點。

假如您有意，可以使用視覺張力吸引用戶的眼睛并產生焦慮感；或許您正在設計用于抗議的海報，或者想將某人的留意力集中在某物上；在這些狀況下，請確保您的緊急心情是有意的，不會像看起來的錯誤那樣消逝。

這是相同的構圖，其中的張力集中在特定的位置，并且有意將其放在特定的位置。

5.動態(tài)與靜態(tài)

靜態(tài)成分常常會讓人感到無聊。給它添加香料并使它更令人興奮的一種簡潔方法是簡潔地傾斜地平線，這是一個感覺陳舊的靜態(tài)圖像的示例。

現在傾斜地平線，突然之間，城市景觀看起來更加令人興奮。

為了使構圖更加生動好玩，您可以接合邊框并讓外形在其外部流血。查看以下3點透視圖組成：

6.激活負空間

您可以使用方向性外形激活負空間一點，方向力太小，負空間保持不活動狀態(tài)；這是一種外形，可以引起您的留意，然后向上和向右移動眼睛。

問題是，當您到達頁面右上角時，您的留意力可能會消逝；您的眼睛移過對象，但那里的空間太大，而來自對象的方向力也太小，您的眼睛掉了下來，該空間保持不活動狀態(tài)。

但是，通過一些裁剪/縮放：

突然之間，外形四周的空間看起來既有意圖又活躍。帶走？假如您要移動別人的視線，請留意不活動的負空間。

一個簡潔的技巧就是用手指指向對象，沿眼睛自然移動的方向移動，并留意您的留意力自然下降的位置；假如那是您想要的方式，則需要調整布局（外形或邊框）以使該負空間保持活動狀態(tài)。

不要讓CSS，HTML或您使用的任何其他技術限制您