2022-06-30 分類: 網(wǎng)站建設(shè)
對于移動端APP
而言,圖標始終還是最重要的「門面」,它直接關(guān)聯(lián)著產(chǎn)品的品牌價值,圖標是否具備良好的可用性,將會直接影響到品牌和產(chǎn)品本身。圖標設(shè)計的講究很多,而
APP 圖標這種牽一發(fā)而動全身的東西更加講究。
今天,就分享一組圖標設(shè)計的方法和技巧。
通常,用戶一次仔細審視 APP 的圖標是在 App Store 和 Google Play
這樣的軟件商店和某些第三方推薦文章當中,相比于在界面中使用的功能性圖標而言,APP
圖標需要承擔更加廣泛的責任:不只要具備品牌本身的氣質(zhì)和元素,還要能夠體現(xiàn)這個數(shù)字產(chǎn)品本身的功能和特質(zhì),視覺上能夠在同類的設(shè)計當中脫穎而出,在手機主界面的程序列表中還得足夠抓人眼球,易于識別。對于這樣一個小小的圖標而言,要求一點都不少,不是嗎?(對于圖標設(shè)計師而言,這個要求同樣很高了!)
真正出彩的 APP 圖標,從來都不是上手就做的,動手之前的基本工作做的有多充足,開始著手設(shè)計的時候才有底氣,才有后面出彩的結(jié)果。
△ Lion 瀏覽器
1. 一件事:從背景信息搜集開始
在給一個 APP 設(shè)計圖標的時候,最重要的是什么事情?是圖形和色彩嗎?這當然重要,但不是最重要的。隨后我們會講到這個部分,但是給 APP
設(shè)計圖標的時候,這不是起點。先應(yīng)該了解的是產(chǎn)品背后公司的氣質(zhì)、團隊的背景、產(chǎn)品的功能,而不是直接設(shè)計。
了解這個圖標所涉及到的 APP
的業(yè)務(wù)組成和整體架構(gòu),詢問團隊相關(guān)的營銷策略和內(nèi)容,包括價值主張,目標受眾,市場特征,定價策略,這些東西確定了產(chǎn)品本身給人的感覺,應(yīng)該有的定位,這些東西都和設(shè)計息息相關(guān)。沒有做足夠深入的背景調(diào)研,就只能閉著眼睛畫圖了,這很難讓
APP 圖標真正貼合產(chǎn)品,發(fā)揮功用。
企業(yè)和產(chǎn)品本身的狀況和數(shù)據(jù)對于設(shè)計的重要性,怎么強調(diào)都不算過分。認真搞定這種準備工作,絕對是磨刀不誤砍柴工。
2. 熟悉標準:仔細研讀設(shè)計規(guī)范
雖然在圖標的設(shè)計上,創(chuàng)意和想法并不受限制,但是在任何平臺上,都有著相對清晰的設(shè)計規(guī)范,它們是需要設(shè)計師嚴格遵守的。設(shè)計規(guī)范讓圖標在一個范圍內(nèi)和其他的圖標在視覺上保持著足夠的協(xié)調(diào),設(shè)計師可以在規(guī)范范圍內(nèi)讓圖標更加「出彩」,而不是「突?!埂?在 Android 平臺和 iOS
的設(shè)計規(guī)范中,對于圖標的設(shè)計和使用有著非常清晰的說明,從配色到尺寸大小,包括樣式和具體使用場景。請盡量遵循圖標設(shè)計的技術(shù)規(guī)格和設(shè)計建議,因為許多問題和障礙是設(shè)計規(guī)范的制定者已經(jīng)考慮清楚了,遵循規(guī)范能夠讓你的設(shè)計繞過很多坑。
3. 選對工具:大家通常用這些軟件
通常情況下,最終輸出的圖標會使用 PNG 格式,不論你選擇什么樣的工具,至少要能夠輸出PNG
格式的圖標。當然,這只是選擇軟件工具過程中很小的一個條件。目前,絕大多數(shù)的設(shè)計師都會選擇時下最常見、接受度高的專業(yè)軟件,其中幾個甚至就是行業(yè)標準本身:
Adobe Illustrator CC ,也就是常說的 AI,是的矢量設(shè)計工具之一,歷史悠久。
Adobe Photoshop CC,是目前使用范圍最廣也是的位圖編輯軟件,無論是制作光影還是陰影效果,都非常的稱手。
Sketch 是一款有著友好界面和豐富插件的矢量圖形編輯和
UI設(shè)計軟件,對于復(fù)雜的設(shè)計它可能不是的選擇,但是拓展性足夠強大,許多功能都是基于現(xiàn)代的 UI 和移動端的設(shè)計來開發(fā)的。
Affinity Designer 是矢量繪圖軟件中的新貴,有著足夠干凈的 UI,非常適合初學者。
4. 注意細節(jié):簡約而富有凝聚性
在設(shè)計圖標的過程中,記得隨時審視圖標,看看是否缺少一些關(guān)鍵性的信息,關(guān)鍵性的元素是否缺失了,是否有多余的東西。眾所周知,APP
的圖標被設(shè)計出來之后,會出現(xiàn)在不同的場合,大小也不盡相同,隨著大小尺寸的變化,有些信息會變得不夠顯著,擁有太多細節(jié)的圖標會在縮小的時候顯得非?;靵y,所以將過多的文本和圖片細節(jié)融入到
APP 圖標當中,是非常沒有必要的。
簡約的圖標設(shè)計不僅僅是一種風格上的選取,它在功能和體驗上的優(yōu)勢也非常的明顯。不要指望將大量的隱喻和內(nèi)容都包含在同一個圖標當中,抓住最主要的概念和想法,并且用清晰的輪廓、簡單的元素來呈現(xiàn)它。至少絕大多數(shù)大型企業(yè)和優(yōu)秀的團隊都傾向于使用直截了當?shù)脑O(shè)計。
5. 結(jié)合品牌:記得考慮品牌風格指南
每個品牌都有著獨特的設(shè)計,從配色方案到細節(jié)元素的樣式,通常都有著相對明確的定位。品牌風格指南在絕大多數(shù)的品牌當中,已經(jīng)具備了非常明確的說明文檔。為了讓
APP 的圖標和品牌的聯(lián)系足夠清晰,參考品牌風格指南來進行設(shè)計,這樣確保用戶在看到 APP 的一眼就能夠從視覺上與品牌本身構(gòu)成關(guān)聯(lián)。
△ Foxygenic app icon
6. 艱難取舍:讓你的圖標替APP發(fā)聲
當你想到電子郵件的時候,你的腦海當中想到的一個意象是什么?是信封,對嗎?那么,當你在蘋果的 App Store
中搜索郵箱的時候,會發(fā)現(xiàn)一大堆的信封樣式的圖標,各種配色和風格都有,不一而足。
一方面,使用大眾所熟知的意象來設(shè)計圖標,確實非常成熟,被廣泛的認知,大家非常容易理解。而這種設(shè)計策略還有另外一面:類似的設(shè)計意味著激烈的競爭。這件事情可能是設(shè)計師在設(shè)計圖標的時候,所面臨的大的挑戰(zhàn):設(shè)計師需要在原創(chuàng)性和功能性之間,做艱難的取舍。
△ Elephun app icon
7. 知己知彼:仔細審視競爭對手的設(shè)計
留出足夠的時間來對競爭對手進行調(diào)研,了解競爭對手的功能,APP的設(shè)計,圖標的構(gòu)思,這樣可以讓設(shè)計師足以排除已有的設(shè)計,在營造獨特性上獲得思路,避免作出和競爭對手相似的設(shè)計,降低風險。
有些甲方喜歡使用和競爭對手相似的元素,這同樣有其優(yōu)勢在,因為相似甚至相同的元素確實會讓一些用戶面對這個新的 APP
的時候,產(chǎn)生信任感和同理心。但是和之前所提到的很多問題一樣,這需要設(shè)計師來取舍,或者控制中間的程度??雌饋硖^相似,用戶會視之為山寨和跟隨者,缺乏獨特性,很容易讓人在使用過程中失去信任,甚至完全放棄。
8. 開始設(shè)計:選擇正確的色彩和展現(xiàn)形式
終于到了這個熟悉的環(huán)節(jié)了。優(yōu)秀的配色和有趣的圖形,確實能夠讓圖標在視覺上脫穎而出。在選擇色彩這個環(huán)節(jié),很多設(shè)計師都很容易收不住手,許多色彩擠壓在小小的圖標當中,會讓圖標變得像現(xiàn)代藝術(shù)品一樣。這個時候,需要在已經(jīng)限定的色彩范圍內(nèi)(品牌用色),結(jié)合色彩心理學,來構(gòu)建圖標的色彩體系。
在紙上繪制圖標的原型,探索基本的想法和構(gòu)圖,是非常有效的手段,無論你會不會手繪,這個過程都會讓你的設(shè)計過程更加順暢,很多創(chuàng)意和想法,會在紙和筆的摩擦中,逐漸誕生,這一點,是許多數(shù)字軟件都無法替代的。
此外,運用基本的幾何圖形(圓形、方形、三角形等)來創(chuàng)建圖標的基本框架,非常有用。請記住,任何復(fù)雜的圖標都是在簡單的圖形的基礎(chǔ)上創(chuàng)建出來的。
△ App icon forApp Shack
9. 多做檢驗:繞不過的實際測試
無論你的 APP
圖標出現(xiàn)在什么地方,你都希望它看起來是非常不錯的,對吧?所以,接下來繞不過的環(huán)節(jié),就是要在不同的場合、不同的地方測試圖標的設(shè)計,是否有足夠的對比度,是否看起來足夠清晰,是否能夠融入相應(yīng)的場景,是否貼合品牌的氣質(zhì),等等。
檢查不同尺寸的 APP 圖標,主要注意看小尺寸的圖標是否可以看得清,識別度如何,大尺寸的圖標是否有不恰當?shù)脑O(shè)計;
使用不同的背景來查看APP 圖標,看看圖標在不同色彩、樣式的背景下,是否有足夠的對比度;
了解圖標在不同分辨率下的樣子;
不要只在 App Store 和 Google Play 下測試圖標的外觀,還可以將圖標放到隨機某個用戶的屏幕上,看看實際的效果。
文章題目:一個出彩的APP圖標都會經(jīng)歷這樣9個關(guān)鍵設(shè)計步驟
文章鏈接:http://redsoil1982.com.cn/news34/173484.html
網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián),是專注品牌與效果的網(wǎng)站制作,網(wǎng)絡(luò)營銷seo公司;服務(wù)項目有網(wǎng)站建設(shè)等
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容