詳細解析APP應用圖標的36個設計方法

2022-07-14    分類: 網(wǎng)站建設

應用圖標的設計表現(xiàn)形式很多,本文總結了36種圖表設計形式與你分享,希望能夠對你有所啟發(fā)。

當我們決定要去App Store、Google Play這樣的應用市場下載某個App應用時,首先映入眼簾的便是Icon,即應用圖標。

一個App應用圖標設計的美感與吸引力,決定了用戶對產(chǎn)品的第一印象。一個有吸引力的APP應用圖標,可以讓用戶愿意去了解你,下載你的App。

通過分析大量的應用圖標,結合自己的專業(yè)認知,總結了以下設計方法。

方法論描述僅代表個人認知經(jīng)驗,設計的方法有很多種,以下僅為拋磚迎玉,希望大家能找到適合自己的方法。

一. 中文字體

1. 單個字體設計

提取產(chǎn)品名稱中最具代表性的獨立文字,進行字體設計。通過對筆畫及整體骨架進行設計調(diào)整,以達到符合產(chǎn)品特性和視覺差異化的目的。作為國人對漢字的敏感度,這樣的設計形式大大降低了用戶對品牌的認知成本。

優(yōu)點:擁有特征性的字體設計可以一目了然的傳遞產(chǎn)品信息,讓用戶在自己的手機桌面上快速找到應用所在。如支付寶、網(wǎng)易郵箱大師、知乎等應用圖標,識別性很強。

獨立文字的提取難度較大,只能應用于產(chǎn)品名稱中有特征性含義的產(chǎn)品,如果提取不當很容易達不到市場差異化,與很多相同字體混淆在一起,干擾用戶對產(chǎn)品的記憶。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

2. 多個字體設計

多個字體設計通常為產(chǎn)品名稱直接運用在設計中,如有道、閑魚、當當、小紅書等。多個字體設計需要注意的是整體的協(xié)調(diào)與可讀性,一排出現(xiàn)兩個漢字屬于比較理想的可讀范圍,極限值為3個漢字并排,最多兩行為宜。

由此推算,適合運用字體作為應用圖標的產(chǎn)品名稱最多6個字為宜,超出這個數(shù)量,將會大大降低用戶對產(chǎn)品的識別能力。

優(yōu)點:可以更加直接的告知用戶產(chǎn)品名稱,便于品牌推廣,減少用戶的記憶成本。

對產(chǎn)品名稱有一定限制因素,以1~4個漢字為,超過6個漢字組合將會影響用戶的識別能力。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

3. 字體加輔助圖形組合設計

為了突出產(chǎn)品特有的氣質和屬性,通過字體與輔助圖形組合來烘托這樣的氛圍也是設計方式之一。如頭條字體和文章剪影圖形組合形成內(nèi)容豐富的氛圍,利用紙張折痕的效果突出文藝氣質,購物袋的圖形運用烘托購物的氛圍等等。

優(yōu)點:相比單純的文字設計,適當輔助一些帶有產(chǎn)品特性的圖形,可以更加靈活的突出產(chǎn)品氣質和屬性。

圖形運用不當容易對字體信息的傳達造成干擾,需要在字體設計比重和圖形難易度之間做好權衡。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

4. 字體加幾何圖形組合設計

幾何圖形的運用可以增加圖標的形式感,如矩形與字體設計組合可以強調(diào)局部信息;圓潤的形狀可以使圖標風格更加活潑有趣;三角形的運用有一定的引導性。

優(yōu)點:幾何圖形的運用可以增加應用圖標的形式感和趣味性。

常用的幾何圖形形式單一,難以形成獨有的視覺差異。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

英文、數(shù)字、特殊符號

5. 單個英文字母設計

英文字母設計通常是提取產(chǎn)品名稱首字母進行設計,由于英文字母本身造型簡潔,結合產(chǎn)品特點進行創(chuàng)意加工,很容易達到美感和識別性兼?zhèn)洹?/p>

優(yōu)點:利于設計師發(fā)揮,很容易做出具備美感的應用圖標。

很容易創(chuàng)意雷同,視覺差異化很難保障。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

6. 多個英文字母設計

多個英文字母通常是產(chǎn)品名稱全稱或幾個單詞首字母組合而成,在國內(nèi)也會提取漢語拼音和拼音首字母等方式進行組合。在進行字母組合設計的時候,需要考慮組合字母的識別性,單排字母為1~3個為宜,字母越多,識別性越低。

優(yōu)點:組合字母很容易形成獨有的產(chǎn)品簡稱,方便用戶記憶,如OFO,YY等。

熱門的組合字母容易雷同,對產(chǎn)品差異化形成挑戰(zhàn)。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

7. 字母加背景圖案組合設計

通過添加背景圖案,結合字母設計組合呈現(xiàn),既可以增加應用圖標的視覺層次感,也能豐富視覺表現(xiàn)力。這里需要注意背景圖案的色相和繁簡度的處理,需要和字母設計形成強對比,使信息傳達不受影響。

優(yōu)點:可以豐富應用圖標的視覺層次感和視覺表現(xiàn)力。

字母數(shù)量過多時,背景圖案的設計繁簡度會影響信息的傳達。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

8. 字母加圖形組合設計

字母加圖形組合設計應用比較廣泛,圖形分為幾何圖形和生活映象提煉的圖形。如酷狗音樂就是結合圓形組合而成,QQ瀏覽器則是與生活中云朵的提煉圖形結合而成。通過字母與圖形進行創(chuàng)意加工,可以使應用圖標視覺表現(xiàn)更加飽滿。

優(yōu)點:圖標視覺表現(xiàn)飽滿,對字母的設計要求相對較低。

如果選取的圖形為常用圖形,不易形成特征性元素。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

9. 數(shù)字設計

數(shù)字對于我們來說是非常敏感的,利用數(shù)字進行設計能給人親和力。由于數(shù)字的識別性很強,易于品牌傳播與用戶記憶。

優(yōu)點:自帶親和力,識別性強,易于傳播和記憶。

針對性較強,數(shù)字與品牌關聯(lián)性密合度控制較難。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

10. 特殊符號設計

特殊符號在應用圖標的設計案例中相對較少,由于符號本身的含義會對產(chǎn)品屬性有一定限制,所以針對性比較強。如「¥」符號可代表與錢財有關聯(lián)性的產(chǎn)品,無法運用在與此屬性無關的產(chǎn)品上面。

優(yōu)點:圖形特征明顯,自身有很強的屬性,可以很好的詮釋關聯(lián)的產(chǎn)品屬性。

圖形屬性針對性較強,獨立圖形無法在同類產(chǎn)品中形成差異化,需要結合產(chǎn)品特征進行組合設計。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

三. 圖形

11. 幾何圖形設計

幾何圖形的運用設計給人簡約、現(xiàn)代、個性、富有空間感等視覺感覺,從單個具象圖形到復雜的空間感營造,幾何圖形的表現(xiàn)形式非常豐富。

不同的形狀給人的情感表達不同,如三角形給人傳達個性、穩(wěn)定、現(xiàn)代、時尚等,添加圓角后又會更加親民、可愛。我們可以結合產(chǎn)品特征,合理的選擇適合的形狀圖形進行創(chuàng)意。

優(yōu)點:構圖簡潔,設計形式豐富多樣,不同的形狀和細節(jié)處理可以營造不同的氛圍。

過于簡約的形狀容易創(chuàng)意雷同,無法形成差異化,考驗設計師的圖形創(chuàng)意能力。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

12. 抽象圖形設計

通過提取品牌信息、產(chǎn)品服務、功能模塊等關鍵詞進行圖形創(chuàng)意,形成的圖形不屬于生活中大家常見的基本圖形,是對品牌進行高度提煉形成的抽象圖形。通過暗喻的形式傳達品牌文化和產(chǎn)品特點,品牌獨特性較強。

優(yōu)點:抽象圖形品牌獨特性較強,容易形成視覺差異化。

用戶認知記憶成本較高,品牌推廣難度較大。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

13. 動物剪影設計

動物剪影通常是提取動物外部輪廓進行單色填充,可以提取動物整體形象或者局部特征部位作為設計元素。這類應用圖標背景為單色或者漸變色,少量的會輔助一些圖形作為背景元素,動物采用單色填充,以白色填充居多。

優(yōu)點:單色填充的動物形象與背景對比強烈,整體視覺效果直觀醒目、簡潔大方。

常見的動物形象容易雷同,生僻的動物造型對用戶的認知能力有一定的挑戰(zhàn)。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

14. 其它剪影設計

