当前位置 - 股票行情交易網 - 裝修設計 - 扁平化設計風格海報-如何從零開始學習圖標設計

扁平化設計風格海報-如何從零開始學習圖標設計

壹篇文章,助妳看懂藝術流派和設計風格

雖然現在的設計大多是快餐式呈現在大眾面前,但是這其中也凝聚了壹批批設計師的創意和想法,引領了壹個又壹個設計潮流,從擬物到扁平再到如今的輕擬物,已然經歷了壹個小小的輪回,然而這些設計風格的形成,像極了幾個世紀前的藝術流派。本文將對幾個藝術流派和設計風格進行橫向分析,找出他們的相似之處,目的是為了啟發大家,從經典發掘閃光,並將之註入到設計中,如果運氣好說不定還能開創壹個全新的設計趨勢哦。

藝術流派和設計風格

為什麽會說藝術流派和設計風格非常相似呢,首先我們來對比壹下他們的產生及運營方法,這裏做了壹個表格來簡單表述藝術流派和設計風格這兩個概念:

我們不難發現,盡管間隔幾個世紀,他們的產生和運營方式卻非常相似。雖然設計不能被稱為純粹的藝術,但不能否認他們是有內在聯系的。也許擬物→扁平→輕擬物這些設計風格的演變和幾個世紀前的藝術家們並沒有半毛錢關系,但是羅貝爾托·隆基說過:“藝術作品永遠都不是單獨存在的,它永遠都離不開其他的藝術作品。”所以這種事情,誰又能說的清楚呢?

既然說不清,那索性大膽說壹說好了。

本人博覽群書(《藝術流派鑒賞方法》),終於在藝術流派發展的漫長歷史中,尋找到了照亮現代設計的點點星光。

它們就是:新印象主義→立體主義→抽象藝術(按照時間順序排列)

相信大家對於這三個流派的感受多半是熟悉又陌生的,本次分享我們就從這三個流派出發,尋找他們與現代設計的相似之處,而這之後出現的新造型主義,是否會對未來設計趨勢有所預示,本人雖才疏學淺,但也想分析壹番。

新印象主義與扁平化設計

說到新印象主義,有這樣兩個作品不得不提,保羅·西涅克的《早餐》和喬治·修拉的《大碗島上的星期天下午》。

保羅·西涅克當時在創作《早餐》時的突破點在於將分割畫法和點彩融合,分割畫法負責構圖平衡,點彩負責視覺混合,這是壹種非常理性的繪畫方式。整個畫面安靜沈穩,可以掛在任何壹個餐廳的墻壁上。

△保羅·西涅克的《早餐》

喬治·修拉的《大碗島上的星期天下午》,本頭有幸在國家博物館看到過這幅畫(可惜也不是原作),這幅畫中的背景形狀細致,人物輪廓規整,整體布局運用力學原理,構圖穩定。打破了當時視覺原理束縛,使畫面擁有全景既視感。

△喬治·修拉的《大碗島上的星期天下午》

仔細觀察這兩幅畫我們可以發現,新印象主義的這兩位代表畫家的代表作,在人物造型上與幾年前開始流行的扁平化矢量人物非常相似。新印象主義繪畫作品中的人物,幾乎可以用基本圖形分解出來。為了讓大家更容易理解,本人將《大碗島》這幅畫中最右邊的撐傘女子,用基本圖形分解出來,單獨呈現,是不是也十分優雅好看呢?

如果我們將整個作品進行分解,得到的畫面會極具現代氣息,好像這麽久遠的作品穿越時空回到我們的鼠標下。所以,分析了解新印象主義的作品,對於現在人物圖形的設計會有非常大的幫助。有了這些參考,壹定會讓我們設計作品中的人物看起來更生動自然,具有文藝氣息和藝術厚度。

再來看看我們經常在國外設計網站上看到的插圖風格。

這種風格的插圖越來越多的出現在Behance,Dribbble等設計師網站上,本頭也曾效仿過,在開始研究藝術流派之後本頭猛然發現,這類圖形與新印象主義的繪畫風格擁有非常相似的人物表現形式,雖然作者在畫這張圖時多半沒有想到我們修拉老師的《大碗島》,但如果他能吸收壹些,壹定能讓畫面更豐富有趣。

立體主義與輕擬物風格

