Also known as:
IllustrationHero illustrationSpot illustrationImageryGraphics

Illustration

An illustration communicates and expresses our personality through visuals.

AnchorNeed to know

  • Scene illustrations tell a rich story to set the scene for users and let them know what's possible.
  • Spot illustrations are simple, informational visuals that assist users in their task.

Adding new illustrations

To add a new illustration to the Kaizen UI Kit, to export an illustration from the UI Kit, or to add an illustration to the Kaizen Component Library, Culture Amp employees can see an internal link for the illustrations process on our wiki.

Visuals

UI Kit

To keep in mind

  • Scene illustrations convey a mood while users are navigating through the platform.
  • Spot illustrations give visual context to tasks.
  • Illustrations are generally presentational and use an empty alt="" tag or aria-hidden="true" as appropriate.

When to use and when not to use

When to use
  • Use illustrations to support onboarding or empty states.
  • Use illustrations to celebrate successes.
  • Use illustrations to draw attention to important features.
  • Use illustrations to convey complex ideas that are visual in nature.
  • Use illustrations when people aren't reading or understanding text descriptions.
When not to use
  • Avoid illustrations when words are more effective.
  • Avoid illustrations when performance is an issue.

See also

External links

Here are some examples of other existing design systems: