Teach you the essence of APP desktop icon packaging design


First of all, designers as APP must understand what the fundamental role of designing APP icons is.

In fact, we usually say that the APP icon is the logo package of APP applications, and logo packaging must have the function of recognizing products and identifying products.

So the design of the APP icon must achieve this two functions:

First, you can quickly identify APP, so that users clearly know what this APP is, and what’s the use of it;

Second for distinguishing the APP, allowing users in many mobile phone APP icon, quickly find, recognize their own APP software.

For example, the latest APP list of APP store is listed below:

APP-store- fresh icon design

These are basically in accordance with the APP APP icon icon design method to the following. Do not believe, we will take this issue, taught you how to design the APP icon?


Part one: teach you three ways to design an APP icon with identity

1, patterned text method.

APP LOGO design method of the traditional form, the APP icon design method is the most commonly used.

In fact, the brand name is directly entered into the icon in the form of LOGO. Is the most clear and accurate that the essence of the product, the easiest and most convenient user cognitive recognition.

These APP desktop icons are shown below

(A) patterning with branded packaging LOGO.

QQ screenshot 20150911223655.png

(B) patterning with the keyword in the brand name

QQ screenshot 20150911223719.png

This kind of APP desktop icon design method is suitable for a certain brand awareness of APP icon design.

2, cartoon mascot image method

This method is suitable for the brand has been user cognition, users can mark a clear pattern of brand cognition. The symbol of the cognitive users have made icons, also help users identify the brand of APP software. Such as QQ, KFC, micro-blog, eLong, Ctrip, the same way.

QQ screenshot 20150911223727.png


3, APP 043 product attributes.

Look for iconic patterns in product attributes to make icons.

The product attributes, it is to find the symbol representing the APP software use attribute of patterned icon design. Special attention is the symbol of the representative, must be known to the user pattern. Apple mobile phone system comes with the software icon, is a model of this method.

APP icon inspiration station

Above these APP desktop icons are using this method.

APP product attribute patterning is the most popular method at present.



The second part: the design method of finding and identifying desktop APP icons

To allow users to quickly identify the search to the use of APP software, the color design method is the most effective APP desktop icon.

We must seize the people of color! At the same time to establish their own APP standard color is very important.

Must each APP must occupy a standard color, and used the icon of the background. Different color, more conducive to the user to distinguish different APP icons.

Such as WeChat in the dialog box design, occupy the green background, while WeChat uses another layer of meaning is green, want to get iPhone’s own information icon. So one reason for the green.

Impression notes in the patterned elephant, occupy the dark green bottom;

Mango TV, do the design for color will be orange Icon; Alipay holds on behalf of cool blue; Taobao has bright orange.

QQ screenshot 20150911223755.png


So, APP is a desktop icon of the APP product appearance, the first contact solution is also used by users, after users understand and distinguish products, will have more in-depth experience. And the APP desktop icon is the first entrance of this experience.

Today, 25 design methods of school to teach you the package APP desktop icon, the first entrance is to let you thoroughly understand how to design their own APP products. Seize the most important mobile Internet traffic entrance.



Extended reading:

1, APP: UI mobile phone interface icon design learning theme icon design appreciation

2, what kind of icon icon is a good APP icon design?

3, the entry-level APP icon design: Pencil Icon Design Video Tutorial

Leave a Reply