應用圖標的設計為什麼不傾向於使用半透明?

大部分消費者在購買智能機之後會把壁紙換成自己喜歡的樣子,以便使用手機的時候經常看到。但應用圖標會遮擋壁紙產生違和感。那麼為什麼似乎UI設計的人傾向於選一種儘可能和所有圖標融合的壁紙,而非把圖標繪製成半透明的呢?非常好奇,除了設計成本以外還有什麼考量?


這裡從圖形設計的角度來簡單說一下,一句話來表達就是不應該做最終呈現效果不可控的事。

圖標的基礎作用是表意、導向,所以造型、配色都是基於這一點出發,輔以美觀層面的考慮而來。試想一個本身或者大部分面積為高程度半透明的圖標在面對終端用戶千奇百怪品味各異的壁紙時,原先設定好的色彩節奏可能完全被破壞,我想對自己有要求的圖形設計師是絕對不會把這樣一個自己都吃不準的不穩定狀態的東西展現在終端用戶面前的。

引申一下這個話題,現在圖形界面設計由於瀰漫起平面化的設計語言,以前司空見慣的"投影"被多數盲從的圍觀群眾們無情拋棄,其實這是很不健康的。君不見 iOS Launcher 上的時鐘 icon 有時候還會因為用戶換了張黑色底的壁紙而只剩下一個錶盤的情況么?

BTW,來弄我 Vibe UI 的新 Launcher icons 大量採用了鄉村朋克風配色輔以鏤空半透明,真的醜死了,他們真的看不出來嗎?


圖標的最大功能就是標識性,越顯眼用戶越容易找到目標,開發者恨不得把圖標做成整個屏幕大來吸引用戶的眼球。

把圖標半透明則大大降低圖標的可視性,用戶也不願意在一堆模糊的圖標里找目標,為了外觀犧牲掉功能是不可取的。


就從 iOS 和 Android 兩個平台來講講吧。

  1. iOS 的圖標使用圓角矩形 (iOS 7 矩形四角處過渡並非圓弧) 的遮罩。所以,若圖標的圖像文件中有半透明的部分,會顯示一種底色。在 iOS Human Interface Guidelines 中也有明確規定,不能使用半透明。
  2. Android 的應用圖標使用半透明應該沒有技術和規範上的限制。實際上,應用圖標的陰影,也是帶有 Alpha 通道的,所以也許有些應用的圖標也使用了半透明的顏色。不過半透明的使用也並非很容易把握,若透明度太高,圖標本身的辨識性自然下降;若透明度過低,使用半透明的意圖可能便會變得不明顯,使用半透明的目的性就不強了。所以,這也許是半透明的圖標少見的原因。

在手機桌面上,主角是圖標而非壁紙,為了不遮擋壁紙而使用半透明的圖標是反客為主的做法。


哼。


我都是根據圖標換壁紙 不讓那些太花的壁紙影響圖標的美感 還有半透明的圖標不精緻 我見人用過這種主題 丑......


因為應用圖標對於APP的點擊率(CTR)來說,起著非常重要的作用。 就像相親一般,第一印象往往先於外表,如果長得不符合心中預期或穿著不講究,便會讓人不願交往。 應用圖標也是如此,因此在運營過程中我們要不斷的優化圖標,以期它可以在競爭對手中脫穎而出。所以一般很少是半透明的。
http://18nk.cn/vhM6/


很簡單,半透明的應用圖標在應用市場里無法吸引用戶的關注。下面我們來看看這篇文章。

8個方法讓你的應用圖標脫穎而出 - 蟬大師

蟬大師ASO優化團隊認為,應用圖標對於APP的點擊率(CTR)來說,起著非常重要的作用。 就像相親一般,第一印象往往先於外表,如果長得不符合心中預期或穿著不講究,便會讓人不願交往。 應用圖標也是如此,因此在運營過程中我們要不斷的優化圖標,以期它可以在競爭對手中脫穎而出。

視覺內容的重要性

隨著移動互聯網的高速發展,人們往往被各類各樣的信息與數量龐大的內容所淹沒。因此,人們的注意力也變得極難捕捉起來,但是可以確認的是,視覺內容廣告比書面內容廣告更重要。為什麼呢?因為它可以使信息更快的傳遞到大腦。

我們來分析一下用戶下載應用的幾種第一步驟。

1.尋找特定APP的用戶。 他們會在搜索框中直接輸入品牌詞,通常很快就會找到。

2.尋找一個特定類別的APP。 他們通常在應用商店瀏覽類別,直到他們找到一個似乎很好的APP。

3.用關鍵字尋找APP,他們正在尋找一個特定類型的應用程序,但心中卻不知道下載哪一個應用好。

我們將在這裡集中討論類型2和3。 當用戶在App Store尋找應用時,會向下滾動尋找APP,試圖找到一個最適合他們的期望應用。期間,他們首先看到的是APP圖標。 然後,他們看到APP標題。 當然他們也會看到應用評級。

主要的困難在於真正讓用戶對APP進行點擊,而應用圖標是用戶第一眼看到的APP信息,所以應用圖標能否吸引用戶從而促進用戶進行點擊就變得很重要了。那麼如何利用圖標獲得用戶的注意,然後吸引他們點擊下載APP呢?

一、簡單才是美

用戶喜歡通過最簡單的方式來獲得他們想要的APP,因此,APP圖標也需要易於理解。 因為APP在智能手機上顯示時,圖標相對較小。 如果它們太複雜,可能會混淆用戶,它不應該載入太多的內容,無需使用太多的顏色,一個或兩個主要的顏色應該就夠了。 簡單的圖標往往會比比複雜的圖標有更多的轉換。

