CSDN移動將持續為您優選移動開發的精華內容，共同探討移動開發的技術熱點話題，涵蓋移動應用、開發工具、移動遊戲及引擎、智能硬體、物聯網等方方面面。如果您想投稿、尋求《近匠》報導，或給文章挑錯，歡迎發送郵件至tangxy#csdn.net（請把#改成@）。
在幾周前的那篇文章《談談白色應用圖標》（不可否認那篇文確實有一些指責說教的意味）引發的喧囂過去之後，筆者認為在設計優異的應用圖標（icon）方面，找出更有建設性的實用方案是很有必要的。本文講述了應用圖標的魅力，還有它的優化方式。這篇文章適用於所有人，包括新手與專家。
原文及視頻發表在 Net電子雜誌上，後被 appicontemplate.com網站轉載。下面是刪減更新後的版本，文末另外附有一篇演講。
在上面大約10分鐘的視頻中，筆者一一講述了應用圖標設計的5個主要方向，並附上了實際案例。其中包含了完整的故事、建議還有具體像素值，希望所有讀者——無論是剛入行的新手還是經驗豐富的老手都能從中獲益。如果想要了解更多，請繼續看下去，其中將會詳細分析「應用圖標設計的5個核心方向」，保證沒有廢話。
入門階段創建一個獨一無二且讓用戶每次看到產品時都能第一時間聯想到的圖形設計方案還是頗有難度的。一個美觀、可辨識、令人難忘的應用圖標能對應用的普及與成功產生巨大的影響。不過到底怎樣才能創造出一個「好的」應用圖標呢？甚至說，好的應用圖標到底指的是什麼呢？不用害怕，我已經總結了一些技巧與建議，來協助你解答這些問題，並指導你完成優異應用圖標的設計工作。
在創建圖標前，首先需要理解這一點：應用圖標到底是什麼，它到底有什麼用途。應用圖標正是產品的視覺錨點。你可以把它當作品牌的一小部分——不僅在視覺上需要有吸引力、與眾不同，理想狀況下甚至要能詮釋應用的核心本質。
現在「商標（Logo）」這個詞已經被用濫了， 應用圖標並非商標。當然，兩者均與品牌相關聯，而且都受到很多限制。提醒設計師注意的一個重要區別是：商標用在信箋抬頭與廣告牌等位置，是代表品牌的一個可縮放矢量圖塊。而圖標則經常是放置在一個方形畫布塊內，根據柵格進行個性化定製的輸出結果，除了美觀之外，還需要使用特定的尺寸與背景。兩者的實現方法與相關工具，還有完成的任務，以及是否成功的評判標準都不盡相同。
應用圖標打包了一系列不同尺寸的圖標
從實際的角度出發，在設計應用圖標時設計師創建的是一套不同尺寸的PNG文件——從29*29px一直到1024*1024px的圖片都有，並且需要與應用捆綁。在很多OS背景中，用戶在接觸你的應用時，首先會看到這套設計精巧的圖標——App Store或Google Play中，設置面板、搜索結果或主屏幕上都能看到它們的身影。
基本上任何能生成光柵圖形文件的應用都可用來製作圖標，不過較為常用的還是Photoshop、Illustrator和Sketch，還有提供精巧的PSD模板的免費工具，可以幫助新手快速取得進展。
上面是一個短視頻，演示了一個模板的使用方式
五個核心方面現在來看一下應用圖標設計中的一些最佳實踐案例。筆者將就「應用圖標設計的5個核心方面」一一予以討論，並對如何提高各個方面提出建議，同時展示一些實際處理中的案例。這些案例有很多都是建立在實際工作之上的，列舉出來並不是因為其中的處理方式就是最佳或唯一的，而是因為在筆者的實踐過程中，這些案例對總結經驗很有幫助。在瀏覽這些觀點時，嘗試想像你喜歡的圖標，試想在你的主屏幕上那些圖標又是如何踐行這些特質的。下面開始具體講述。
1. 可擴展性
應用圖標需要支持多種解析度，並且需要保證各個尺寸的清晰度
圖標最重要的其中一個方面就是可擴展性。由於在整個平臺的多個地方都有展現，且尺寸不同，因此保持其清晰度與獨特性非常重要。在App Store、Retina設備甚至是設置面板中，圖標都需要保持美觀。
將小小畫布塞滿的那些過於複雜的圖標經常會面臨可擴展性不佳的情況。在應用圖標的構思設計階段，設計師應將很大一部分精力放在這裡，思考給定的設計能否進行良好的擴展。
在1024*1024px的畫布上正常顯示，不代表在其他尺寸中也是可用的，請確保在所有設備上、在多種背景與尺寸下都做過測試。 保持簡單，集中在單一物體上，最好使用在擴展時能保持輪廓與質量的獨特造型或元素。 確保應用圖標在多種背景下都很美觀。
我設計的一些圖標，其中都包含了可擴展性的特質
2. 可辨識度
無論簡單還是複雜，只要確保圖標具有創新性、趣味性且準確呈現了設計思想即可。
從一堆噪音中找到一首短歌非常容易，而優秀的設計也是如此，它能從主屏幕中脫穎而出。就像歌曲的韻律需要聽者的共鳴一樣，應用圖標的形狀、色彩與想法也需要用戶的共鳴。設計需要精巧地編織記憶與關聯，讓功能與情感相通。
所有的圖標都是在一模一樣1024px的畫布上構思的，而你的圖標需要與其他成千上萬的圖標競爭，搶奪用戶的注意力，讓用戶聯想到你的應用。在可辨識度中，可擴展性佔據了一大部分，新鮮度也佔了一大部分。如何權衡這些特質才是關鍵。
乏味、過於複雜都是可辨識度的敵人。嘗試刪掉所有細節，只保留原本的概念。可辨識度是否提高了呢？ 在設計時嘗試多種變化，將各種變體都放在網格裡瀏覽，看看哪類設計能抓住你的眼睛。 嘗試解構你最喜歡的應用圖標，指出你喜歡它的原因，以及它們脫穎而出的方式。 3. 一致性
在加強視覺表述力上，讓圖標與界面保持一致非常重要。
與應用圖標的交互，以及與它所代表的應用進行交互，兩者的體驗需要保持一致。我認為好的圖標設計是應用內容的延伸，確保兩者相互支持，才能讓用戶留下更為深刻的印象。
讓用戶留下圓滑統一的應用形象，將會提升產品的滿意度、留存度與擴散力。簡單來講，確保應用的圖標與實質、功能和設計一致將會帶來巨大的成功。
確保應用與圖標一致的一個辦法就是保持界面與圖標的色彩協調，並使用相似與一致的設計語言——例如綠色的圖標會強化綠色的界面。 雖然不見得總是奏效，但通過將圖標的象徵意義與應用的功能直接關聯，有可能強化應用與圖標之間的聯繫。
在整套有關聯的應用中，圖標可以是一致的。
4. 唯一性
App Store的效率分類正是滲透到設計流程中的典範
雖然幾乎毋庸置疑，還是要嘗試創造些獨特的東西。模仿風格或潮流的做法很好，但要嘗試做些自己的東西。由於常要與其他圖標競爭用戶的注意力，使用獨特的設計會很有效。
獨特性是設計中比較棘手的部分，因為它不僅依賴於你的技巧，還依賴著其他解決同樣任務者的選擇。想想其他人會怎麼做，再嘗試完全不同的方向。永遠做研究——在這個世界上，我們不需要再用「對號」這樣的圖標。 如果想要保持獨特，在同色背景上使用單色字形會很難。嘗試不同的色彩與組成，挑戰自己來找出新的、聰明的象徵。 在實現概念時，使用色彩是極佳卻常被忽略的方式。
無論你喜歡什麼類型的設計，在尋找新奇的點子時，嘗試保持獨特常是個不錯的辦法。
用遊戲圖標設計來找靈感也很好，因為其中包含的想法範圍更廣，更脫離俗套。
5. 別用文字這是我歷來強調最多的問題之一，只有在極少案例中可以在應用圖標上使用文字。如果必須退回到書面文字這種抽象工具上，我不得不說你沒有發揮全力進行想像。
文字與圖片是各自分離的具象化工具，將它們結合用在應該是圖片表示的地方，經常會導致體驗上出現難以解決的混亂與重點缺乏。用乾巴巴的文字來具象化應用真的就更好嗎？無論何時我看到應用上的文字時，都會感覺這名設計師錯失了機會，本來他能夠更明確地傳達自己的意圖。
在圖標中包含應用名稱更是不必要，這種做法在界面上倒是更為常見。相反，花時間找找更酷的圖形概念吧。 但我聽到你說：「Facebook在應用圖標中包含f」。如果你正使用單獨的字母，並且感覺非常（並且具有唯一性）合適，那麼這個字母就失去了自身的「文字」特性，而成為了圖標。但是，通常來說這條規則被打破的情況更為常見。 將你的公司商標和名稱放在一個方塊裡永遠不是什麼好的解決方案。是否有能在限制下還表現良好的符號或者字型呢？如果沒有的話，最好還是找些新的東西。要記住，圖標與商標是不同的，不應當應放在同一個背景中。 大展拳腳
在App store還有Google Play上有很多乏味而不能達意的圖標設計樣例。你的圖標就是你的應用與用戶之間最強大的聯繫，是他們在App Store中瀏覽時第一眼看到的東西，是他們在每次使用應用時都會與之互動的東西，是他們在每次想到你的應用時都會想到的東西。在利用最大視覺資產方面，任何缺乏深思熟慮、適應性與吸引力的方案都是失敗。你的應用圖標不應當是後來才想到的，而是整個流程的一個工作環節。
應用圖標都是很細碎的東西，卻集中了設計的精髓，想要設計出優秀的圖像，請遵守通用準則：提高可擴展性、可辨識度、一致性與獨特性，這些比其他都要重要。成為一名圖標設計師會讓你的設計功力更進一步。無論或簡單或複雜，或普通或創新，這些圖標都有一致的特色：都是在一個有限的空間裡，完全公平的競爭下，嘗試吸引用戶的注意力。這是個特殊的挑戰，相同的像素得出不同的結果。
毫無疑問給應用配上圖片設計是個困難的任務，不過我希望上面列出的技巧能夠讓你在應對挑戰時更有信心。現在就開始設計一個迷人的應用圖標吧。
本文已經讀完卻還是無法獲得設計應用圖標的足夠知識？上面是我在洛杉磯的Adobe MAX大會上所做的一個演講。在這個為時1小時的視頻中，我講述了自己的一些工作，還有本文中所列出的理念，最終在改進現有應用圖標的問題上給出了一份demo。我覺得本文應當到此為止了。
（翻譯/孫薇 審校/唐小引）
文章來源：Designing better app icons
第一時間掌握最新移動開發相關信息和技術，請關注mobilehub公眾微信號（ID: mobilehub)。