網(wǎng)頁(yè)設(shè)計(jì)中的能動(dòng)的插畫(huà)
2016網(wǎng)頁(yè)設(shè)計(jì)之動(dòng)態(tài)插畫(huà)趨勢(shì)
在這個(gè)信息量過(guò)載的互聯(lián)網(wǎng)時(shí)代，同學(xué)們每天逛網(wǎng)站刷微博，應(yīng)該能發(fā)現(xiàn)，圖片的吸引力遠(yuǎn)高于純文字，圖片還會(huì)瞄一眼，文字往往跳著看，一圖抵千言誠(chéng)不我欺。然而圖片滿天飛的今天，光是靜態(tài)圖已遠(yuǎn)遠(yuǎn)滿足不了用戶了，那么如何才能在各式各樣的設(shè)計(jì)中讓自己的作品脫穎而出呢?海淘科技今天介紹的這個(gè)可以幫到我們，也是正在流行的趨勢(shì)：動(dòng)態(tài)插畫(huà)，2016網(wǎng)頁(yè)設(shè)計(jì)之動(dòng)態(tài)插畫(huà)趨勢(shì)。
事實(shí)上，動(dòng)態(tài)插畫(huà)并沒(méi)有一個(gè)官方的概念定義，基本上是指，將靜態(tài)的插畫(huà)圖像，通過(guò)一定的技術(shù)處理，轉(zhuǎn)換成動(dòng)態(tài)效果，是動(dòng)態(tài)與插畫(huà)相結(jié)合的一種新視覺(jué)表現(xiàn)語(yǔ)言。動(dòng)態(tài)插畫(huà)和傳統(tǒng)插畫(huà)、動(dòng)畫(huà)的區(qū)別在哪里呢?傳統(tǒng)插畫(huà)以靜態(tài)表現(xiàn)為主要手段，而靜態(tài)化的作品缺乏活力，進(jìn)行信息傳達(dá)時(shí)是一個(gè)單項(xiàng)傳遞的過(guò)程，缺乏與人們的溝通互動(dòng)，缺少激發(fā)人們感興趣的因素。動(dòng)態(tài)插畫(huà)由于繼承了傳統(tǒng)插畫(huà)的靜態(tài)部分，又有自己的獨(dú)特性，所以信息傳達(dá)更加到位。
至于平時(shí)我們看的動(dòng)畫(huà)(2D)，都是通過(guò)一幀一幀繪制而成的，相對(duì)而言動(dòng)態(tài)插畫(huà)就簡(jiǎn)單多了，它可以通過(guò)改變靜態(tài)圖像或者用動(dòng)畫(huà)技巧實(shí)現(xiàn)，不需要太過(guò)復(fù)雜的鏡頭語(yǔ)言就可以達(dá)到我們想要的效果。
提升趣味性，讓畫(huà)面更豐富有活力，充分完整傳達(dá)我們的意圖等等… 光說(shuō)沒(méi)實(shí)例怎么行呢，馬上帶你看看這些：
先來(lái)一個(gè)我們經(jīng)常遇到的場(chǎng)景：
一上網(wǎng)就遇到這個(gè)頁(yè)面，用戶肯定很喪氣，而大多數(shù)靜態(tài)的404 頁(yè)面僅僅是告知用戶：網(wǎng)絡(luò)/網(wǎng)站有問(wèn)題啦，不能給出更多的信息。相反，動(dòng)態(tài)插畫(huà)就完全不一樣咯：
通過(guò)眉眼的動(dòng)態(tài)效果，把一個(gè)迷航船長(zhǎng)的懵逼狀態(tài)凸顯得妙趣橫生，背景的氣球和搖曳的海浪讓頁(yè)面的活力也倍增不少。當(dāng)然，更出名的應(yīng)該是谷歌首頁(yè)的動(dòng)態(tài)LOGO插畫(huà)了，每一個(gè)都讓人津津樂(lè)道，成為設(shè)計(jì)師每日必看的靈感源：
by:Markus Magnusson
by: Google doodle
至于平面設(shè)計(jì)領(lǐng)域，看個(gè)對(duì)比，你就知道為什么插畫(huà)師都跑去學(xué)動(dòng)態(tài)技術(shù)了：
by:Tigran Manukyan
同一幅插畫(huà)，加上動(dòng)態(tài)效果之后人物變得活靈活現(xiàn)，畫(huà)面的其他元素也不再是單調(diào)的裝飾物，而是與主題相映成趣的互動(dòng)元素，場(chǎng)景的活力值暴漲。而且不光是插畫(huà)，現(xiàn)在連電商專題海報(bào)，也用上了動(dòng)態(tài)效果喲：
by:Barthelemy Chalvet
是不是感覺(jué)眼前一亮，忍不住買(mǎi)買(mǎi)買(mǎi)了，這就是動(dòng)態(tài)效果的魅力所在，作為吸睛神器當(dāng)之無(wú)愧。有了動(dòng)態(tài)效果加成，還怕商品沒(méi)銷(xiāo)量嗎?
打算年后求職的同學(xué)，現(xiàn)在是不是正為做出別具一格的簡(jiǎn)歷發(fā)愁呢，別急，來(lái)看看別人曬作品集的姿勢(shì)：
by:Tigran Manukyan
不說(shuō)一下子就打動(dòng)面試官，但在大多是靜態(tài)頁(yè)面的求職簡(jiǎn)歷中，這個(gè)動(dòng)態(tài)的自我介紹，給人驚喜是絕對(duì)沒(méi)問(wèn)題的，找到高薪工作的底氣更足了!除此以外，動(dòng)態(tài)插畫(huà)在UI 設(shè)計(jì)中更是錦上添花的運(yùn)用，最常見(jiàn)的閃屏(啟動(dòng)頁(yè))設(shè)計(jì)：
by:Cuberto
相比于傳統(tǒng)的靜態(tài)啟動(dòng)頁(yè)，動(dòng)態(tài)啟動(dòng)頁(yè)讓過(guò)渡更加自然，能呈現(xiàn)的信息也更加豐富。
by:Readme 官網(wǎng)
這是個(gè)膾炙人口的案例，在輸入密碼的時(shí)候，貓頭鷹會(huì)遮住自己的眼睛，是不是非常有趣。所以無(wú)論你是做網(wǎng)頁(yè)/LOGO/電商/UI …，都可以用上這么好玩且實(shí)用的動(dòng)態(tài)插畫(huà)，為你的作品大大加分，漲薪升職更是不在話下。當(dāng)然，人民群眾最喜聞樂(lè)見(jiàn)的動(dòng)態(tài)人物和表情包也是萬(wàn)萬(wàn)缺不了動(dòng)態(tài)效果的：
by:Tigran Manukyan
一個(gè)看似簡(jiǎn)單的表情包，涉及的東西其實(shí)非常多，如何表現(xiàn)人物的喜怒哀樂(lè)，如何讓頭部做鬼臉，身體應(yīng)該怎樣運(yùn)動(dòng)才不會(huì)顯得別扭，旋轉(zhuǎn)跳躍我閉著眼該怎么做，非常多的細(xì)節(jié)需要學(xué)習(xí)。
越來(lái)越多的網(wǎng)站，在網(wǎng)頁(yè)設(shè)計(jì)中采用動(dòng)態(tài)插畫(huà)，網(wǎng)頁(yè)設(shè)計(jì)動(dòng)態(tài)插畫(huà)頁(yè)是一種趨勢(shì)。海淘科技提供更多的網(wǎng)站設(shè)計(jì)基礎(chǔ)知識(shí)。文章下載，點(diǎn)擊：2016-2017網(wǎng)頁(yè)設(shè)計(jì)之動(dòng)態(tài)插畫(huà)趨勢(shì)