除了動物剪影以外,生活中可以作為剪影設計的元素很多。如食物、工具、生活用品、學習用品、娛樂道具等等??梢元毩⑿纬杉粲皥D形,也可以根據(jù)產(chǎn)品特點進行創(chuàng)意加工,最終形成應用圖標獨有的造型圖案。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

15. 相同圖形重復設計

將相同的圖形進行有序的排列,排列形式有梯度漸變、等大均排、規(guī)律性重復、配色差異、大小錯落等。這樣的設計方式可以給單調(diào)的圖形增加層次感和構圖飽滿,有一定梯度漸變和規(guī)律性重復的圖形組合可以傳遞一定的韻律感和動感。

優(yōu)點:給單調(diào)的圖形增加層次感,也能增強整體的構圖飽滿度。

對于沒有特征性的圖形容易形成單調(diào)乏味。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

16. 正負形設計

正負形的設計在logo圖形設計中是比較常見的表現(xiàn)手法,運用在圖標設計中,以正形為底突出負形特征,以負形表達產(chǎn)品屬性。利用正負形進行設計,圖形設計感較強,正形與負形可以更加充分的表達產(chǎn)品特征與服務。

優(yōu)點:圖形設計感較強,可以更加充分的表達出產(chǎn)品特征與服務。

對圖形設計能力要求較強,正形與負形銜接必須順暢,不然無法清晰的傳達產(chǎn)品特征。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

17. 線形設計

線性設計風格的圖標給人簡潔輕快的感覺,線性設計的方式分閉合式和開放式,可以是一條連續(xù)的線條或者幾條線段組成。在有色背景上面線條通常反白處理,背景設計可以是單色、漸變色、其他輔助圖形設計等。

優(yōu)點:傳遞簡潔輕快的產(chǎn)品屬性,適合文藝、小清新、簡約風格的應用。

僅用于表現(xiàn)簡約的圖形,對于造型復雜的圖形將會影響識別度。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

18. 白色漸變圖形設計

白色漸變是利用白色漸變填充,不透明度100%到X%「X透明度在100%到0%之間」之間設置完成。白色漸變圖形具有空間感、質感,視覺效果較好,被廣泛運用在應用圖標設計中。

優(yōu)點:比單純的剪影圖形更具空間感和質感,傳遞更多的細節(jié)表現(xiàn)。

圖形本身僅為白色填充,必須在深色背景才能清晰的呈現(xiàn),不適合淺色背景。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

19. 彩色漸變圖形設計

彩色漸變是利用多種顏色進行漸變,比起白色漸變圖形,彩色漸變圖形的色彩表現(xiàn)更加豐富。多種顏色進行漸變銜接的時候要注意色相的對比,營造空間感。應用圖標的背景需要和圖形的色彩形成對比,的背景為白色或者淺色。

優(yōu)點:圖形色彩表現(xiàn)更加豐富細膩,圖標表現(xiàn)出更多的細節(jié)。

多種顏色的搭配色彩絢麗,色彩組合處理不當容易使圖標整體過于花俏,很難形成獨有的品牌色認知。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

20. 動物形象設計

動物作為圖標設計元素是比較常見的方式之一,動物給人的印象比較可愛,有助于加深用戶對產(chǎn)品的印象。動物的表現(xiàn)形式有剪影、線性描邊風格、面性風格等。

優(yōu)點:動物形象給人可愛的印象,有助于加深用戶對產(chǎn)品的印象。

常見的動物形象容易雷同,罕見的動物對用戶的推廣成本較高。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

21. 動物局部設計

利用動物局部進行圖形設計,可以讓元素特征更加明顯。比起展示整個動物形象,局部特征展示視覺表現(xiàn)力更強。

優(yōu)點:圖形特征元素更加明顯,視覺表現(xiàn)力更強。

動物局部的選擇需要擁有更加明顯的特征,否則無法正確識別動物形象。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

22. 人體局部設計

利用人體局部作為圖形設計元素,比較常用的有眼睛、嘴巴、手掌、頭部等。利用人體的元素進行設計,用戶對圖形的敏感度更強,易于傳播和記憶。

優(yōu)點:用戶對于人體局部元素創(chuàng)意的圖形敏感度高,容易形成記憶。

常用的局部特征容易雷同,必須從表現(xiàn)手法上面加以區(qū)分,挑戰(zhàn)設計師的設計能力。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

23. 卡通形象設計

