Product Illustration System
The Outcomes Product Illustration System creates a consistent voice for illustrations, establishing a unified visual style that aligns perfectly with our established product color palette. Each illustration is designed according to a set of guiding principles, ensuring clarity and cohesion across our design.
Role
Principle Product Designer and Illustrator
Types of Illustrations
Empty State Illustration
Empty state illustrations briefly explain features, adding energy to otherwise vacant areas. They are in grey scale with a simple composition.
Spot Illustration
A spot illustration draws attention to a state or area. The images use color to draw attention to the main theme they support. They are used for Success Messages and user guides.
Scene Illustration
Scene illustrations work well in larger spaces and allow us to tell a story. Use these illustrations in a larger space, like a user guide or a full-page error state.
Illustration Style
-
Our illustrations are simple and include just enough detail to convey the shape of the element while minimizing unnecessary details.
-
The overall tone of our illustrations is positive, light, and friendly.
-
Illustrations should help clarify concepts, provide guidance, or tell a story for the viewer.
The illustration style for the Outcomes Product features a flat, two-dimensional perspective, ensuring that every part of the illustration is treated with equal importance. Subtle shadows and highlights are applied to add depth where necessary. If an object is not easily recognizable from one angle, an additional view from another side can be included.
Each illustration is paired with a background shape to maintain visual balance within its context and ensure consistent visual weight with other illustrations in the same setting.
Color Palette
Illustrations use a color palette that blends well with the product screens. Backgrounds and Empty States are in grayscale to avoid distraction. Primary elements have a limited palette of grays and a few colors. Give preference to using Outcomes Brand colors when possible.
