The design culture of an app icon

The startup icon is a key component of every iOS application. It communicates the basics of your application and gives users a first impression. It is a very important software portal that can directly guide users to download and use applications. Its importance is recognized in this smartphone age.

Designers who have experienced the design of software startup icons often encounter a problem: the design of a single software startup icon looks cool, but in the electronic market, but not too popular with users, user clicks very low.

How to upgrade the app startup icon clicks from the visual design level?

In fact, we are in the process of designing the software launch icon, there are some common design methods, which can help us improve the click rate of the icon.

　　1. The use of visual metaphor at the same time, the need to ensure the recognition of the icon

As shown in figure one, many of the icon designs here are designed and used without careful thought. We look through the App Store and find that there are very few app icons that are designed to be eye-catching. For example, a "tongue twister" search, you will see this sort of icon:

Figure one of the first line of the fifth icon, the expression is the English language of tongue twisters in the gradient icon background color block, visual effect is very flat, no lack of design sense.

In order to attract users to use app software, we have to design a user's eye icon!

We can use the metaphor design expression technique, conveys to the user "the tongue twister" The information, lets the user see the icon to be able to perceive, to imagine, understands the icon the meaning. The enlarged icon on the right side of the diagram, in which the icons are designed, are more attractive for users to use. Its design uses is the metaphor visual expression technique, lets the user understand the meaning of the mouth, plus the interesting image design, lets the user understand the meaning of the icon easily, such exquisite metaphor's icon is easy to attract the user's eyeball in the first time, by the user's affection.

As shown in Figure two, this is an app icon design for Starbucks. Starbucks logo design is very good, but, Starbucks's consumer card app icon design in the Starbucks logo is relatively small, in the app Store to see the icon design, the ring-shaped Starbucks logo is difficult to identify. In fact, the design should enlarge the brand of Starbucks, to improve the identification of identification.

Therefore, we need to ensure the recognition of the icon design while using visual metaphor to represent the icon.

　　2. Analysis of similar app icon, organize design ideas and focus on icon innovation

We search for efficiency software in itunes and we find a lot of similar icons. As shown in figure three, which of these icons will attract the attention of the user? After looking through it, we will find that the exquisite icons with a layered design and a specific texture will attract users ' attentions.

Another way to design the app icon is to add a layered design and texture to the icon. After designing the icons, place them in the same category app icon to see if the icons you designed can catch the user's eye.

Here are some of the icons in figure three that can capture the user's eyeball the first time:

2Do-This icon is like a bunch of files in order to deal with the feeling. Stitched leather texture and clean notes form the contrast of texture, the overall texture of the icon performance delicate and full.

Put things off-is a good design. After careful thinking, the designers are different in their ways, creative and interesting. The icon uses the document box and the "forward" Arrow's visual elements to express the sense of the rapid efficiency of event handling; color, using a very high purity of the bright colors to design, can seize the user's eyeball, so that users quickly understand the software features.

Taska-icon looks like a pile of desks neatly stacked in a file. Visual performance did not leave a very deep impression, but this icon painting is very exquisite, the paper's stacking effect shows the level of the icon, the background of wood texture effect performance improved icon design texture.

　3. Use the graphical elements in the software interface to embody the continuity of the icon design

There is a design method to ensure that the performance of the icon and software continuity. The method is to start the design of the icon and use the design elements that match the graphic of the application interface. Expenditure is a good example of icon design, very accurate description of the tracking function of the application.

　　4. Use of user-curious graphic element design, grasp the user's curiosity

Show a yoga application icon with elegant outlines and graceful lines. Arouse the user's curiosity, attract the user to use.

　　5. Highlight the brand, seize the attention of users

If you are designing a well-known brand application, please use its brand appropriately logo! Life, these brand signs have been left to the user is very impressive, very easy to win from the numerous app icons. Therefore, in the design of well-known brand app launch icon, you should fully use its brand logo.

No matter what you want to design, don't waste a well-known brand of the existing elements!

For example, browsing through several icons is easily recognizable:

But, in the design of the icon, what would it look like if you didn't highlight the elements of a well-known brand? As shown in Figure six, the icons in Figure seven show that they are too weak to compete with other icons in the numerous app icon interfaces shown in Fig. Six.

If, adjust the icon design parts, improve the design:

We put the new icon in the interface and look at the effect:

Through thinking and experiment, adjust the design, let the brand characteristic capture the user's eyeball.

　　6. Device Test preview of the effect of the icon, fine-tuning color or brightness to achieve the best results

Using the device to test your icon design is a good way.

viewing in Photoshop or in the iphone emulator is not enough. The visual effects of the icon on the actual device are different from the computer. Why, then? There are several reasons:

The color and brightness of a computer monitor is different from a touch-screen mobile device.

Not all touch-screen displays are the same. For example, the iphone screen quality is higher than the ipod touch screen display quality.

Therefore, the equipment test is very necessary.

　　7. Multi-scene testing to ensure the quality of the online icon design.

The App Store has:

itunes Computer Store;

IPhone with different resolution of the store;

itouch shop with different resolution;

ipad tablet Computer Store.

This means that the icon's application environment has a variety of applications, so before the icon online, designers need to be in a variety of icons in the application of the design test. As far as possible in a variety of store scenarios, in the same product users to view the interface, can attract users ' attention.

Some of the above app software icon design methods do you use it in design? The unused method can be tried.

These common icon design methods can help designers control the effect of the icon design and the user experience in the market, can really from the user's point of view to design an icon, can enhance your app software user experience, from the visual design point of view to enhance the software icon user clicks.