設(shè)計(jì)風(fēng)格講解之——Glitch故障藝術(shù)風(fēng)格

故障了還能稱(chēng)為藝術(shù)?我想這個(gè)詞匯會(huì)讓不了解的人,覺(jué)得驚訝與陌生。不過(guò),作為新的藝術(shù)形式,它其實(shí)來(lái)源于我們生活中一個(gè)十分惱人的情景——數(shù)據(jù)和數(shù)字設(shè)備的故障。

比如小時(shí)候,一家人正開(kāi)開(kāi)心心的磕著瓜子看著電視,由于信號(hào)弱或不知名的原因,電視畫(huà)面突然變成了這個(gè)樣子:

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

或者是這個(gè)樣子:

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

周二沒(méi)有電視節(jié)目的時(shí)候……

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

畫(huà)面出現(xiàn)異常、失真、變形、破碎等混亂情況,導(dǎo)致我們觀(guān)看的欲望也沒(méi)有了……但藝術(shù)家們卻從這些偶然產(chǎn)生的「圖像錯(cuò)誤」中發(fā)現(xiàn)了美,它們不僅代表不完善,更意味著意外和變化,每一次故障都像是打破常規(guī)的再創(chuàng)造。

什么是 Glitch ?

Glitch 就是小故障、短暫的脈沖波干擾意思,比如說(shuō)瞬時(shí)故障,可以自我糾正,但是又相對(duì)難以解決的問(wèn)題,理論上來(lái)說(shuō),包括人類(lèi)組織和自然界在內(nèi)的所有類(lèi)型系統(tǒng)都會(huì)遇到故障,但是該術(shù)語(yǔ)主要在計(jì)算機(jī)和電子行業(yè),電路彎曲以及視頻游戲玩家中比較常見(jiàn)。

A glitch is a short-lived fault in a system, such as a transient fault that corrects itself, making it difficult to troubleshoot. The term is particularly common in the computing and electronics industries,in circuit bending, as well as among players of video games. More generally, all types of systems including human organizations and nature experience glitches.
——維基百科上關(guān)于 Glitch 的釋義

而故障藝術(shù)(Glitch Art),則是利用事物的故障,進(jìn)行藝術(shù)加工,使這種故障缺陷反而成為一種藝術(shù)品,具有特殊的美感。所以說(shuō),故障藝術(shù)的特點(diǎn)就在于顏色與圖像,都是失真破碎、錯(cuò)位變形的,以及一些條紋圖形的穿插輔助。

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

美國(guó)搞笑綜藝節(jié)目《What’s My Line》中的John Daily 進(jìn)一步定義了 Glitch ,并說(shuō)這是在發(fā)射火箭過(guò)程中遇到的一種不知所以然的問(wèn)題,所以稱(chēng)它為「小故障」;隨后《時(shí)代》雜志在文章中對(duì)其進(jìn)行定義:「Glitches—a spaceman’s word for irritating disturbances.」直到現(xiàn)在,Glitch 仍被用來(lái)形容火箭發(fā)射時(shí)出現(xiàn)的小故障,且延伸出了新的藝術(shù)形式。

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?


無(wú)處不在的 GlitchArt

1. 活躍在「Bug圈」的大佬們

被譽(yù)為「新媒體藝術(shù)之父」的韓裔美籍藝術(shù)家,白南準(zhǔn)(Nam June Paik),于 1965 年創(chuàng)作了《Magnet TV》磁鐵電視。他在電視機(jī)上放置了一塊巨大的磁鐵,使顯示屏里的圖像和聲音因磁鐵干擾發(fā)生了變化,故障藝術(shù)也應(yīng)運(yùn)而生。

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

荷蘭女藝術(shù)家羅莎·滿(mǎn)克曼(Rosa Menkman)是故障藝術(shù)的學(xué)術(shù)領(lǐng)軍人物,她不僅是一位創(chuàng)作故障藝術(shù)的新媒體藝術(shù)家,還是策展人和作家。

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

△ 《The Glitch Moment》,專(zhuān)門(mén)研究故障藝術(shù)的歷史和作品


這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

△ Rosa Menkman 的故障藝術(shù)作品


她還創(chuàng)立了網(wǎng)站——Glitch Studies Manifesto,成為了世界故障藝術(shù)家們交流學(xué)習(xí)的平臺(tái)。

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

西班牙藝術(shù)家 Maurizio Bongiovanni 的「故障藝術(shù)」小鳥(niǎo)油畫(huà),是在用架上繪畫(huà)的方式模仿數(shù)字藝術(shù)效果。

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

