2020年已經(jīng)過了一大半了。致力于科技及網(wǎng)頁開發(fā)的新聞網(wǎng)站TNW對明年的十大網(wǎng)頁設計趨勢做出了預測。
Adobe XD產(chǎn)品設計高級總監(jiān)Khoi Vinh認為,“從這些趨勢可以清楚地看出,‘網(wǎng)絡’設計比從前更接近傳統(tǒng)的“圖形”或“印刷”設計了。與僅僅五到十年前相比,設計師在表現(xiàn)力和創(chuàng)造力方面的靈活性令人驚訝。”
該預測的作者Amber Leigh Turner經(jīng)過了繁重的整理工作后,匯總了可能在2020年使你的屏幕煥然一新的Web設計趨勢。
盡管除了標準的文字對圖像的設置外,一些領域往往熱衷于加入更多不同類型的元素,使設計變得更豐富。但是這種“純文字”趨勢也很有趣,因為它拋棄了典型的背景圖像,選擇讓文字排版來完成工作。
Phase3的網(wǎng)站是一個很好的例子,這個設計只關注字體,這種字體也具有某種個性,而不是規(guī)規(guī)矩矩的或過度使用無襯線字體?!都~約時報》上也能看到這種趨勢,例如Food Festival網(wǎng)站的純文本標題就采用了將自定義字體與動畫配對的形式。雖然插圖已經(jīng)在網(wǎng)站上流行了很多年,但最近出現(xiàn)了一種越來越流行的趨勢,那就是原創(chuàng)的的、細節(jié)化的、干凈利落的的插圖網(wǎng)站。像DottedSign(上圖)和Fixate(下圖)這樣的網(wǎng)站就很好的詮釋了這種增長趨勢。這兩個網(wǎng)站都使用了非常合適的和細節(jié)化的插圖,從而把整個網(wǎng)站緊密的連接在一起。將插圖與一些動畫結合在一起的形式確實更加吸引人,并可作為與網(wǎng)頁訪客交流的另一種方式。動畫插圖是文本的一個很好的補充工具,它可以更好地說明闡釋網(wǎng)站的用意、思想以及促進和訪客之間的交流互動。
復古一直都是一種流行趨勢。但是在2020年,這種趨勢很可能將以不同的形式展現(xiàn)。網(wǎng)站不是專注于復古或陳舊的外觀,而是把懷舊的元素和現(xiàn)代風格融合在一起。今天,網(wǎng)頁設計最常見的設計靈感之一就是使用復古色彩或版式來傳達一種懷舊感??死锼刮鳌ぬ└–hrissy Teigen)的新網(wǎng)站就是一個很好的例子,他使用具有復古風格的配色方案(復古但明亮)以及很帶有懷舊風格的字體。
作為備受歡迎的排版趨勢網(wǎng)站,Typewolf仍舊使用復古的排版和顏色來設計其網(wǎng)站頁面,同時仍保持美學的現(xiàn)代性。他們的字體與背景顏色搭配,視覺上很復古,但卻絲毫不讓人覺得過時。2020年可能會有越來越多的網(wǎng)站嘗試完全不使用色彩顏色,而堅持只使用黑白兩色。可是說是單色的去極簡主義吧。
卡恩·威爾遜(Cahn Wilson)的網(wǎng)站很好地展示了缺乏色彩的設計美學。該網(wǎng)站主要展示一些帶有灰度圖像的黑白圖像,干凈、清晰。
Alexsandr Yaremenko的網(wǎng)站(如下)也保留了黑白配色方案。
大多數(shù)網(wǎng)站是在不可見的網(wǎng)格系統(tǒng)上設計的,因為這樣的系統(tǒng)可以使頁面上的各個組成部分保持水平。但是,預計到2020年,這些網(wǎng)格將在視覺上變得更加占主導地位,甚至被用作主要的設計美學。這種趨勢顯然是受到流行的“卡片”設計的啟發(fā)。Frames for Future的網(wǎng)站是使用網(wǎng)格作為設計美感的一個很好的例子。他們網(wǎng)站的內(nèi)容組合在一起形成一個大矩形,并以網(wǎng)格格式對齊。
Evergib的大部分網(wǎng)站(如下)也都布置在網(wǎng)格中,并通過不同大小的“單元”賦予其尺寸,在視覺上增添了不少趣味。字體概述是一種新興趨勢,并且很有可能在2020年愈演愈烈。
“在網(wǎng)絡上,排版的與眾不同已經(jīng)成為一種必要??紤]到不久前設計師們還只有屈指可數(shù)的幾種字體可供使用,這其實是很令人驚訝的一種變化”,來自Adobe的Vinh解釋說:“我們有大量的網(wǎng)絡字體。我們還需要更大膽、更多樣化的網(wǎng)頁排版。”毫無疑問,這不僅體現(xiàn)在這一趨勢中,其他很多趨勢也體現(xiàn)了這一點。本文開頭提到的網(wǎng)站Phase 3其實就具有這樣概述版式的設計。Redscout還使用大輪廓字體作為其網(wǎng)頁設計美學的一部分,結合動畫將字母的“填充”體現(xiàn)出來,當你向下滾動頁面時,只留下輪廓。這是另一種基于字體的趨勢。到2020年,很可能你可以在房間的另一頭看清楚這一頭電腦屏幕上的字體設計。Redscout和《紐約時報美食節(jié)》(在本文的前面都有介紹)都是這一趨勢的很好例子。而Baina(上圖)也將其名稱的字體大小提高到非常醒目的尺寸,占據(jù)了其主頁的近一半面積。
HalloBasis也采用了非常大的字體的版式,并作為一種導航樣式,可幫助訪問者前往其網(wǎng)站的不同區(qū)域。幾何形狀和線條的圖案將在2020年卷土重來。
例如FUTURE LONDON ACADEMY網(wǎng)站上采用的動畫幾何形狀的設計就可以體現(xiàn)這一趨勢。XXXI的網(wǎng)站(如下圖)的“編碼簡介”以類似的方式使用幾何形狀。通常,當我們想到動畫時,我們看到它們自己發(fā)生,獨立于我們作為網(wǎng)站訪問者在頁面上所做的任何動作。然而,在網(wǎng)頁設計中,越來越多的趨勢是由訪問者的某種輸入或動作觸發(fā)動畫。
Adobe的Vinh當然同意?!皩?/span>用戶交互與有的動畫和字體設計結合起來,是這一代版式設計中最令人興奮的事情之一。”除了前文提到的Coding的簡介,羅曼·阿瓦萊(Romain Avalle)的網(wǎng)站也是這一趨勢的一個很好的例子。 在這個網(wǎng)站的中心,縮寫的輪廓根據(jù)光標所在的位置而移動。這種類型的交互式動畫有助于吸引觀眾,并使他們放慢腳步找出動畫。這樣的設計使得用戶的體驗感脫穎而出,而不是僅僅作為被動的消費者。流行的配色和配色方案在音樂、服裝、社交媒體等各個方面體驗出來。到2020年,其中一些配色也許會成為設計師們設計網(wǎng)站的方式。就拿Pinterest和Instagram流行的原色藍色和淺粉色/粉塵狀的腮紅色作為流行的顏色組合示例。 Collate Art的網(wǎng)站(如上圖)和Datalands的網(wǎng)站(如下圖)均在其網(wǎng)站設計中采用了這種流行的配色方案。總的來說,2020年最可能看到的網(wǎng)頁設計趨勢包含的元素有:動畫、插圖、版式設計以及新型的配色方案和交互作用。
從大型字體到概述字體,從復古風格的換舊感到時尚的配色方案……對于設計師和設計迷來說,2020年都將是精彩紛呈的一年,一起期待吧!
標簽: