當前位置: 首頁 > 設計資訊 > 設計教程 > 正文

2018年Dribbble反映出來的10個設計趨勢

2018-12-29 1849 0

個人都在關注趨勢。Dribbble 是設計師的集散地,也是設計趨勢最容易體現(xiàn)的地方。如果你經(jīng)常關注 Dribbble 上的那些設計作品,你總會注意到許多有意思的共性,在更長的時間尺度上關注這些共性,會發(fā)現(xiàn)其中不少會延伸到更大的設計領域和范疇,其中很多會以趨勢的形式成為階段性甚至長期的設計趨勢。這些流行的趨勢有的關乎技法,有的則是色彩、風格,甚至是某種隱喻。

當然,不論如何,作為設計師,這些趨勢的價值是毋庸置疑的,關注它們,以開放的心態(tài)面對著,也許它們會在下一個階段在我們自己的設計作品中開花結果。

1、非標準比例的人物形象

以人為核心的自定義插畫是這兩年來,最顯著的設計趨勢之一。這種插畫展現(xiàn)形式能夠快速呈現(xiàn)想要呈現(xiàn)的環(huán)境、流程,更重要的是創(chuàng)造情感訴求。標準而寫實的人物形象在大量的設計訴求之下,顯得平庸而不夠突出,這也使得走樣但是富有張力的非標準人物身材比例顯得更加出彩,這也是為什么近年來我們能夠如此頻繁地看到諸多非標準的人物插畫。

1.jpg

這幅插畫來自 icons8 。巨大的鞋子,不成比例的巨手,水壺纖細的握柄和壺頸,強烈的對比顯得頗具張力。

2.png

Diana Stoyanova 的插畫呈現(xiàn)了一個忙碌女性的形象,非標準的身材略顯抽象,但是很有力量。

3.png

Diana Stoyanova 的這幅插畫作品用夸張巨大的人物形象來強調你比手機更大,更重要。

4.gif

而 Radio 的這幅插畫則使用走樣的身材營造出有趣而可愛的形象,讓交互更加有意思。

2、提供輔助信息的界面插畫

時至今日,插畫在 UI 中已經(jīng)不再鮮見。自定義的插畫早就不是裝飾性的設計,它讓UI界面更加具有視覺吸引力,和情感表達的能力。更重要的是,它是功能性的,它為界面的功能和信息提供支撐,以「互文」的方式來告知用戶界面想要呈現(xiàn)的功能,畢竟圖片和插畫所呈現(xiàn)的視覺信息比文字更快。

5.png

這個界面也是 icons8 團隊制作的。輔助性的插畫讓報錯信息也顯得足夠明亮而正能量,讓用戶不會覺得難受。

6.png

這組作品同樣來自 icons8 ,這次的風格不同,并且是為移動端新用戶引導而設計的。引人矚目的插畫將文字描述的優(yōu)勢更加具象化地表現(xiàn)出來。

7.png

Netguru 的報錯頁面顯得非常純粹也非??蓯邸?/p>

8.gif

Hoang Nguyen 所設計的這個插畫甚至是交互式的,它的靈感來源于一款經(jīng)典的滑塊游戲,動效模擬了這個效果。

3、動態(tài)的 LOGO 和圖形

動畫效果是強化視覺的重要手段。在以往,視覺和圖形化元素絕大多數(shù)都是靜態(tài)的,但是現(xiàn)在為了更加積極地迎合用戶體驗,動態(tài)的設計已經(jīng)成為常規(guī),許多動效所帶來的效果是靜態(tài)設計所無法呈現(xiàn)的,在情緒和氛圍上的營造也更加強大。動效不僅能夠讓產(chǎn)品在視覺上更加吸引人,而且能夠向用戶呈現(xiàn)出產(chǎn)品的品質感。此外,你還能夠在網(wǎng)站、通知、教程和交互流程等地方找到動效。這也是為何 Dribbble 的設計作品中,有如此之多的動態(tài)的圖形化元素。

9.gif

Motion Design School 的這個動態(tài) LOGO 借用了負空間的設計方法,主體則采用了狗的形象,動態(tài)呈現(xiàn)下極為可愛生動。

10.gif

Awsmd 則更有意思,將水母的運動方式賦予了花朵,良好的生命體在體態(tài)上貫穿一致,有著獨一無二的視覺表現(xiàn)力。

11.gif

Markus Magnusson 將一組風格一致情節(jié)連貫的插畫動態(tài)地連接到了一起,讓LOGO 具備了強大的敘事能力。

12.gif

Yup Nguyen 的動畫則不僅時尚,而且非常有趣,讓人感到愉悅,而忘記等待的煩惱。

4、工作流程和工作區(qū)主題插畫

