Icon Design Graphics Icon 3

Question 1

What is the difference between 'outlined' and 'filled' icon styles in a design system?

Accepted Answer

Outlined icons use strokes to define shapes while filled icons use solid shapes

Answer

Outlined icons rely on stroke paths for their form, while filled icons use solid closed shapes, giving each a distinct visual weight.

Question 2

Which icon design approach is BEST for representing abstract concepts like 'trust' or 'security'?

Accepted Answer

Established metaphors such as a shield or padlock

Answer

Established visual metaphors leverage shared cultural understanding, making abstract concepts immediately recognizable.

Question 3

What is 'icon bleeding' and why is it a problem?

Accepted Answer

An icon whose artwork extends beyond its bounding box or trim area

Answer

Bleeding occurs when an icon's visual elements extend past its defined bounding box, potentially clipping or overlapping other UI elements.

Question 4

Why should icon designers avoid using very thin strokes (under 1px) at small icon sizes?

Accepted Answer

They become invisible or render as blurry half-pixels on standard screens

Answer

Sub-pixel strokes cannot be rendered as a full pixel, causing anti-aliased blurring that makes lines appear faint or fuzzy.

Question 5

What is an icon 'artboard' used for in vector design tools like Figma or Illustrator?

Accepted Answer

Defining the icon's canvas boundary, dimensions, and export region

Answer

An artboard sets the icon's bounding dimensions and determines what gets included when the icon is exported.

Icon Design Practice Test