carbon-design-system / carbon-design-kit

A versioned, comprehensive kit of the Carbon Design System visual assets (components, icons, pictograms, text styles, color styles, grid templates).
Apache License 2.0
1.06k stars 154 forks source link

[Image production guideline] Add more rules and guidance around spacing #808

Open thyhmdo opened 1 month ago

thyhmdo commented 1 month ago

Reference Figma kit: https://www.figma.com/file/XQqHxu38CiY3Vx1iHdafIa/Image-production-guidelines?type=design

(Need more description @benjamin-kurien @laurenmrice) A designer needs to have more guidance and examples around how to showcase images.

benjamin-kurien commented 1 month ago
image production guidelines for examples
Kritvi-bhatia17 commented 3 weeks ago

We also need to identify and document exception cases that arise while creating images.

One example is when creating images for default and fluid tabs. When flipping between these images, the scale and positioning may shift slightly. To prevent this, we try to align some parts of the default/fluid images so they don't bounce as much. This can involve aligning the baseline or the text/icons in the field.

Refer to the "AI presence" image under Select component on usage page for reference.