我們來看立體主義的代表作品,喬治·布拉克的《埃斯塔克的房屋》。喬治機智的把房子和樹木簡化為幾何形,運用顏色過渡對成群的樹木和房屋進行區分,這在當時是壹種介於平面與立體之間的全新表現形式。

我們不難發現,追隨新印象主義之後出現的立體主義與度過扁平化潮流如今正流行的輕擬物漸變風格略有相似,不同的是立體主義存在的目的是全角度表現壹個物體,而輕擬物只是粗淺的將扁平化物體扭轉至45°角,再稍加壹些漸變。雖然粗淺,卻也符合當下審美趨勢。

假如我們吸收立體主義流派的壹些特點,是否能讓所謂的假3D作品不那麽粗淺呢?仔細觀察《埃斯塔克的房屋》,喬治用非常豐富又整體的色彩表現明暗過度,而不僅僅是同色系的明暗過度,藝術作品中對色彩運用的考究,完全值得被用在我們的設計中。

抽象藝術與點線面

說到抽象藝術,必須祭出我們的抽象派大神康定斯基了。他的《玫瑰灰》與《紅黃藍》就是將點線面元素運用到極致的畫作。看不懂?不要緊,康定斯基就是要我們放棄無謂的猜測、揣摩與思考,在色彩、線條的舞動中,盡情體會藝術的純粹與美麗。但是從另壹個維度去看,康定斯基又極其理性的將幾何形狀抽離出畫面,用浮動的活躍元素體現運動效果,同時構圖也非常講究。

△康定斯基《紅黃藍》

△康定斯基《玫瑰灰》

康定斯基的作品現在看來依然充滿時尚感,或許是因為點線面是構成畫面永恒的元素,駕馭了點線面,就能夠變化出無窮的畫面。現在的招貼畫,海報設計,也越來越多的運用到點線面元素,但大多不作為主體,而作為填充畫面空白處的元素,即便如此,也能夠提升整體的活躍感。

聊到這裏,本頭覺得是時候強行展望壹下未來設計趨勢了。

按照套路,我們首先需要壹個藝術流派加持,那麽在新印象主義,立體主義和抽象藝術這三個流派之後出現的新造型主義必須是不二之選。

單說新造型主義,也許大家並不熟悉,那我們來看下圖:

△蒙德裏安《黃,紅,藍的構成》

大家壹定見過吧,蒙德裏安的這幅《黃,紅,藍的構成》(其實還有黑白灰)已然成為了壹個經典logo,在時尚界和建築界縱橫多年,也曾在多年以前踏足UI界,只不過最後隨著某些品牌壹起銷聲匿跡了。下圖是曾經微軟公司為手機系統設計的界面,配色和布局基本是仿照《黃,紅,藍的構成》來設計的,用戶可以根據需要移動模塊進行布局。

雖然這個設計被微軟放棄了,但是,本頭認為這種蒙德裏安式的設計理念不應該被放棄,在移動設計已經完成了壹個擬物,扁平,輕擬物循環之後,蒙叔重返戰場的時刻終於到了!

大家千萬不要小看這幅《黃,紅,藍的構成》,事實上,許多朋友在看到這幅畫時都會產生“什麽鬼,勞資也能畫”的傲慢心態,為了消除這種心態,我們近距離觀賞壹下這幅作品。

在距離足夠近的情況下,我們可以看到這幅畫的每壹個色塊都是突出畫面的,並且在不同平面上,而分割這些色塊的黑線看起來就像鋼條壹般堅硬,色塊甚至被勒出了壹條毛邊。所有這些細節,都是非常難臨摹的。

回到這幅畫本身,蒙叔看似在畫格子,其實他畫的是對立與平衡,他讓三原色(紅黃藍)和三非色(黑白灰)形成對立,將畫面分解到極致。我們可以看到,這幅畫中沒有任何壹個部分是完全對稱的,卻能讓觀者同時能感受到壹種精神上的平靜和宇宙間的平衡。這些特點都和我們現在溫和平淡的設計截然不同。

最後

新造型主義是在新印象主義,立體主義和抽象藝術之後出現的,它吸收了之前流派的特點並繼續進化,才有了現在我們所看到的蒙德裏安,那麽對應到現在,我們如果想跳出擬物,扁平,輕擬物這個循環,也許可以借助蒙德裏安的藝術,找到新的突破口,在界面,海報,動態圖形等設計領域創造壹個全新的風格,讓《黃,紅,藍的構成》重新引領設計圈潮流,而看到這篇文章的妳,也許就是設計界的蒙德裏安。

