What’s the first thing that comes to mind when you think about a particular app? Chances are, it’s the icon. And it’s certainly the first thing a user notices when deciding what app to install — similar to studying the supermarket shelves. A good custom app icon design is a sure way to support a brand, promote the app, make it memorable and differentiate it from the variety of other apps, make people relate to the app, and it’s vital for the App Store and Google Play. Seems like too much for such a small element.

w ^帽子是當你想到一個特定的應用程序，想到的第一件事？ 很有可能是圖標。 當然，這是用戶決定安裝什么應用程序時會注意到的第一件事-類似于研究超市貨架。 良好的自定義應用程序圖標設計是支持品牌，推廣應用程序，使其令人難忘并將其與其他各種應用程序區分開來，使人們與該應用程序相關的肯定方法，這對于App Store和Google Play至關重要。 對于這么小的元素，似乎太多了。

An icon is a crafted design element users interact with every time they use an app, so it deserves special attention. And there are tips and practices to help you design a good icon for an app.

圖標是用戶每次使用應用程序時都會與之交互的精心設計元素，因此應特別注意。 并且有一些技巧和實踐可幫助您設計應用程序的優質圖標。

什么是應用程序圖標以及為什么應用程序需要它 (What is an app icon and why apps need it)

An app icon is a small piece of unique graphics acting as a symbol for an app, that you can see in app stores, on home screens and menus, etc. But is it the same as the logo?

應用程序圖標是一小段獨特的圖形，用作應用程序的符號，您可以在應用程序商店，主屏幕和菜單等上看到這些圖標 。 但這與徽標相同嗎？

Back in the day, creating icons for an application was a separate branch of the design industry. In the era of skeuomorphism, each icon was a work of art and everyone tried to show off as best they could. Then the flat design came along with full-fledged integrated branding for apps including logos, brand books, promotional websites, illustrations, and icons. So the application icon has become part of the branding and ceased to be something unique. However, it doesn’t make the icon identical to the logo, though both of them are parts of the app’s visual identity.

過去，為應用程序創建圖標是設計行業的一個獨立分支。 在擬人化時代，每個圖標都是一件藝術品，每個人都試圖盡最大的努力炫耀。 然后，平面設計伴隨著功能完善的集成品牌，包括徽標，品牌書，促銷網站，插圖和圖標。 因此，應用程序圖標已成為品牌的一部分，并且不再是唯一的東西。 但是，盡管這兩個圖標都是應用程序視覺標識的一部分，但這并不能使圖標與徽標相同。

Last year we’ve made an article on the concept of variable logos and their role in modern branding. Variable design is about the refusal of clinging to one particular style in favor of being relevant to the user and building a stronger connection. The disambiguation between the concepts of the app’s logo and its icon is one of the symptoms of this current trend. Still, an icon is not equated to a logo.

去年，我們就可變徽標的概念及其在現代品牌中的作用發表了一篇文章。 可變設計是指拒絕堅持一種特定的樣式，而傾向于與用戶相關并建立更牢固的聯系。 該應用程序徽標及其圖標的概念之間的歧義消除是當前趨勢的癥狀之一。 盡管如此，圖標仍不等于徽標。

The thing is, a logo is designed to be present on all marketing materials from the website to flyers, whereas an icon is made for specific purposes and places mentioned above. They are both parts of branding, but different in the way you create them and use afterward, so the reasons for their success are also different. A logo represents the brand. An icon represents a particular app.

事實是，徽標被設計為出現在從網站到傳單的所有營銷材料上，而圖標是專門為上述特定目的和位置而制作的。 它們都是品牌的組成部分，但是創建和使用方式不同，因此成功的原因也不同。 徽標代表品牌。 圖標代表特定的應用程序。

The icon design is important because it:

圖標設計很重要，因為它：

• promotes a brand
  提升品牌
• increases downloads
  增加下載
• helps retain users.
  幫助留住用戶。

A large portion of an app’s conversion rate is tied to its UI and UX design. A part of it is an icon ability to make it memorable and recognizable thus increasing conversion rate. An icon helps a user better understand the purpose of an app beforehand and relate to it. Roman Rudnik in his article describes 10 app icon design case studies with amazing results — sometimes a new icon design was able to double the app download rates.

應用程序的轉換率很大一部分取決于其UI和UX設計。 它的一部分是圖標功能，使其令人難忘和可識別，從而提高了轉換率。 圖標可以幫助用戶事先更好地了解應用程序的用途并與之相關。 羅曼·魯德尼克(Roman Rudnik)在他的文章中描述了10個應用程序圖標設計案例研究，并獲得了驚人的結果-有時，新的圖標設計能夠使應用程序下載率翻倍。

