The use of icons in user interface design has become a widespread practice. When used correctly, icons greatly assist users by visually expressing ideas and actions—especially on mobile screens where screen space is limited. But, when they are not used correctly, they can have the exact opposite effect to a user's experience.

1. Be Recognizable.

Hamburger Menu Icon
Hamburger menus FTW.

There are many common types of icons that are instantly recognizable to users (like using an "X" icon to indicate closing a window/screen, or hamburger icon to indicate a hidden mobile nav ). Use these common icon types to give the user a sense of familiarity. Don't try to reinvent the wheel here.

2. Be Consistent.

Which icon style best fits your design?

Choose (or create) an icon set that is consistent across the board. Do all of the icons share the same style characteristics? Are your icons going to be outlined or filled? What happens when a user taps/clicks an icon? Think these through before finalizing your icon set.

3. Be Practical.

If you're wondering what this icon represents, you are not alone.

Don't use too many icons (Yes, I love them too), and make sure every icon serves a purpose or else a user won't know what is important and what isn't. Don't make users have to think about what the icons mean, or what happens when they interact with them.

The use of icons can have a major effect on the usability of the product. Be sure to remember that every icon should serve a purpose, be easily recognizable and stay consistent with the design system it lives within 👍