卡通形象與動物形象容易混淆,因為很多卡通形象都是基于動物設計演變而來。這里單獨提取出來是為了歸類一些單純以動物外形為設計元素的表現(xiàn)手法。卡通形象設計在應用圖標的設計中是非常常見的,很容易對用戶形成記憶。

優(yōu)點:形象可愛、親民,易于用戶記憶與傳播。

卡通形象的設計難度較大,對設計師的要求較高。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

24. 卡通形象臉部設計

卡通形象臉部設計是通過只展示臉部信息來進行設計,以圖標整體輪廓作為臉部外形,突出卡通形象的表情特征。

優(yōu)點:卡通形象表情特征明顯,視覺沖擊力和圖標的識別性較強。

表情特征處理要求較高,處理不到位容易使整個形象呆板無趣。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

25. 擬人化圖形設計

通過對接近圓形或者構圖飽滿的圖形添加眼睛等元素,可以使整個圖形擬人化。給原本冰冷的圖形賦予其生命,擁有一定的情感表達,讓產(chǎn)品更加親民,更容易被用戶所接受和記憶。

優(yōu)點:使圖形更加情感化,更容易打動用戶,拉進與用戶的距離。

對圖形本身的造型要求極高,并非通用于大部分圖形。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

26. 從功能服務提煉圖形

為了更加清晰的傳遞產(chǎn)品的某項功能與服務,根據(jù)產(chǎn)品的功能服務提取元素進行圖形設計也是比較常用的表現(xiàn)手法,如計算器、日歷、導航等直接提取相關聯(lián)的圖形元素進行設計,一目了然的傳遞出產(chǎn)品信息。也可以從產(chǎn)品服務內(nèi)容入手進行提煉,如教育類產(chǎn)品,提取學士帽為元素進行設計。

優(yōu)點:能夠清晰直接的傳遞產(chǎn)品信息,減少用戶的認知成本。

相同功能的產(chǎn)品之間無法形成差異化,如日歷,很難讓用戶對某個品牌推出的日歷產(chǎn)生記憶。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

27. 擬物圖標設計

隨著扁平風格的盛行,擬物圖標的表現(xiàn)手法出現(xiàn)在少數(shù)產(chǎn)品和游戲類的產(chǎn)品中,如錘子推出的系列應用,依然保留著這樣的風格。在超質感擬物風格和抽象的扁平風格之間進行取舍,便出現(xiàn)了微質感的設計表現(xiàn)形式,也得到很多設計師的青睞。

優(yōu)點:光影與質感的處理使得圖標設計展現(xiàn)出更多的細節(jié),還原真實場景。

對很多剛入行的設計師來說設計成本較大,在如今快節(jié)奏的生活中使得整個產(chǎn)品不夠輕快。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

四. 色彩

28. 色環(huán)運用設計

圖形設計以環(huán)形構圖為主,配色為多種顏色形成如同色環(huán)一般,這樣的圖標設計構圖飽滿、色彩豐富,給用戶傳遞輕松、愉快、可愛、親和、熱情的產(chǎn)品形象。

優(yōu)點:構圖飽滿,色彩豐富,給用戶傳遞更加輕松愉快的體驗。

界面風格必須和圖標多彩的風格保持一致,界面配色的設計難度較大。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

29. 單色背景

單色背景的應用圖標非常常見,其顏色的選擇通常是品牌色為主,烘托出圖形的視覺表現(xiàn)。圖形的處理方式以反白、白色漸變、輔助色點綴等較為常見。

優(yōu)點:突出品牌色,便于圖形的視覺表現(xiàn)。

配色單調(diào),圖形的視覺表現(xiàn)形式較少,圖形配色需要結合背景色做出對比。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

30. 漸變色背景

漸變色背景的運用越來越受到設計師青睞,相對于單色的背景視覺表現(xiàn)力更加豐富,整體色彩給人通透的感覺。漸變色可以是雙色漸變,也可以是多色漸變,根據(jù)產(chǎn)品的氣質靈活的運用。

優(yōu)點:色彩的視覺表現(xiàn)力更加豐富,整體色彩給人通透的感覺。

漸變色的運用過多會使圖標整體花俏,對于配色「度」的把控需要注意。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

31. 文藝風格設計

文藝風格圖標設計配色清新、復古、簡約,適合帶有文藝風格類的產(chǎn)品。設計方向為簡約的圖形組合或者文藝風格的字體設計為主,圖標整體留白較多,配色簡約,白色背景居多。如果是深色背景則采用黑色、復古色為主。