如何從零開始學習圖標設計

想要學習圖標的制作,需要學習圖標設計的方法以及工具,那小小的圖標其實中間應該包含了很多設計知識。壹組的圖標需要滿足產品特點和風格,而且需要有辨識性,整體需要保持統壹有需要有稍許區別,讓人能夠看到圖標就能夠了解點擊圖標後的功能。

圖片來源:阿多比設計學院學生作品

壹、設計圖標的工具

可以設計圖標的工具很多,我們選擇PS和AI,去學習壹下這兩款設計工具如何使用。

1、

PhotoShop

如果是初次接觸PS,那我們需要了解PS的基礎用法,所以下面我們會從PS界面,基本設置,新建文件,視圖操作、保存,導出,移動工具去帶大家壹步步了解PS。讓大家能夠熟悉PS工具在平面設計中的常用功能及具體用法,能夠使用PS進行基本的圖片處理。

打開PS工具,簡單了解界面的組成部分以及工具的作用。然後再去了解PS常用功能及具體用法,比如圖層關系及應用、填色、魔棒摳圖、選區和復制、鎖套和羽化、去汙點工具、修補工具、液化效果_⑹嫡健⑽淖(字符和段落)、形狀裁剪、變形。

當了解PS基礎功能後,需要進壹步了解圖層關系、摳圖、鋼筆工具,橡皮工具,吸管工具,畫筆工具等常用工具、蒙版、濾鏡,從而熟悉圖層樣式,具備版式排版應用、海報合成設計的能力。色階、對比度、曲、色相飽和度、色相平衡、調色融合案例、剪切蒙版、混合模式、圖層樣式1、圖層樣式2、濾鏡效果。

2、

AI

工具的使用最好的方法不是給出大段的文字描述,介紹每個功能,而是找具體的實例去操作,從實例的操作去學習該軟件的功能。我們通過以下幾個實例去簡單講講AI的使用方法,了解AI的基本操作、AI復制、旋轉、轉換矢量圖、AI的分割、剪切蒙版、平滑、擴展、AI路徑文字、效果、形狀生成器、AI漸變、立體字、AI二方連續、四方連續等。從而達到熟練結合應用PS和AI工具對素材進行處理,根據要求完成3D效果、混合效果等各種特殊效果的設計。

二、

制作圖標的視頻教程

掌握了設計工具,那我們來簡單分享幾個不同風格的圖標,去看看這些風格的圖標應該如何制作呢?

1、剪影圖標

剪影圖標大多數是單色表現,當然也有雙色圖標。剪影圖標簡潔大方、高度提煉出圖標的意義,能夠通過最簡單的線條的表現出該圖標代表的作用。看似簡單的剪影圖標,其實考驗了設計者對於產品需求的高度提煉,突出理性與感性在功能傳達上的邏輯思維。

2、扁平圖標

扁平化設計風格在APP的設計中常常都能看到,那圖標也不例外。所以學習扁平化的設計風格有很高的通用性,在平時設計工作中也會經常遇到。那扁平化風格其實是從iphone開始流行起來,其特點就是所有元素的邊界都幹凈利落,沒有特效、沒有過多的裝飾效果,組成元素簡單,能夠直觀的傳達信息。

3、臨摹圖標

都說學習圖標設計最好的方式是先臨摹,那我們選擇毛線圖標、毛球圖標和播放器圖標去看看,這類的圖標是如何設計出來的呢。

毛線圖標和毛球圖標是兩種圖標的表現形式,毛線型的圖標繪會將毛線針織的壹針壹線體現在設計中,有中溫暖和溫馨的感覺。如果毛線的質感運用得恰當,會讓設計出彩,那毛球圖標也是壹樣。雖然這類的圖標實用性較小,但是了解壹下增加壹下自己的設計知識儲備。

4、擬物圖標

雖然現在大多數應用都是扁平化發展,但是流行是個圈,擬物化風格又在悄悄開始流行起來了。想必UI設計師們都能感受到“新擬物風格”這股風現在刮的多麽兇猛了。那我們通過擬物話筒圖標、擬物籃球圖標、擬物傘、水滴圖標、擬物甜甜圈圖標的學習去緊跟這個流行趨勢吧。