例如,這2個圖標似乎太複雜,因為它擁有太多的內容,信息量龐大,導致用戶很難理解。

二、有邊框要比沒邊框要好

帶有邊框的圖標比沒有任何邊框的APP圖標更能影響用戶,很簡單,因為它能在APPStore中顯得與眾不同,此外當用戶下載APP在手機桌面後,有邊框圖標的APP較之其它APP也更為顯眼。所以,蟬大師建議您在應用程序圖標周圍放置一個漂亮的邊框,最好使用強烈的顏色或華麗的圖案。 這裡有一些例子:

最後一個是特別有趣的圖標,因為它的邊框創建了一個3D效果。 這個效果讓我想起了前不起寶馬做的一個畫風與上圖類似的h5廣告,據說寶馬的那個廣告引爆朋友圈了哦!

三、避免使用文本

APP圖標通常不包含任何文字或單詞,因為「一圖片勝千文」嘛。圖片相比於文字更使人容易理解,且不會產生混亂。在通過情況下,APP標題與應用圖標是互補的,所以我們又何必多此一舉,非要在應用圖標中包含文字呢?

這裡有一些負面的例子,圖標中含有太多的字元造成的混亂

四、慎用品牌標誌

有開發者可能會認為,應用圖標直接使用自己的品牌標誌會是一個很好的主意,但前題是開發者的品牌已被大眾所熟知,便具有很強的視覺識別性。可如果您的品牌標誌不是眾所周知的,蟬大師則不推薦使用。 其實這很好理解,如果圖標不能影起用戶的注意,那麼用戶有很大的可能直接跳過我們的APP。

五、平整和啞光

在iOS6上,蘋果的圖標有光澤效果。在開發者在APPStore提交應用時,有些開發者會選蘋果自帶的光澤效果,希望可以讓APP在用戶的手機桌面脫穎而出,可實際上,這樣做反而起到反效果,因為這個閃亮的效果容易與蘋果的默認圖標相同,後來在ios7上,仍然有許多圖標具有有光澤效果,這裡蟬大師ASO優化平台建議大家對APP的圖標不使用任何一種光澤效果,保持無光澤和平整就好了。

這裡是iOS6和iOS7蘋果的圖標之間的比較。

其實現在到了ios10以後,蘋果賦予了用戶更多更改圖標的許可權,比如用戶可以更改任何APP圖標的具體樣式,當然步驟會有點麻煩,而且ios10控制中心下方的4個圖標均支持3D Touch,比如在手電筒上可以設置亮度,在時鐘上設置定時器等。所以,開發者在選擇應用圖標時重點考慮的是其在APPStore的展現效果。

六、更新您的圖標

不時更新您的圖標非常重要。 例如,如果我們要為特殊場合或季節(春節,聖誕節,中秋節,夏天,冬天等等)創建特殊版本,這時我們要豪不猶豫地為APP圖標提供與新版本匹配的新外觀。

如果我們的應用有重要的新功能了,也應考慮更新圖標,因為原來的圖標可能無法清楚的表達與代表我們的新APP了。其實蟬大師認為,更新圖標時不一定要完全重新設計,我們從下圖的這個例子可以看出,這個APP的應用圖標隨著季節的變化而變化。

如果您使用重要的新功能更新應用程式,那麼也請更新圖標。 您可能想重新思考您的圖標,因為它可能不再足夠相關,無法描述或代表您的新應用。

可以看到其圖標非常的簡單,最重要的是,非常相似。 馬在每個圖標上都以相同的方式運動,唯一改變的是背景風景。

七、分析和比較您的競爭對手

在創建圖標之前,您可能需要檢查競爭對手他們在做什麼, 這是非常重要的,不同類型的APP,對於圖標的選擇也不一樣,所以可以大量查看競品的思路,這裡記住,不要抄襲!當然,有許多蹭量的APP會使用與知名APP應用圖標高度類似的圖標以欺瞞用戶,達到提高下載量的目的,但我們不建議大家這樣做,這樣做留不住用戶的,而且還壞了名聲。

通過查看競爭對手的圖標樣式,找到創意與靈感,然後提出完全不同於競品圖標的想法與改進建議,這樣我們就有可能在APP的圖標中領先競爭對手。

八、測試您的圖標

當我們準備好圖標後,不要認為我們的工作完成了,我們還需要找不同的人進行測試,讓他們反饋這個應用圖標是否有吸引力,是否好看。過程中,我們可以向他們展示各種應用圖標,但不告訴他們哪是個是我們自己的,然後問他們最喜歡哪一個應用圖標,以及為什麼。(有位朋友也是位開發者,他找到一群孩子來做測試,因為他認為孩子是最天真的,不會說假話。)

在測試應用圖標時,還要測試我們的APP圖標在不同顏色的壁紙中會有什麼樣的效果,因為現在的智能手機都是允許自定義背景的,只有在大量的測試後,才能確定應用圖標的使用。所以啊,雖然只是小小的一個圖標,但要玩得溜,開發者是需要花費許多精力的。


如果真做成您所謂的那種半透明,多半您又會罵「這些傻逼設計師做得圖標,一個都不好用!每次都要找好半天!」

忍不住再說一句,好多人連什麼是好的桌面背景都分不清!


推薦閱讀:

智能手機發展的今天,為什麼佳能和尼康不像索尼一樣生產手機鏡頭?
你有哪些成功戒除玩手機成癮的經歷?
華為和小米,誰勝算更大?
購買一款索尼手機應該注意什麼?

TAG:智能手機 | 圖標設計 | 用戶界面設計 | 圖標製作 |