Chroma Experience

Choose the right icon

Icons are small elements that simplify many things. They provide, when
right use, they provide better usability and intuitive navigation.
navigation. Icons are simplified images with a significant symbolic value.
symbolic value.

When creating or choosing an icon, the clarity of an icon is important. If you can't think of
a suitable symbol within 5 seconds, it is unlikely that an icon will be able to
can convey the meaning clearly at all.
So they should be used in a meaningful way. Unclear icons are not helpful and get
in a user interface.

Clarity is therefore one of the most important features of an icon. Used correctly, it is a
great way to convey content in a simple and purposeful way.
The KISS principle can be applied to elements on the user interface as well as to
icons. The principle says, keep the symbols as simple as possible and
schematic to focus on the basic features.

But how do I choose the right icon?

  • Clarity & Recognizability: The meaning of the icon must be clear.
    Standard icons like the magnifying glass or an envelope should not deviate from the learned
    deviate.

  • Simplicity: An icon serves the purpose of simplification and makes the application
    more user-friendly. Therefore, an icon should not be overloaded and freed from unnecessary
    ballast.

  • Aesthetics: The visual attraction supports the user experience.

  • Size & Scalability: Icons are easy to click or touch. The icon
    should therefore remain easily recognizable even at different sizes.

Established icons

When choosing the right icon, however, the wheel should not be reinvented. The
understanding of users is based on experience. Symbols such as house, magnifying glass, mail, etc. are
established icons, which are also used internationally and recognized by the user.

Fig.1 : Established icons

Discrepancy

Icons that are contradictory to each other frustrate, confuse and have a negative effect on the on the user experience. Icons with similar meanings should be avoided and clearly defined.

Fig. 2: Discrepancy

Support

The use of symbol and text supports clarity and ensures that misinterpretation, and thus misinterpretation, and thus frustration, is minimized.

Fig. 3: Support

Consistency

Intuitive design goes hand in hand with consistent design. When similar elements have a
have a consistent look and function in a similar way, both learnability and user
both learnability and user-friendliness.

Icon sets should form a visual unit, i.e. stylistically come from the same pen. The
Use of a color scheme, as well as consistent style attributes (sizes, stroke width,
rounded/cornered, etc.) lead to a homogeneous image.

Icons help users do what they need to do without frustration and support them in intuitively
navigate intuitively through the page. Icons should be used in a targeted manner
without seeming forced. Icons do not always make sense, and simple text labeling is sufficient.
text labeling is sufficient. Thoughtful use creates harmony and a user-centered design.
design.

Fig. 4: Consistency