漸變,設計師在平面設計時代開始時所摒棄的技術之一目前好像成了一個大勢正在卷土重來。幾乎一夜之間,漸變出現在網站設計之中,并且好像無處不在。
從背景到圖像疊加到用戶界面元素上的細微紋理,漸變效果以絕對的優勢和視覺體驗重新回到了時下流行網頁設計趨勢的“時尚指南”。不過,跟之前比較,這一次有點不同。這里,你需要知道幾點過于漸變的使用規則當你決定在你的網站建設項目中使用它之前(和大量的例子來激發你的創造力)。
1.潮流引領者
Spotify今年早些時候帶來雙色調色彩的主流趨勢,雙色疊加幾乎成為品牌的視覺符號。如果你仔細看看,Spotify使用雙色調具有獨特的漸變效果,平衡當下流行的,明亮的顏色或使用一個單一的明亮色調,將其逐漸淡化為較低的亮度或偏暗來來達到漸變的效果。
其他大品牌將漸變效果加入到它們展現信息的表現形式中。Texture,在線雜志提供商,正在使用全屏漸變的方式來提升它們網頁設計的整體視覺。
但這些并不是新式漸變的唯一例子。你可以從零售到組合設計中都能發現它們的存在。
對于如何使用漸變效果,目前還沒有任何明顯的規則。它們可能包括多種顏色,從中心或角落輻射,或水平下降。漸變可能是網站設計中的主要的視覺效果或者是一個簡單的功能。
不過值得高興和贊嘆的是,我們的設計師通過不同的方式將漸變的應用用的恰到好處。他們實際上看起來更合理以及符合視覺上的審美。
2.平面顏色漸變
雖然漸變在平面設計的時代被殘忍的拋棄了,但是它們的回歸卻結合了大量的平面元素,特別是顏色。一些最優秀,最大膽的顏色漸變的例子是直接從平面設計的調色板“借”的色調。
這些顏色選擇有助于使漸變具有與其他網站設計趨勢相融合的現代感覺。你可以將這種漸變風格與平面美學相結合,或者在材質設計界面中添加漸變,甚至在簡約風格的網頁設計項目的背景中嘗試“靜音”顏色組合。
關于漸變顏色選擇的好處在于,它真的是對其他設計趨勢的補充,如果你想采用一個全新的設計,但沒有準備完全改變你當前的設計審美,使用漸變是一個很容易的過渡。
3.雙色調加入“戰局”
雙色漸變是一個很大的概念,同時也存在一些問題。
雙色調概念的缺點是,目前它可能在被濫用,使用的過于頻繁切不出彩,會使這種本來能提高網站設計整體視覺的技術變成一種浪費。用相同的漸變圖案但使用不同的顏色來看看它們能碰出怎樣的火花,這個我們可能要活一整個學期才能真正掌握。
這是一個趨勢,但同時也是一個警告:使用你自己的漸變而不要只重復別人已經做過的事情。
4.漸變你的背景圖像
漸變的回歸同時也帶回了背景圖像的深度感。隨著虛擬現實,更多的網站設計者試圖將更多的現實主義和三維融入到網頁設計中,這中飯想法不會停止,可能會持續增長。
一覽無余的平坦審美雖然光滑而且相對容易,但主要缺點是缺乏現實的元素。只是想想自然,在任何給定的時間看著天空,你很可能會看到不一樣的顏色——藍色,紅色,黃色,紫色。
這與梯度和陰影背后的概念是一樣的。當做得好的時候,它們有助于在設計上增加一定程度的深度和現實(所以保持他們簡單和微妙,如果這是你要的效果)。
5.在圖像上使用漸變層
在圖像上使用顏色疊加層已經是受歡迎一段時間的設計選擇了,所以從單色疊層轉換到漸變疊加層并不奇怪。
這種效果對于大型圖像(例如主視覺圖和標題)來說是一個不錯的選擇,它可以幫助用戶將某些設計元素集中在一起,或創建一個可以更容易讀取的類型或調用操作的地方。
在圖像上的增加漸變梯度感的把戲是在圖像和顏色之間創造一個平衡。色調與圖像的意義相符嗎?你還能清楚地看到和理解圖像中發生了什么嗎?以保持圖像的完整性和整體消息的方式組合這些元素可能也是棘手的問題。
6.UI元素的細微漸變
雖然不像其他漸變樣式那樣受歡迎,但一些設計師正在將漸變添加到用戶界面元素中。這些漸變趨于更加微妙,單色。
這在早期的蘋果iOS / iPhone時代是一種主導風格,但在感覺上并不是很理想。
誠然,這種使用漸變的方式似乎對更大的元素比較有效。在較小的圖標空間中,漸變可能有點難以看到,甚至有點分散注意力。在大空間,它可以幫助吸引注意力和焦點。
與任何類型的漸變一樣,用戶不應該看到漸變并停止思考“哇,這是一個很酷的漸變”,它應該在一定程度上是看不見的。漸變只能增強用戶體驗,不要注意美學。
總結
我會第一個承認,當漸變被時尚排除的時候,我很傷心。所以我很高興看到這個趨勢回歸,這個迭代是非常有趣的。
具有優秀顏色的漸變和增加用戶對圖像興趣的方法是使它具有幾乎永恒的元素。簡單的復雜性是有吸引力和有趣的。所以感謝所有的設計師們將此技術推回主流。