本文作者為MartinLeBlanc,圖標(biāo)搜索引擎企業(yè)IconFinder的創(chuàng)始人。
今年6月舉行的蘋果WWDC大會(huì)上,蘋果推出了他們最新的移動(dòng)設(shè)備操作系統(tǒng)iOS7。從那之后,網(wǎng)絡(luò)上便充滿了各種關(guān)于iOS7的報(bào)道和討論。
我在無(wú)意間發(fā)現(xiàn)了一個(gè)由蘋果UX宣傳師MikeStern發(fā)布的文檔《優(yōu)秀iOS設(shè)計(jì)的實(shí)踐指南》。
這份指南的第一部分便是關(guān)于應(yīng)用圖標(biāo)的設(shè)計(jì),已經(jīng)蘋果對(duì)優(yōu)秀圖標(biāo)的定義。Stern在指南中列舉了6個(gè)在設(shè)計(jì)應(yīng)用圖標(biāo)時(shí)應(yīng)該注意的事項(xiàng)。
Stern首先解釋了開發(fā)人員為何應(yīng)該特別重視應(yīng)用UI和應(yīng)用圖標(biāo)的設(shè)計(jì):用戶不會(huì)根據(jù)應(yīng)用所使用的技術(shù)、API的數(shù)量或是應(yīng)用代碼有多優(yōu)秀等因素來(lái)評(píng)判一個(gè)應(yīng)用的好壞。用戶評(píng)判應(yīng)用好壞的標(biāo)準(zhǔn),是這個(gè)應(yīng)用能讓他們做什么、以及應(yīng)用給他們帶來(lái)的使用體驗(yàn)。用戶在使用應(yīng)用的時(shí)候,希望得到使用簡(jiǎn)單的使用體驗(yàn),并且希望應(yīng)用的設(shè)計(jì)十分買官。
制作優(yōu)秀應(yīng)用圖標(biāo)的六個(gè)技巧
很多應(yīng)用開發(fā)人員在設(shè)計(jì)應(yīng)用的時(shí)候都在重復(fù)犯著一些錯(cuò)誤,而這些錯(cuò)誤也成了將用戶拒之門外的罪魁禍?zhǔn)住6愀獾膽?yīng)用圖標(biāo)是應(yīng)用無(wú)法吸引用戶的3個(gè)最重要的原因之一。
通常情況下,應(yīng)用的圖標(biāo)是用戶對(duì)應(yīng)用的第一印象。在圖標(biāo)設(shè)計(jì)上,你必須保持高水準(zhǔn),并且與眾不同。下圖中,所有應(yīng)用都是相機(jī)應(yīng)用,可以看到大部分應(yīng)用都使用了相機(jī)鏡頭的圖像來(lái)制作圖表,而Path的圖標(biāo)卻并沒(méi)有這樣做,他們依靠這種方式將自己與其他應(yīng)用區(qū)別開來(lái)。
當(dāng)用戶在AppStore中看到應(yīng)用的圖標(biāo)時(shí),他們就會(huì)根據(jù)看到的圖標(biāo)來(lái)推測(cè)應(yīng)用的使用體驗(yàn)。如果圖標(biāo)看上去很優(yōu)美精致,用戶就會(huì)下意識(shí)的認(rèn)為這個(gè)應(yīng)用也能夠給他帶來(lái)優(yōu)秀的使用體驗(yàn)。
優(yōu)秀的應(yīng)用圖標(biāo)應(yīng)該有什么特性?首先就是美觀,其次更重要的,就是要有辨識(shí)度。
技巧1:形狀獨(dú)特
以下四個(gè)圖標(biāo)各不相同,有的使用了大量的顏色,有的使用了梯度顏色。但是它們都有一個(gè)共同點(diǎn),那就是使用了簡(jiǎn)單的形狀。這種設(shè)計(jì)能夠讓用戶立即記住這個(gè)應(yīng)用。
技巧2:謹(jǐn)慎選擇顏色
要限制應(yīng)用顏色的色調(diào)。使用1-2個(gè)色調(diào)的顏色就足夠了。顏色過(guò)多的圖標(biāo)不容易吸引用戶。
技巧3:避免使用照片
不要在圖標(biāo)設(shè)計(jì)中使用照片。Sipp的應(yīng)用就是一個(gè)很好的例子:
可以看出,當(dāng)使用酒杯的照片作為應(yīng)用圖標(biāo)時(shí),會(huì)給用戶簡(jiǎn)陋的感覺(jué)。而在經(jīng)過(guò)設(shè)計(jì)后,一種優(yōu)雅感會(huì)讓用戶對(duì)這個(gè)應(yīng)用產(chǎn)生興趣。
技巧4:不要使用太多文字
圖標(biāo)中不出現(xiàn)文字,是最理想的情況。應(yīng)用中只應(yīng)該出現(xiàn)Logo,而不要將應(yīng)用的全稱添加進(jìn)去。請(qǐng)仔細(xì)觀察Ness、Pocket、Vine、Snapguide和Pinterest這些應(yīng)用的圖標(biāo)設(shè)計(jì),如果將應(yīng)用名稱添加到圖標(biāo)中,會(huì)給人一種凌亂的感覺(jué)。
技巧5:讓圖標(biāo)內(nèi)的元素變得精致
Paper、SquareWallet、1password和LifeKraze等應(yīng)用的圖標(biāo)在這一點(diǎn)上做的都很優(yōu)秀。就連SternMike都表示不知道這些應(yīng)用的圖標(biāo)是如何做到如此精致的,他稱這些圖標(biāo)設(shè)計(jì)已經(jīng)達(dá)到了圖標(biāo)設(shè)計(jì)的最高水平。
技巧6:創(chuàng)意
Routesy, Hipstamatic, Evernote Food和Brewski Me等應(yīng)用圖標(biāo)的設(shè)計(jì)都是創(chuàng)意十足的例子。
額外提示:對(duì)圖標(biāo)進(jìn)行測(cè)試
在你制作了一個(gè)圖標(biāo)之后,不要忘了在各種顏色的壁紙上測(cè)試圖標(biāo)的顯示效果。另外也不要忘了將你的圖標(biāo)放在文件夾中測(cè)試一下顯示效果。最后,在用戶的設(shè)備上,圖標(biāo)會(huì)以不同尺寸出現(xiàn),例如在AppStore中,圖標(biāo)的尺寸最大;在桌面上,圖標(biāo)的尺寸會(huì)縮小;而在通知欄中,圖標(biāo)的尺寸最小,你需要確保你的圖片在所有尺寸下看上去都很舒服。
優(yōu)秀設(shè)計(jì)案例:Turnplay
著名的圖標(biāo)設(shè)計(jì)機(jī)構(gòu)Ramotion設(shè)計(jì)了Turnplay應(yīng)用的圖標(biāo),而最終的效果展示了Ramotion的設(shè)計(jì)功力。Turnplay是一個(gè)音樂(lè)播放器應(yīng)用,其UI模仿了老實(shí)的唱盤播放機(jī)。
Ramotion在最開始設(shè)計(jì)這個(gè)應(yīng)用的圖標(biāo)時(shí),自然而然的想到了使用唱盤播放機(jī)的樣式。下圖就是在設(shè)計(jì)初期階段Ramotion的設(shè)計(jì)師們用鉛筆手繪的草圖,可以看出即使在這些草圖中,也有著很多的細(xì)節(jié)。由此我們可以看出Ramotion這家設(shè)計(jì)公司對(duì)細(xì)節(jié)的追求,即使是在構(gòu)思階段也會(huì)注意細(xì)節(jié)。
在這些草圖中,很多都嘗試將代表應(yīng)用名稱的字幕“T”放在圖標(biāo)設(shè)計(jì)當(dāng)中,而細(xì)節(jié)方面,他們則試圖在唱盤上勾勒出指紋的圖案。最終他們采取了以下的設(shè)計(jì)方案,簡(jiǎn)單的外邊框,中間是唱盤播放器的轉(zhuǎn)盤。
如果你觀看了這個(gè)圖標(biāo)的全部設(shè)計(jì)過(guò)程,你一定會(huì)有所收獲。如果你對(duì)此感興趣,可以點(diǎn)擊這里觀看這個(gè)圖標(biāo)的設(shè)計(jì)全過(guò)程,但是你需要擁有蘋果開發(fā)人員賬號(hào)。
(via TNW 譯/快鯉魚)
推薦閱讀
Jolla 結(jié)束 Sailfish OS 手機(jī)的首批預(yù)訂,數(shù)字或不理想【快鯉魚早報(bào)】
【 Jolla 結(jié)束 Sailfish OS 手機(jī)的首批預(yù)訂,數(shù)字或不理想】出自 MeeGo 原班人馬的芬蘭創(chuàng)業(yè)公司 Jolla,宣布 5 月 20 號(hào)開始的 Sailfish OS 手機(jī)預(yù)售活動(dòng)正式結(jié)束。>>>詳細(xì)閱讀
本文標(biāo)題:糟糕的應(yīng)用圖標(biāo)是應(yīng)用無(wú)法吸引用戶的3個(gè)最重要原因之一!蘋果教你6招
地址:http://www.brh9h.cn/a/guandian/yejie/20130822/284388.html