Going Gradient：這種設計趨勢如何從死裡復活

每年年初，都會出現一些可預測的趨勢，這些趨勢會影響未來幾個月的設計進程。 有一些出乎意料的趨勢，但它們的標記都是一樣的。 還有一些設計趨勢不知從何而來，而且幾乎沒有解釋。 梯度將歸入後一類。

當設計師瘋狂地愛上扁平化設計時，漸變是他們推到一邊的設計技術之一。 雖然那個啞光時代仍然存在，但可以肯定地說漸變正在捲土重來！ 去年早些時候，漸變設計似乎幾乎在一夜之間激發了變化。 從背景到疊加再到 UI 元素中的細微紋理，漸變都呈上升趨勢。

最初的漸變趨勢始於 web 2.0，但從那時起情況發生了很大變化。 現代漸變可以完全使用 CSS3 設計，這使得將它們集成到按鈕、背景甚至排版中變得更加容易（我們將在後面討論的另一個快速發展的趨勢）。

設計師如何使用漸變

與往常一樣，沒有比查看當前設計師和公司現在如何利用它們更好的方式來解釋和展示設計趨勢。 我們瀏覽了我們的檔案（和網絡）以找到一些現代設計中漸變的有力例子。 此外，我們還將了解公司轉變其技術和風格以融入這種不斷增長的趨勢的多種方式。

平面顏色漸變

正如我所提到的，在扁平化設計時代，漸變幾乎從地球表面消失了，但具有諷刺意味的是，它們重返行業充滿了扁平化設計和顏色的例子。 此外，大膽的漸變顏色示例通常直接受到平面設計調色板的啟發。 這種向平面顏色漸變轉變的結果是一種越來越現代的感覺，可以很容易地與美學平面設計相結合。 看到這些漸變添加到 Material Design 界面或作為最小項目的一部分也很常見。

平坦的顏色漸變也是對其他趨勢的一個很好的補充，如果您的網站正在經歷重新設計並且您不想完全改變您目前擁有的內容，這會讓它變得更容易。 網球職業選手 Marion Bartoli 與 Fila 合作的 2016 年春季運動服裝系列將微妙、平坦的漸變色融入大膽的背景色中，營造出一種高級時尚感。

背景圖像中的漸變

除了漸變，您會注意到深度增加的背景也在回歸。 看到這種情況繼續下去也就不足為奇了，越來越多的設計師試圖將逼真的 3D 元素融入到他們的設計中（提示、提示、虛擬現實）。

現實主義是平面設計歷史上所缺乏的，當您考慮自然界中的真實場景（例如，天空）時，您通常會看到顏色的漸變而不是一種顏色的塊。 加上陰影，漸變增加了平面設計無法實現的深度水平。

帶有漸變的圖像疊加

一段時間以來，它們一直是一種流行的選擇，但近年來，帶有顏色疊加層的圖像已經從單色疊加層轉變為更加基於漸變的疊加層。 這是一個很好的效果，適用於大圖像，尤其是英雄橫幅或標題。 當目的是讓用戶專注於某些設計元素或創建有效的號召性用語 (CTA) 時，這種技術也非常有效。 數字機構 Interactive Sites 在他們自己的設計中利用圖像疊加漸變來展示他們的能力。

應該說，在圖像和顏色之間建立平衡很重要——如果沒有達到這種平衡，那麼最終會犧牲疊加的有效性。 您可能會發現自己在問一些問題，例如：色調是否與圖像的含義一致？ 是否有可能清楚地看到和理解圖像中發生的事情？ 設計的棘手方面是以保持整體信息和圖像完整性的方式組合這些元素。

UI 元素的漸變

考慮漸變在用戶界面元素中的作用很有趣。 雖然它肯定不像一些已經提到的漸變樣式那麼受歡迎，但肯定有設計師引入微妙漸變的趨勢。 事實上，UI 元素中的單色漸變在 iOS 和 iPhone 的早期是一個反復出現的功能，但後來失寵了。

但是，對於較大的元素，漸變的使用效果最好。 在較小的元素中，漸變可能很難看到，並且可能會分散或扭曲用戶的視線。 但是當在更大的空間中使用時，漸變可以幫助用戶專注於特定的號召性用語。 舉個例子：Baldor Foods，它使用漸變來展示特色產品並很容易吸引遊客。

考慮到這一點，我們應該提醒自己，用戶不應該真正停下來看著漸變設計並認為“這是一個很棒的漸變”。 相反，他們幾乎應該錯過漸變，因為它們只是為了增強用戶體驗。

徽標和排版中的漸變

設計師現在可以為圖標、徽標和排版添加自定義漸變，從而產生一些有趣的設計。 設計師可以通過多種方式使用它來達到很好的效果。

例如，嘗試使用固定的顏色漸變，當您向下滾動網頁時，它會轉移到徽標上（這也是非常高級的設計細節！）。 然而，漸變也可以以更傳統的方式用於在純背景上純粹製作排版或徽標彈出，就像設計師皮埃爾喬治的個人作品集排版（如上所示）。

雖然在排版和設計的背景下漸變元素仍處於相當早期的階段，但它們有能力在未來幾年蓬勃發展。 為字母和徽標添加漸變可能會變得更加容易，從而為設計師創建一個易於訪問的功能，以便每次都能快速改進他們的創作並提升用戶在網站設計中的體驗。

今年你會在你的設計中使用漸變嗎？ 下面告訴我們怎麼做！