意大利藝術(shù)家 Giacomo Carmagnola 的作品風(fēng)格鮮明,熟悉他作品的人總是能從一堆圖片中立刻認(rèn)出。他經(jīng)常將既有人物或景物照片中的面孔與物體模糊化,造成一種數(shù)碼「融化」的效果。

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

臺(tái)灣藝術(shù)家韓旭東(Hsu Tung Han)的木雕作品,使 GlitchArt 立體可觸碰。

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

平面設(shè)計(jì)師 Magdiel Lopez 的設(shè)計(jì)項(xiàng)目(magdiellopez.com)——每天一款海報(bào)設(shè)計(jì)挑戰(zhàn),其中的許多作品都使用了故障效果。

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

地毯藝術(shù)家 Faig Ahmed,他將故障藝術(shù)融入傳統(tǒng)的地毯創(chuàng)作中,在純手工制作的地毯中融入了打碼、失真變形等數(shù)碼故障元素,織出了這些別具一格的崩壞地毯作品:

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?


2. 日常生活中的故障風(fēng)

厄瓜多爾 LaPradera 市有一家「故障酒吧(GlitchBar)」,它的前身是一座老舊失修、「滿(mǎn)是故障」的老住宅。酒吧希望這次對(duì)室內(nèi)的翻修能夠盡可能地減少對(duì)原處的破壞,重復(fù)利用原來(lái)的材料,更好地利用資源,進(jìn)行拆卸時(shí)保留了原來(lái)有的窗戶(hù)(現(xiàn)在變成了門(mén))、磚墻(成為底層地板)以及一些藤蔓植物和門(mén)前的棕櫚樹(shù)。

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

室內(nèi)設(shè)計(jì)與裝潢大膽采用了故障藝術(shù)的元素,從酒吧門(mén)面到內(nèi)部家具(燈、開(kāi)關(guān)、木質(zhì)桌椅和吧臺(tái)),都被涂上了帶有裝飾性的抽象割裂圖案,看似支離破碎卻又別具一格,鮮艷又明亮。

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

電影、廣告、服飾等領(lǐng)域,同樣能見(jiàn)到故障藝術(shù)的運(yùn)用。電影《攻殼機(jī)動(dòng)隊(duì)》海報(bào),結(jié)合故事調(diào)性,在畫(huà)面中鋪設(shè)了大量破碎錯(cuò)位的條紋, 還有絢麗的色彩。

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

帶火了一波網(wǎng)紅和特色城市的抖音,同時(shí)還帶火了故障藝術(shù),Logo 和宣傳海報(bào)也是運(yùn)用了大量的條紋裝飾、圖像錯(cuò)位、紅綠撞色及顏色錯(cuò)位來(lái)吸引眼球。

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

滴滴燃到爆的《想出發(fā)就出發(fā)》的廣告片,利用故障藝術(shù)的特效,呼喚你透過(guò)現(xiàn)實(shí)做更好的自己,不再優(yōu)柔寡斷尋找借口。

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

蘋(píng)果 HomePods 廣告短片《Welcome Home》,巧妙的結(jié)合了「故障藝術(shù)」這樣一個(gè)數(shù)字藝術(shù)的概念,但全部以道具實(shí)拍實(shí)現(xiàn)。

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

隨著電腦和網(wǎng)絡(luò)的普及以及電子游戲成為稍微主流的娛樂(lè)方式后,在 2010 年代以來(lái),越來(lái)越多的時(shí)裝設(shè)計(jì)師們將 Glitch Art 這種 nerdy 的藝術(shù)形式滲透到時(shí)尚設(shè)計(jì)領(lǐng)域。

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

△ Anrealage FW 2011 森永邦彥 Kunihiko Morinaga 作品


這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

△ 來(lái)自日本的服裝設(shè)計(jì)師 Nukeme 與視覺(jué)藝術(shù)家 Ucnv 合作的故障藝術(shù)風(fēng)格風(fēng)衣 2013


這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

△ Frankie Morello 2015 作品


GlitchArt 算法總結(jié)與實(shí)現(xiàn)

由于故障藝術(shù)的風(fēng)格種類(lèi)比較多,我們了解到一些常見(jiàn)風(fēng)格的代碼實(shí)現(xiàn)。

以下代碼完整版,來(lái)自《高品質(zhì)后處理:十種故障藝術(shù)(Glitch Art)算法的總結(jié)與實(shí)現(xiàn)》

1. RGB顏色分離故障(RGB Split Glitch)

