非對稱的設計是我們在工作中經常遇到的重要概念之一，這種方法有趣而又耐人尋味，十分的吸引人。

這種方法使用起來可能是非常的棘手，這也是為什么有些設計師不選擇非對稱設計的原因，不過我們其實大可不必規避，因為非對稱的設計，每個設計師都是可以做到的，只是需要多花些時間認真規劃。

在開始之初，最先需要考慮的是結構和設計項目中對于對稱和非對稱的匹配關系的概念意識，如果打破常規的設計模式，并且分解成更小的設計組成部分，那么這里面就會包含各種不同類型的平衡關系。（想想有視差滾動的網站或在設計面板中的畫布區域的圖像）

想想為什么我們正在使用的這種非對稱比較好？如果明確知道自己想要的視覺效果，將有助于確定如何通過技術手段來實現這種效果。另外非對稱性設計是非常吸引用戶注意力的，盡管有些不平衡，但是我們可以通過一些簡單的手段使得更加自然。不過要說明的是，在畫布上的東西應該相信自己直覺的，但是要確定是：看起來真的好，還只是一種自己的感覺。

在兩者之間神奇的實現一種平衡，良好的非對稱設計中是包括平衡的，使用這種設計方式會導致整體感有失平衡，這個時候就需要通過在一定的空間里面使用補償元素，創造和運動的中心點，了解元素之間的視覺重量，加入焦點顏色和視覺引導線以及通過一些網格來創建這種平衡。

使用空間

非對稱的設計是極簡主義設計未來的一個趨勢。使用這么大的空間設計，很容易平衡簡單的對象元素或圖像，特別是對于一個較大的白色或黑色背景。在設計中的留白和使用負空間，來保持元素之間的平衡事，應該使用足夠的對比度。這將直接穿過用戶的視線而達到設計的目的。

例如上面的網站“Ike Kligerman Barkley”，就采用對角線的平衡關系使得用戶在圖像和左上角的導航欄之間形成平衡關系，這種方式比較大膽，但是正是這種極簡風格，導致用戶很希望點擊左上角的菜單欄以及相關鏈接。

強調運動

想象一下一個輪胎滾向山腳下，我們的腦海中立馬就很形象的浮現這樣的場景。因此，當我們在設計一種非對稱設計時，也要考慮到其一定的運動規律。

1、視線會習慣性的對屏幕的左上角開始，并且橫向移動的區域較大。

2、視線會遵循一定的方向提示，例如我們使用箭頭來指向特定的方向，就會明顯感覺到。

3、視線會隨著屏幕中圖片的內容指向，而保持一致性及指向同一個方向。

4、由于視線是從左到右的順序，所以要想改變這種瀏覽模式就必須要有一個更加強有力的方向指向來指向另一個方向。

例如“Leen Heyne Fine Jewelry”就是使用運動來吸引眼球到特定的產品上。而幾何的形狀是將視線指向正確的方向，同時創造一種感覺：手環和戒指在屏幕上有很自然的滾動趨勢，而這種方向行的指示又會影響到其他的元素以及指向下一步，例如導航欄和移動到下一頁的箭頭。

添加焦點顏色

對于非對稱的彩色圖案，通常是對比度和色彩上都有較高的飽和度和明度。想象一下黑色的背景上或是頂部有大量的白色，然后涂抹上一個色調鮮明的顏色。高對比度的色彩將會用來作為聚焦和視覺重量平衡的一個重要組成部分。

非對稱的色彩組合，可以使用色輪來創建。選擇的色彩一定要落在傳統的非對稱的彩色模式之上，想想看，有顏色就會產生影響，此時使用顏色來強調和突出非對稱的輪廓以及其他元素，所以顏色也可以是非常好的設計元素，例如幾何形狀、排版以及作為下一步的聯絡節點，從而使得整體達到平衡背景的作用。

例如“HLK Agency”利用白色的文字并采取幾乎對稱的排版，讓我們再看看下面藍色的下劃線和按鈕，此時就產生了一個簡單的焦點以及變成非對稱，并于頂部的漢堡式菜單和logo相對應。

網格的使用

盡管有時候我們不會使用網格，但是這仍然是設計中很重要的一部分。使用網格來創建非對稱性的設計，將會幫助我們實現元素組織之間的平衡關系。

當我們考慮到在網格上的每個元素時，就會一同考慮相關元素與之形成的關系。設計時就會明白他們以一定的水平或垂直的方向上存在著，就可能會感知到在畫布中兩者之間的視覺重量是否有相互抵消：從左到右，從上到下。

想一想當我們在網格的一端添加元素的時候就會在與之相對應的地方添加一個元素，與之相互抵消。而要建立很明顯的非對稱設計，那就考慮使用奇數列的網格，或者是在網格中一側是另一側視覺重量的一倍。

例如“BrightByte Studio”就是采用這種垂直的模式來保持一致，并且使對稱元素和非對稱元素之間相互混合。（我們看到網站上第一眼是左邊兩行左對齊的文字，這種對齊是創建元素之間平衡關系的基礎，另外我們還會注意到頂部的logo和底部的導航欄也是與之左對齊的，整體上符合視線運動規律。）

創建重量

非對稱設計的存在根本在于“重量”，因為我們首先會被“較重”的元素吸引。我們可以確定的是圖片本身就帶有一定的視覺重量。它可以是真實的圖片，也可能是空白等。

通過一個焦點元素來平衡并突出較重的元素，而實現這種效果可以是多種多樣的方式。當使用上面提到的方法之后，可以采用加權的方式判斷哪種情況下效果最好，并進一步加強這種效果。

例如“Cranes of Cambridge”就使用了一個引人入勝的照片作為設計“權重”，另外是兩個我們第一眼不會注意的兩種元素：較輕的文字和圖案相比于照片顯然輕很多。另外我們可以從照片中人物的視線中看向右邊文字（眼睛也是一種指示方向的隱含運動），而且導航欄也使用垂直的方式布局，幫助我們更快速回到屏幕內容區域。

結論

非對稱可以是一種完美又和諧的設計科學，雖然近幾年的發展趨勢主要集中在大量的對稱設計上，但是在不久之后相信還是會有很多的非對稱中平衡設計的出現，因為它們在視覺上更加引人入勝的，并通過一些精妙的設計結構與用戶直接進行溝通。

作者：Carrie Cousins

http://designshack.net/articles/layouts/asymmetrical-design-creating-beautiful-balanced-layouts/