優(yōu)點:圖形造型簡約,配色清新,文藝風格特征明顯。

這種風格僅適合特定的用戶群體和產(chǎn)品。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

32. 活動氛圍設計

在一些購物類產(chǎn)品中,經(jīng)常會對應用圖標進行特定的活動氛圍包裝。會保留原本的圖形面貌,進行整體的氛圍營造,以突出購物火爆的場景感。如即將到來的雙十一活動,很多平臺都進行相應的氛圍營造。

優(yōu)點:突出活動氛圍,營造購物火爆的場景感。

時效性較短,活動結束便恢復原貌。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

五. 板式

33. 對稱設計

受到傳統(tǒng)文化的影響,國人比較喜歡對稱設計,如古代建筑、生活器具、裝飾圖案等,對稱圖形帶給人的感覺是穩(wěn)重、安靜、平和、莊嚴、正式等。在應用圖標的設計中,對稱的運用是非常常見的設計手法,有左右對稱、上下對稱、斜角對稱等表現(xiàn)形式。

優(yōu)點:對稱形式歷史悠久,被廣大用戶所喜歡,構圖也比較飽滿穩(wěn)重。

對稱兩邊的圖形設計保持一致,可以充分利用對稱形成的負空間,讓圖形寓意更加豐富。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

34. 打破常規(guī)

設計初期我們需要學會對齊,設計排版整齊規(guī)整,隨著設計師設計功底的成熟穩(wěn)定,打破對齊也將體現(xiàn)出一位老司機的功底。在進行應用圖標的設計布局時,設計師為了突出產(chǎn)品的獨特性,會選擇打破常規(guī),也許會得到不一樣的視覺效果。

優(yōu)點:打破常規(guī),擁有獨特的視覺特征,傳遞給用戶不一樣的視覺體驗。

需要設計師更強的設計把控力,把握好圖標整體的形式感。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

35. 圓形的運用

圓形的運用在應用圖標的設計中非常常見,有圓形外圈的運用、整體構圖呈現(xiàn)圓形、圖形創(chuàng)意結合圓形進行創(chuàng)意加工、以圓形作為背景突出特征圖形等表現(xiàn)形式。圓形的設計構圖飽滿,表現(xiàn)形式更具親和力,被廣大用戶所喜愛。

優(yōu)點:可以將瑣碎的圖形規(guī)整,整體構圖更加飽滿,表現(xiàn)形式更具親和力。

圓形營造的構圖穩(wěn)重、平和,需要通過夸張的圖形來增強視覺沖擊力。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

六. 游戲

36. 游戲角色運用設計

游戲類應用圖標設計需要設計師具備較強的寫實圖標設計功底,設計方向主要有:游戲角色、純文字、道具或標識、明星頭像、輔助圖形或元素等。設計表現(xiàn)力需要顏色鮮艷、角色表情和動作夸張、設計精美有質感等。

一個好的游戲應用圖標需要設計風格和游戲內(nèi)畫風一致,視覺表現(xiàn)對玩家的吸引力直接影響到游戲是否吸量。

優(yōu)點:設計精美有質感,視覺沖擊力大,吸引用戶眼球。

缺點:設計功底要求較強,整體圖標的視覺表現(xiàn)力需要結合游戲整體風格,考驗設計師的綜合設計能力。

詳細解析APP應用圖標的36個設計方法,PS教程,思緣教程網(wǎng)

總結

應用圖標的設計表現(xiàn)形式很多,以上總結僅為個人所見部分,希望大家能發(fā)現(xiàn)更多的表現(xiàn)手法并加以總結歸納。設計的方法與技巧需要不斷的總結與分享,才能發(fā)現(xiàn)不足與進步的方向,希望能與同樣熱愛設計的朋友一起進步,做出美感與可用性兼?zhèn)涞脑O計作品。

新聞名稱:詳細解析APP應用圖標的36個設計方法
轉載源于:http://www.muchs.cn/news11/178411.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián),為您提供ChatGPT、App設計、網(wǎng)站收錄、微信小程序動態(tài)網(wǎng)站、企業(yè)建站

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉載內(nèi)容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉載,或轉載時需注明來源: 創(chuàng)新互聯(lián)

成都網(wǎng)頁設計公司