Dribbble 上最受歡迎的數(shù)字插畫主題之一,就是各種工作流程和場景。插畫和平面設計師熱衷于相對藝術地呈現(xiàn)設計工作的流程,團隊的協(xié)作,創(chuàng)意的發(fā)散過程,溝通的狀態(tài),工作空間的呈現(xiàn)。它流行的另一原因,是這種內容的插畫在著陸頁和博客文章頁面中非常適用,且非常流行。

13.jpg

Tubik Studio 的這幅插畫展現(xiàn)了設計師的工作空間,整個視角似乎是在廣角相機下被扭曲了,非常有趣。

14.png

來自 Walid Beno 的這個插畫則呈現(xiàn)的是團隊協(xié)作的場景,巨大的 UI界面顯得頗為夸張,不過主題性也是借此才得以體現(xiàn)和強化。

15.gif

Pitch 的這幅插畫同樣呈現(xiàn)的是團隊協(xié)作的場景,不過加入的動效非常微妙,將協(xié)作的趨勢和狀態(tài)給放大了出來,視覺上更加動感,且足夠時尚。

16.png

Ted Kulakevich 的插畫中描摹的是一個正在工作,喝著咖啡的角色形象,和日常的設計和創(chuàng)意工作者的狀態(tài)非常接近,令人賞心悅目的色彩則讓整個狀態(tài)令觀者非常舒適。

17.png

如果你的工作狀態(tài)也是如此的忙碌,那么你應該能夠從 icons8 的這幅插畫中找到共鳴。插畫中被工作內容所包圍的狀態(tài)不就是你嘛?

5、有趣的吉祥物和奇妙的生物

設計是一個需要想象力的工作。有趣的小怪獸,奇妙的機器人,經(jīng)典或者原創(chuàng)的卡通人物,只存在于傳說和想象中的生物,從來都不會在 Dribbble 上缺席。品牌吉祥物的設計在這種趨勢下越來越具有明顯的情感表現(xiàn)力,而卡通化的角色形象很大程度上會利用人們對于特定動物或者特定形象的情感關聯(lián),人格化、角色化之后的吉祥物,能夠讓用戶產(chǎn)生在和它進行情感交流的錯覺。

18.jpg

設計師 Mike 的網(wǎng)頁設計作品當中,有趣的卡通形象作為視覺主體,讓產(chǎn)品、用戶更快和頁面產(chǎn)生視覺連接。

19.jpg

和Mike 的設計目標不同的是,Alexandra Zutto 的插畫是借助機器人的形象來呈現(xiàn)未來主義的氛圍。

20.gif

Motion Design School 使用可愛的動態(tài)插畫來強化品牌的展示。

21.png

這組來自 icons8 的插畫所營造的是一個典型的結帳場景。真正特別的地方在于角色的設定,人和機器人之間的交互,營造出科幻的氛圍。

22.png

Ramothion 靈活的運用狐貍這個吉祥物形象,結合 UI元素,表達了「演示」的主題。

23.png

icons8 的這幅插畫則利用了噪點來賦予角色以一種帶有藝術感的氣息。

6、各式各樣的運動狀態(tài)

運動就是生命。對于設計師和插畫師而言,最有張力的東西大概都藏在運動將要開始的時候,藏而未發(fā)的一瞬間,或者運動過程中,姿態(tài)舒展的某一秒。體育運動中往往能夠更快找到這樣的狀態(tài),不過其他的主題之下,也存在類似的運動狀態(tài)。這樣的運動狀態(tài)充滿了表現(xiàn)力,設計師和插畫師們常常會借助色彩、圖形、曲線等元素來構建這樣的設計作品。

24.png

Unfold 的插畫呈現(xiàn)的是沖過終點的運動員,主題暗示出了成功、成就,明亮的色彩和舒展的姿態(tài)在整體上保持了一致,藝術性也不低。

25.png

同樣是呈現(xiàn)的跑步,但是Jack Daly 所表現(xiàn)的是即將開始的運動,蓄勢待發(fā)的一瞬間的狀態(tài)。這幅插畫是給 InVision 所設計的,主題是設計沖刺,而這幅插畫非常貼合這一隱喻。

26.png

Walid Beno 的插畫所呈現(xiàn)的場景非常獨特,現(xiàn)實的路徑和虛擬的景象連在一起,人物仿佛騎行在現(xiàn)在與未來之間。

27.jpg


 

這幅來自 Tubik 的插畫則將運動的場景和手機融于一個場景當中,整個構圖非常動態(tài)。

7、陰影和負空間

平面設計另外一個重要的趨勢,就是使用盡可能具有表現(xiàn)力的插畫設計,利用陰影和負空間來創(chuàng)造戲劇感和視覺影響力,就像Vogue 的御用設計師  Malika Favre 的插畫作品那樣。