三、圖標網站

學習的過程匯總需要大量的臨摹素材或者是靈感來源,在這裏分享幾個圖標類的網站。

1、阿裏巴巴矢量圖標庫

:國內功能很強大且圖標內容很豐富的矢量圖標庫,提供矢量圖標下載、在線存儲、格式轉換等功能。

圖片來源:阿裏巴巴矢量圖標庫

2、IconStore:

是壹個提供壹流的免費圖標包素材的站點,匯集了很多優質的icon素材。

圖片來源:IconStore

3、Flaticon:

圖標設計豐富。

圖片來源:Flaction

4、MaterialDesignIcons:

包含常用的圖標,如用於媒體播放、通訊、內容編輯、連接等等。

圖片來源:MaterialDesignIcon

5、LogoMaker

圖片來源:LogoMaker

除了以上圖標設計網站,優秀的圖標設計網站還有

icons8、iOS11IconPack、IconsMind、IconStore、iconfinder、Icons|FontAwesome、徽標實驗室-測試您的徽標、標誌情報局-全球LOGO新聞和品牌設計趨勢權威媒體(LOGONEWS)、SimpleIcons

等。

圖片來源:阿多比設計學院學員作品

設計圖標,獲取靈感最快的方式還是手繪,所有圖標的初稿可能都來源於圖紙,再通過電腦制作反復打磨出符合產品特色的終版圖標。想要做出完美的圖標實際還是很困難的,這不僅需要設計的經驗還需要很高的圖形處理能力、想象力和邏輯思維。

圖標是人機交互的重要組成部分,它具有高度的視覺化和形象化等特征,就是說圖標設計師用設計的圖標去抽取表達產品的功能、動作的寓意以及實現。因此,

它承載著向用戶傳遞交互信息的任務,促使用戶正確認知從而實現正確的操作。

所以小小的圖標背後有大大任務,希望以上圖標學習的內容能夠帶妳了解入門圖標設計,也希望妳在今後的工作中能夠設計出優秀的圖標。

這6種常見的插畫海報風格妳知道嗎?

2020年可以說是插畫的天下

曾感動無數人的《熱幹面好久不見》

到最近的各種節日品牌海報

都能見到插畫的身影

那插畫常見的風格有哪些妳知道嗎?

小A將通過這篇文章

帶大家了解壹下插畫海報的常見風格!

扁平風格插畫主要由色塊構成,造型幾何化,外輪廓光滑,信息更加直觀,能夠讓人壹眼看上去就知道界面所傳達的信息。

扁平化的界面也能夠更好地實現畫面的轉化,網頁加載得更快,因此,扁平風格插畫被廣泛應用於各個領域。

描線風格,是在扁平化風格之上的延伸。

在扁平化元素中添加外輪廓和描邊,描線插畫的外輪廓加上描邊,相對於扁平化風格來說,更加地立體,可愛,往往會用在海報、引導頁面、logo等之中。

肌理風格插畫也叫做顆粒噪點風格,是扁平化風格的又壹個分支,將頁面疊加顆粒肌理,呈現出壹種磨砂質感,有點像沙畫的感覺,但又比沙畫細膩。

主要表現形式是運用大量色塊的表現,元素單壹幹凈,肌理常疊加在元素的高光及陰影處,通過顆粒感來增加畫面中的細節,畫面過渡自然,立體生動,畫風輕松隨意。

浮世,佛語裏是指“繁華又空虛的人世間”,浮世繪是將人世間的浮沈聚散不定地用繪畫的形式表現出來。

浮世繪畫風以傳統版畫為基礎,強調線條及色塊的平塗,色彩艷麗,以鳥、魚和海浪等為主要表現形式。

MBE插畫是由Dribbble的壹位設計師創造的風格,采用黑粗線條描繪元素,除去畫面中不必要的元素,色塊有明顯的區分,圓潤可愛。和小元素配合,常用於引導頁、啟動頁、logo等。

水彩插畫是近幾年比較流行的壹種畫法,簡單的線條加上溫和的色彩,寧靜自然,線條簡單隨意,水彩插畫的創造性特別強,既能夠表現寫實、抽象、魔幻等各種風格。

插畫是我們在生活中最常見的設計元素之壹

近幾年逐漸成為海報設計的主流

不同風格的插畫風格帶給人們不同的視覺感受

妳更喜歡哪壹種呢?