The following tips will help you make an amazing and effective app icon for iOS and Android that catches the eye.

以下提示將幫助您制作出引人注目的，適用于iOS和Android的驚人且有效的應用程序圖標。

移動應用圖標設計最佳做法 (Mobile app icon design best practices)

力求記憶力和獨特性，分析您的競爭對手 (Strive for memorability and uniqueness, analyze your competitors)

Designing an app icon, keep in mind that its main objective is to be recognizable and memorable. You probably remember the hilarious mobile gaming trend demonstrating the power of an angry guy yelling at something just out of frame, prevalent in mobile strategy gaming several years ago.

設計應用程序圖標時，請記住，其主要目標是易于識別和記憶。 您可能還記得令人興奮的移動游戲趨勢，該趨勢表明憤怒的家伙大喊大叫的力量超出了幾年前的移動策略游戲中。

Looking at today’s app stores, the screaming dudes are there all right, just not so many of them.

縱觀當今的應用程序商店，尖叫的家伙們都沒事，只是其中不多。

With virtually millions of apps available for Apple and Android, the hardest thing is to make something unique without overcomplicating it. The good idea is to analyze the icons of your competitors and try to go in a slightly different direction.

幾乎有數百萬種可用于Apple和Android 的應用程序 ，最難的是制作獨特的東西而不會過于復雜。 最好是分析競爭對手的圖標，然后嘗試朝一個稍微不同的方向前進。

There’s nothing wrong with attempting to understand your competitors’ success, look for inspiration, and maybe copy some of their good decisions, but just as the app is different from all others, so its icon should be different. When you craft an icon, you are immersed in the process and it seems one-of-a-kind. Whereas users get dozens or even hundreds of icons before them. That is why they should be able to quickly identify which one is yours.

試圖了解競爭對手的成功，尋找靈感并復制他們的一些好的決定并沒有錯，但是正如該應用程序與其他所有應用程序不同一樣，它的圖標也應該有所不同。 制作圖標時，您會沉浸在這一過程中，這似乎是獨一無二的。 而用戶在他們之前會收到數十個甚至數百個圖標。 這就是為什么他們應該能夠快速確定哪個人是您的人。

Make the competitor analysis but don’t overdo it so your app icon doesn’t look like a carbon copy. Find out what looks attractive to your target audience and build on it.

進行競爭對手分析，但不要過度進行分析，以使您的應用程序圖標看起來不像是抄本。 找出對您的目標受眾有吸引力的內容并以此為基礎。

考慮商業價值和品牌 (Take business values and branding into account)

An app should follow the overall branding for users to easily recognize it on all platforms and environments.

應用應遵循整體品牌，以便用戶在所有平臺和環境上輕松識別它。

When thinking about forms and colors pick those that go along with the general branding and are right in terms of color psychology.

考慮形式和顏色時，選擇那些與普通品牌一致的顏色心理學上正確的形式和顏色 。

堅持簡約 (Stick to minimalism)

Follow the rules of design and make your app icon simple and beautiful to the target audience. Remember the point about it being recognizable? The complicated design makes it less so. A design that is too intricate makes an icon and app itself look outdated and in turn, suspicious, low-quality, and not worth attention, so it gets easily ignored. Remove anything that can be removed without sacrificing quality and business goals.

遵循設計規則，使目標用戶的應用圖標簡單美觀。 還記得它可識別的意義嗎？ 復雜的設計使其不那么容易。 過于復雜的設計會使圖標和應用本身看起來過時，進而變得可疑，質量低下并且不值得關注，因此很容易被忽略。 在不犧牲質量和業務目標的情況下，刪除所有可以刪除的內容。

Make several design variations and show them to the target audience to find out what stays with them. Deconstruct the designs of your competitors and the ones done by the big corporation. It will show you the way.

進行幾種設計變化，然后將其展示給目標受眾，以了解它們的影響。 解構競爭對手和大公司設計的設計。 它將向您顯示方式。

As time passes, all companies are moving from the design intricacies that once showed the technical superiority of the product during the technological race to the simple forms that have a calming effect in the growing chaos.

隨著時間的流逝，所有公司都從曾經在技術競賽中展示產品技術優勢的設計復雜性轉變為在混亂不斷加劇中具有鎮定作用的簡單形式。

遵循應用商店指南 (Follow the app stores guidelines)

When designing an icon, follow app icon design requirements provided by the app stores. Both the App Store and the Google Play Store have very specific guidelines concerning the icon design down to style specifications.

設計圖標時，請遵循應用商店提供的應用圖標設計要求。 App Store和Google Play商店都有非常具體的準則，涉及圖標設計直至樣式規范。

The basic requirement is to follow the guidelines on app icon dimensions, but you’ll benefit from paying attention to all the specs. It’s hard to remember every single point, so here are the links:

