An illustration is a visual made to explain, support or add character to content. In a product, it should reinforce the message and fit the task rather than compete with it.
A good diagram in a guide makes a difficult idea easier to picture without taking over the lesson.
Give the image a job
An illustration may explain a process, set a tone or make an empty state feel less abrupt. Decide which job it serves before choosing a style. If removing it would not change understanding or experience, it may be decorative and should not draw attention away from the main action.
Match the message and audience
Use familiar metaphors and avoid imagery that excludes or stereotypes people. A visual should support the words rather than introduce a conflicting interpretation. For instructional content, label important parts and provide a text explanation when meaning depends on the image.
Plan for different sizes
The composition should remain clear when cropped into a card, resized on mobile or displayed in a high-density screen. Keep focal details away from crop edges and use a suitable aspect ratio. Provide a deliberate fallback if the asset fails to load.
Example: a no-results state
A simple illustration can soften a search with no matches, but the state still needs to say what happened and offer a next step such as changing the query. Avoid an elaborate graphic that delays the message or makes a recoverable situation seem like an error.
Frequently asked questions
Key takeaways
- Choose an illustration to serve a clear communication purpose.
- Make its meaning fit the words and audience.
- Check crops and small-screen rendering.
- Keep essential instructions and next steps in text.