網(wǎng)站建設中漸變色設計重新回歸主流發(fā)布者：本站     時(shí)間：2022-03-17 15:03:55

在扁平化設計剛剛興起之時(shí)，漸變是設計師們避之不及的設計手法，然而今天它已經(jīng)正式回歸。幾乎是在一夜之間，無(wú)數的網(wǎng)站開(kāi)始使用漸變色。
 

從背景到圖片上的色彩疊加，包括UI元素上所遮蓋的色彩，所有的這一切都表明漸變以一種微妙的方式回歸了。不過(guò)和以往的我們所看到的漸變不同，重新回歸的漸變色設計有著(zhù)不一樣的使用技巧和特色，更加貼合這個(gè)時(shí)代的風(fēng)格和需求了。如果你也想使用，不妨從今天的設計示例中學(xué)習一下“全新”的漸變設計。
 

潮流的引領(lǐng)者

設計趨勢:漸變色設計重新回歸主流設計趨勢:漸變色設計重新回歸主流
在今年早些時(shí)候，Spotify 開(kāi)始在自家網(wǎng)站上大量使用雙色調設計，將雙色調的潮流帶了起來(lái)。如果你仔細查看Spotify 的頁(yè)面會(huì )發(fā)現，其中色彩其實(shí)是有明暗、色調的漸變效果的。
 

而其他的著(zhù)名品牌也開(kāi)始逐步回歸，開(kāi)始在設計中融入漸變色彩。而在線(xiàn)電子雜志供應商 Texture 干脆使用了全屏的漸變色彩設計。
 

重新流行的“新”漸變設計的案例并不只有這么點(diǎn)兒。更多采用類(lèi)似漸變設計的網(wǎng)站正如同雨后春筍般涌現，類(lèi)型已經(jīng)不拘泥于專(zhuān)題頁(yè)，從產(chǎn)品展示到電商網(wǎng)站，不一而足。
 

現在所流行的漸變設計其實(shí)并沒(méi)有什么特別與眾不同的規范，或者規則，它可以是多種不同色彩支架你的加變，可以是從中央到周?chē)妮椛?，可以是從上到下的自然變化，也可以是從角落輻射到其他位置，它可以作為設計的主視覺(jué)而存在，也可以是諸多特性中的一個(gè)。
 

漸變最實(shí)在的一點(diǎn)在于設計師可以輕松駕馭，使用范疇不拘泥于一時(shí)一地，自由隨性地使用同樣可以創(chuàng )造實(shí)相當不錯的效果。
 

扁平化配色與漸變

設計趨勢:漸變色設計重新回歸主流

設計趨勢:漸變色設計重新回歸主流
漸變配色的回歸正巧是在扁平化大行其道的今天，所以它不可避免地同大量扁平化的元素搭配到了一起，而其中最值得考慮的因素，就是色彩。某些用色最大膽、跨度范圍最大的漸變色設計干脆直接就從扁平化配色中“借用”色彩。
 

這些色彩的使用讓色彩的漸變同如今網(wǎng)站的現代風(fēng)更加貼合，顯得更加符合趨勢。將漸變的設計同扁平化設計的美學(xué)特征融為一體，或者在Material Design 風(fēng)格的界面中適當加入一些柔和的色彩組合，都是能帶來(lái)不錯的效果。
 

漸變色的使用對于其他的設計趨勢而言，是一個(gè)不錯的補充，漸變本身的緩沖作用，使得你即使要重設計也無(wú)需從頭再來(lái)。
 

雙色調的加入

設計趨勢:漸變色設計重新回歸主流

設計趨勢:漸變色設計重新回歸主流
雙色漸變是漸變設計中的很重要的組成部分。而雙色漸變同其他設計趨勢的結合效果拔群，這一點(diǎn)值得再三強調。
 

而雙色調漸變的唯一缺點(diǎn)，大概是……被用的太多了。如果你稍加注意就會(huì )發(fā)現，確確實(shí)實(shí)有一大堆網(wǎng)站采用了雙色漸變來(lái)作為背景或者主要視覺(jué)模塊，似乎沒(méi)有哪種雙色搭配沒(méi)人用過(guò)。藍綠和橙紅搭配是用的最多的。
 

謹慎使用這一趨勢，因為確實(shí)很容易與別的網(wǎng)站“撞衫”。
 

漸變背景圖

設計趨勢:漸變色設計重新回歸主流

設計趨勢:漸變色設計重新回歸主流
漸變的回歸，使得我們再次可以看到許多擁有景深或者縱深的背景圖。虛擬現實(shí)的流行讓越來(lái)越多的設計師嘗試更加現實(shí)、更加立體的網(wǎng)站設計，毫無(wú)疑問(wèn)，你會(huì )在未來(lái)看到更多這樣的設計。
 

扁平化設計確實(shí)時(shí)尚而更易于接受，但是它缺少富有現實(shí)質(zhì)感的元素也是不爭的試試。試想一下自然中元素給人的感受和體驗。漸變色的使用很好地緩解了這個(gè)局面，畢竟自然界中很少有特別純粹特別單一的色彩。
 

不難想象，漸變色和陰影背后的概念和規則是相通的。它們?yōu)樵O計創(chuàng )造了深度和層次。
 

圖片上的漸變色疊加

設計趨勢:漸變色設計重新回歸主流

設計趨勢:漸變色設計重新回歸主流
作為一種設計趨勢，在圖片上疊加色彩已經(jīng)流行了相當長(cháng)的一段時(shí)間。而從圖片上的單色色彩疊加，到漸變色的疊加，是一個(gè)相當自然的“推導”過(guò)程。
 

在頁(yè)面的背景、頭圖中加入漸變的色彩疊加，可以讓它們的整體感更強，從而讓用戶(hù)注意到其他的更加重要、關(guān)鍵的元素，強化頁(yè)面的可讀性。這種設計對于大圖的作用尤其明顯。
 

在圖片上疊加漸變色的技巧在于平衡色彩和圖片之間的關(guān)系。色調是否要同圖片的含義相匹配？疊加后能否看清圖片中的細節？不同的色彩搭配方式帶來(lái)的結果可能是截然相反的。
 

微妙的漸變與UI元素

設計趨勢:漸變色設計重新回歸主流

設計趨勢:漸變色設計重新回歸主流
和漸變色的流行做法不同，有些設計師選擇在UI元素中使用微妙的漸變色。在較小的UI元素中，色彩變化幅度更加微妙，并且通常使用的都是單色調。
 

在早期的iOS系統當中，這種設計相當的常見(jiàn)，不過(guò)現在已經(jīng)很少見(jiàn)到了。
 

不可否認，漸變色還是更適合同較大的元素搭配起來(lái)。在較小的元素諸如小圖標、小按鈕等控件上使用的時(shí)候，色彩梯度并不是那么容易看清楚，甚至有可能讓用戶(hù)分心。
 

但是不論是在什么情況下使用漸變設計，都不要讓用戶(hù)產(chǎn)生停下來(lái)感慨“Wow好贊的漸變”的效果，這樣就喧賓奪主了。漸變是用來(lái)強化用戶(hù)體驗，而非勾引用戶(hù)來(lái)關(guān)注設計美學(xué)的。