有限的色彩,引人矚目的色彩對比,光影之間的互相成就,大膽而有意義的細節(jié)。如果你稍微有意識地去看,會發(fā)現(xiàn)每天都有設計師在 Dribbble 上發(fā)布這樣風格的作品。

28.jpg

比如 Ksenia Shokorova 的這幅插畫就很好地呈現(xiàn)出夏天的炎熱和慵懶的夏日氣氛,以富有表現(xiàn)力的人物輪廓作為構圖的中心,甲板和水面構成鮮明的對比,色彩不多但是令人印象深刻。

29.jpg

Joanna Lawniszak 的插畫則使用強烈的光影,讓一個簡單的桌面變得具有明顯的舞臺效果,相當大氣。

30.jpg

Yoga Perdana 的這個LOGO設計作品利用的是負空間,讓文字當中融入了一個非常清晰的貓的形象,并且還呈現(xiàn)出貓在文字之間穿插的效果。

31.png

這個名為 Mr.Travel 的LOGO設計作品來自設計師 Yuri Kartashov,他將男人的面部和山脈的形象結合到了一起。

32.gif

Dmitry Stolz 的設計項目 Fetch My Meds 中使用了兩個可愛的動物角色,微妙的動畫和明確的對比使得兩個角色顯得活潑而有趣。

8、3D 圖形

3D 無疑是現(xiàn)在 Dribbble 上最熱門的趨勢。大家用3D建模來做各種各樣的東西,無論是等軸測的插畫還是游戲角色,還是以往大家會用 PS 來繪制的光影,現(xiàn)在一并使用3D建模和渲染來實現(xiàn)了。

33.gif

Ueno 這個引人入勝的動畫效果就是在 3D 渲染的基礎上實現(xiàn)的,有趣的元素構建成的場景讓人愛不釋手,而這居然是一個招聘廣告?有意思。

34.jpg

Tubik Studio 的這個首圖中的插畫形象,同樣是使用3D建模來實現(xiàn)的,這樣的角色形象很容易讓人聯(lián)想到動漫和游戲,結合風格類似的CTA元素,可以極強地影響用戶的注意力。

35.jpg

這是設計師 Mohamed Chahin 精心設計的等軸測插畫,柔和的色調和模糊的光影讓家的氛圍得到了強化。

9、關于 UI 界面的插畫

隨著精通插畫的設計師越來越多,插畫開始深入到設計的方方面面,包括在 Web 和 UI 界面當中的字體、圖形甚至整個氛圍和環(huán)境。由于注意力的競爭如此的激烈,以往原本只需要普通圖片就能做到的事情,現(xiàn)在需要借助插畫來做到。

36.gif

在 Dropbox Design 的這篇創(chuàng)意相關的文章當中,包含有一些這樣帶有粗野主義風格的插畫。也許你并不是那么青睞這種風格的插畫,但是即便如此,你也不會繞過這幅插畫只單純?yōu)g覽文字。

37.jpg

這是一幅關于醫(yī)生和專業(yè)交互界面的插畫,作者是設計師 Alexander Savic ,插畫會將人迅速帶進醫(yī)療保健相關的領域。

38.jpg

這幅插畫來自設計工作室 Fireart Studio,它暗示了約會 APP 背后的真實和潛藏的精彩,讓人主動追求屬于自己的愛情。

39.png

Dmitry Stolz 的插畫則呈現(xiàn)了移動端APP 上的交互,做決策的關鍵時刻。

10、多層次剪切效果插畫

最后一個值得一提的趨勢,則是類似剪紙一樣的多層剪切視覺效果插畫。這種設計效果讓插畫具備了豐富的層次,顯得深沉而原創(chuàng),帶有更強的物理工藝質感和難以磨滅的印象。

40.png

Eddie Lobanovskiy 的插畫就是使用這樣的效果,主題關于太空,這種多層剪切效果讓太空顯得更為深邃。

41.jpg

Michael Fugoso 的設計作品,他將這種插畫定義為具有深度幻覺的平面數(shù)字插畫。

如果這種插畫風格和卷軸效果結合起來,就更加強大了。

42.gif

Studio VØR 的多層次剪切插畫在交互中次第呈現(xiàn),各個部分之間相互影響并關聯(lián)著。

43.gif

這是 Anano Miminoshvili 所創(chuàng)建的一個網(wǎng)頁滾動交互的案例,隨著用戶不斷滾動,不同的層級的元素次第運動,一個接著一個被激活。

結語

毫無疑問,Dribbble 本身正在逐步成熟,越來越多的設計作品中,開始融入更為明顯的藝術特征,設計的層次和力量感比以往更強了。作為設計師發(fā)布各種小樣、練習的Dribbble,本身也作為設計領域的試驗田而存在,很多設計趨勢在這個平臺上醞釀,成熟,并且逐漸走向世界。


1
評論區(qū)(0)
正在加載評論...
相關推薦