Illustration explains an idea; photography adds evidence or human context. Build a recognizable visual language while keeping the product's actual task in focus. Decorative treatment must not obscure the subject.
Separate subject from atmosphere
Use a soft field behind stronger focal objects. Give each foundation a distinct composition. Keep the same palette and drawing language without repeating the same scene for unrelated concepts.
Design the crop
Choose an aspect ratio and focal point. Test narrow cards, wide banners, and both themes. Do not stretch a bitmap or crop away an essential action, face, or annotation.
Explain meaning accessibly
Write alternatives for informative images based on their purpose in context. Use an empty alt for purely decorative images. Complex diagrams need a nearby explanation. Track source rights and label synthetic imagery when its origin affects interpretation.
Default decisions
Starting conventions for this system. Validate them in the context of your product.
- Focal point
- Explicit for every responsive crop
- Fit
- Cover for atmosphere; contain for diagrams
- Palette
- Pale blue fields with distinct foregrounds
- Alternative
- Purposeful text, or empty alt when decorative