基本要求是遵循有關應用程序圖標尺寸的準則，但是注意所有規范將使您受益。 很難記住每個點，因此這里是鏈接：

• App Store Icon Guidelines

  App Store圖標準則

• Google Play Icon Guidelines

  Google Play圖標準則

設計時要考慮可擴展性 (Design with scalability in mind)

You’ll need an icon for different places so its scalability is one more thing to consider. Think about all its sizes and formats. This is to ensure that an icon looks equally good on any device because icons are not only present in app stores and home screens, but also in sub-menus where they are even smaller, and on wearable devices interfaces.

您將需要在不同位置放置一個圖標，因此還需要考慮其可伸縮性。 考慮其所有大小和格式。 這是為了確保圖標在任何設備上的外觀都一樣好，因為圖標不僅出現在應用程序商店和主屏幕中，而且出現在子菜單中(甚至更小)以及可穿戴設備界面上。

Here’s where minimalism also plays its role. An elaborate design won’t look just as good as the simple one when cramped into a small square. The idea is for it to retain its distinct form in various sizes and remain legible in all environments. Try out your design in various sizes and formats to see whether it meets the requirements.

極簡主義也在這里發揮作用。 如果將設計局限在一個小方塊中，那么精致的外觀將不如簡單的外觀好。 這樣做的目的是要在各種尺寸下保持其獨特的形式，并在所有環境中都清晰易讀。 嘗試各種尺寸和格式的設計，以查看其是否滿足要求。

專注于一致性并傳達應用信息 (Focus on consistency and conveying the app’s message)

A perfect icon is not only a part of the branding system, but it’s also the extension of an app itself. It should be seamlessly woven into the user experience and become its starting and finishing points. It’s especially important in the game app icon design where it’s not enough to just make an icon from a logo. A good icon is made in the style and colors of a game and shows what it’s about and speaks the same language. An app and its icon should support each other. Ideally, an icon should display an app’s functions. So it makes sense to make an icon in the same visual style as an app to meet the users’ expectations.

完美的圖標不僅是品牌系統的一部分，而且還是應用程序本身的擴展。 它應該無縫地融入用戶體驗中，并成為其起點和終點。 這在游戲應用程序圖標設計中尤其重要，僅憑徽標制作圖標是不夠的。 一個好的圖標以游戲的樣式和顏色制成，并顯示其含義并使用相同的語言。 應用程序及其圖標應相互支持。 理想情況下，圖標應顯示應用程序的功能。 因此，使圖標具有與應用程序相同的視覺樣式以符合用戶期望是有意義的。

When conveying the app’s purpose, avoid using words on icons. “Show, don’t tell”. An icon is a visual representation of an app, it doesn’t need words, they will only overload it and act as white noise. What’s more, text elements look awful and harder to read in small-size icons. The exception might be one or two letters of a brand’s name, like in the case of “in” of the LinkedIn app icon.

傳達應用程序的用途時，請避免在圖標上使用文字 。 “顯示，不要告訴”。 圖標是應用程序的直觀表示，它不需要文字，它們只會使應用程序超載并產生白噪聲。 而且，文本元素看起來很糟糕，在小尺寸圖標中很難閱讀。 例外情況可能是品牌名稱的一個或兩個字母，例如LinkedIn應用程序圖標中的“ in”。

獎勵：應用程序圖標設計趨勢 (Bonus: Trends in app icon design)

Several years ago, people were posing questions about why there are so many apps with white icons. Today the recent trends seem to try to add some depth to the flat design.

幾年前，人們提出了關于為什么有這么多帶有白色圖標的應用程序的疑問。 今天，最近的趨勢似乎試圖為平面設計增加一些深度。

帶有動態的平面圖標 (Flat icons with some dynamic)

Flat design is about sophistication and aesthetics of minimalism and the use of simple forms. Adding dynamic motives brings in some depth and makes the illustration feel more energetic.

平面設計是關于簡約主義的精致和美學以及簡單形式的使用。 添加動態動機會帶來一些深度，并使插圖更具活力。

漸變色 (Gradients)

With the help of gradients, you are able to create completely new color schemes and add volume to objects, which creates a sort of 3D effect.

借助漸變，您可以創建全新的配色方案并為對象添加體積，從而創建一種3D效果。

凸版設計 (Letterpressed design)

The decision to give depth to any element may be justified, but you need to use embossing and letterpress techniques in the app icon design with caution so that it doesn’t look outdated.

確定任何元素深度的決定可能是合理的，但是您需要在應用程序圖標設計中謹慎使用壓紋和凸版技術，以免顯得過時。

Originally published at https://shakuro.com.

最初發布在 https://shakuro.com 。