Icons are found in every interface and for good reason. When properly designed and deployed, they can help users quickly find the information they need and improve the UX.

What are the icons

Static

They are used to navigate and enhance information, save the user time, and also help those for whom the interface language is not native. For example, by familiar symbols, the user will quickly understand that the support works 24/7, the hotel has wifi, and the room has a shower.

It is only important not to confuse users with incomprehensible icons, the meaning of which is clear only to the designer and not to use them where they are not needed.

Interactive

They are used to indicate actions in the interface. For example, the “basket” or “bag” icon will tell you that you can go to the list of unpaid items, and the magnifying glass icon – use the search.

It is important not to mislead users with the purpose of the icons. So, in different services the same heart icon can mean “like” and “add to favorites”, and the “star” icon – “add to favorites” or “recommend”. To simplify the UX and interpretation process, you can add text next to or below the icon.

Icon functions

Giving visual identity. A set of icons that are used on all sites of the brand and, when mentioned, are remembered.

Saving user time. The human brain processes images faster than text, so icons make it easier to find the information you need.

Saving space. Instead of long descriptions, one talking icon is enough. Also, with the help of icons, you can ergonomically place and structure elements of which there are too many in the navigation menu.

In order for users to get only a positive experience from interacting with your product, when developing icons, you need to take into account several important points:

Icons should be easy to understand. So that the user doesn’t have to think about what they mean.

They should be placed in the expected locations. For example, on a website a shopping cart or a feedback button is automatically searched for in the upper right corner. And in applications, it is customary to see them at the bottom of the screen.

Icons need to be approached comprehensively, as a system with a specific task in the interface, and try to maintain their unity and balance. They should be compatible with the entire graphics system you use: have the same visual weight, color, line thickness, style, and be in the optimal size for different devices.

If you follow these simple principles of UX / UI design, then icons will be a decoration of the interface, and not a reason to bewilder users.