RGB 顏色分離故障(RGB Split Glitch),也稱(chēng)顏色偏移故障(Color Shift Glitch),是故障藝術(shù)中比較常見(jiàn)的表達(dá)形式之一。例如,抖音短視頻 App 的 Icon,即是 RGB 顏色分離故障藝術(shù)風(fēng)格影響下的作品,給整體產(chǎn)品帶來(lái)了潮流與年輕的氣息:

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

RGB顏色分離故障(RGB Split Glitch),實(shí)現(xiàn)算法的主要要點(diǎn)在于紅綠藍(lán)三個(gè)通道采用不同的 uv 偏移值進(jìn)行分別采樣。一般而言,會(huì)在 RGB 三個(gè)顏色通道中,選取一個(gè)通道采用原始 uv 值,另外兩個(gè)通道進(jìn)行 uv 抖動(dòng)后再進(jìn)行采樣。一個(gè)經(jīng)過(guò)性能優(yōu)化的實(shí)現(xiàn)版本 Shader 代碼如下:

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

上述代碼,得到的渲染表現(xiàn)如下:

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

2. 錯(cuò)位線(xiàn)條故障(Line Block Glitch)

錯(cuò)位線(xiàn)條故障(Line Block Glitch)具有較強(qiáng)的表現(xiàn)力,在 Glitch 系列特效中的出鏡率也較高。

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

該算法的實(shí)現(xiàn)思路在于隨機(jī)寬度線(xiàn)條的生成。我們一步一步來(lái),先從生成均勻?qū)挾染€(xiàn)條開(kāi)始:

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

基于 trunc 函數(shù)以及 randomNoise 函數(shù),配合上述調(diào)用代碼,即可得到如下均勻?qū)挾染€(xiàn)條:

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

接著,使用如下代碼,將均勻漸變線(xiàn)條轉(zhuǎn)為隨機(jī)梯度的等寬線(xiàn)條:

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

然后,將隨機(jī)梯度的等寬線(xiàn)條,經(jīng)過(guò)多次 randomNoise 操作,轉(zhuǎn)換為隨機(jī)梯度的非等寬線(xiàn)條:

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

可以得到如下的渲染表現(xiàn):

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

接著,通過(guò)隨機(jī)梯度的非等寬線(xiàn)條,去抖動(dòng) uv 采樣生成源色調(diào)的 blockLine Glitch:

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

對(duì)應(yīng)的渲染表現(xiàn)如下:

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

△ 錯(cuò)位線(xiàn)條故障(Line Block Glitch)


3. 掃描線(xiàn)抖動(dòng)故障(Scan Line Jitter Glitch)

掃描線(xiàn)抖動(dòng)故障(Scan Line Jitter Glitch)算法較簡(jiǎn)單,但是得到的渲染表現(xiàn)卻非常具有沖擊力:

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

一個(gè)比較直接的實(shí)現(xiàn)是直接對(duì)橫向或者縱向 UV 進(jìn)行基于 noise 的抖動(dòng),Shader 實(shí)現(xiàn)代碼如下:

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

得到的渲染表現(xiàn)如下:

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

△ 掃描線(xiàn)抖動(dòng)故障(Scan Line Jitter Glitch)


4. 數(shù)字條紋故障(Digital Stripe Glitch)

數(shù)字條紋故障(Digital Stripe Glitch)同樣是出鏡率較高的 Glitch 系后處理特效之一。例如在《賽博朋克2077》的 Gameplay 中,就可以到它的身影:

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

△ 《賽博朋克2077》中的數(shù)字條紋故障(Digital Stripe Glitch)特效 @ CD Projekt


數(shù)字條紋故障(Digital Stripe Glitch)需在 Runtime 層完成 noise Texture的生成,然后傳入 GPU中 進(jìn)行最終的運(yùn)算和渲染呈現(xiàn)。

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

生成的圖片如下:

這兩年超火的故障藝術(shù),如何從零開(kāi)始演變至今的?

△ 數(shù)字條紋故障(Digital Stripe Glitch)


喜歡的人超級(jí)喜歡,不喜歡的人則無(wú)感,故障藝術(shù)的誕生與流行,顛覆了我們對(duì)美的定義。別具一格的故障藝術(shù)給生活中增添了一抹色彩,讓我們清楚的意識(shí)到,設(shè)計(jì)也可創(chuàng)造無(wú)限可能。我們網(wǎng)站提供了非常多制作故障藝術(shù)效果的素材,下載地址

每天更新,
全站高品質(zhì)素材免費(fèi)下載!