Illustration | IPAC Design System

Purpose

We use illustrations for our website, e-learning courses and marketing materials to:

Add Personality and Warmth: By incorporating unique and engaging illustrations, we infuse our content with character and a welcoming feel.
Enhance Storytelling: Illustrations help convey narratives and complex ideas more effectively, making our content more relatable and memorable.

Style: We should follow a consistent illustration style. When sourcing new illustrations, try to match the ones on this page. For example, there are some illustration styles that look similar to ours, but the character may be missing eyes - keep a lookout for things like that.
Note that our E-Learning illustrations have a different style, due to limitations of the animation platform used.
Proportions: Avoid characters that have exaggerated proportions. For example, huge hands!
Avoid Stroke-Based Illustrations: We steer clear of illustrations that rely heavily on strokes or outlines. Only icons can be stroke based.
Colour Palette: The colour palette for illustrations can be bright and varied to add vibrancy and life into our products. However, it's essential to incorporate elements from our brand's predefined color palette to ensure consistency and reinforce brand identity.

Small standalone images used to emphasize key points, guide users through steps, or draw attention to specific elements on a page.

Larger, more detailed images that depict scenarios, tell a story, or explain a process in a visually engaging manner.

Simplified, easily recognizable illustrations that represent actions, objects, or concepts concisely.

Note that these differ from icons in that they don't scale down as well to very small sizes (~18px), and details get lost.

These illustrations CAN be stroke based, and may optionally include small hints of colour.

They can be slightly more detailed than the ones in our icon library, which are optimized for smaller sizes.

Cultural Sensitivity and Inclusivity: Ensure that illustrations are inclusive, respectful of all cultures, and free from stereotypes.
Balance Visual Appeal and Functionality: Create illustrations that are not only aesthetically pleasing but also serve a clear purpose and enhance the user's experience.
Keep Designs Clean and Simple: Avoid clutter and complexity in illustrations to maintain clarity and focus.
Accessibility: Provide alternative text for all illustrations to make them accessible to users with visual impairments. Use high-contrast colors and avoid relying solely on color to convey meaning.

DO NOT

Use illustrations with strokes, or ones that are overly detailed.

DO NOT

Use illustrations without eyes.

DO NOT

Use illustration styles that differ from ours (exception is e-Learning).