± Atomic, e-commerce, Sketch & colors
The design system holy grail involves creating an environment where the pattern library and live applications are perfectly in sync. The idea is that you should be able to make a change to a UI pattern and see that change automatically reflected in both the pattern library and anywhere the pattern is included in production. - Brad Frost, Atomic Design
Design system solution for e-commerce. Exploring for the best practices from Amazon, eBay, Aliexpress and others
Creating a product design system in Sketch
Alexandre Trimoulet describes his journey creating a design system from scratch in Sketch. His main lessons include:
Don’t try to convert everything as symbols. You should only convert atoms, molecules, and some organisms. […]
Communicate on it and involve others early in the process.
Documentation is key. When something is written down, you can’t discuss it, you can’t make mistakes.
How a Product System can help you focus on what matters
Un design système, c’est aussi se concentrer sur les problèmes et solutions des utilisateurs. Se concentrer sur les artefacts que l’équipe doit concevoir est une vue un peu réductrice d’un design système. Il doit aussi devenir une source de référence sur les solutions appliquées aux problèmes d’utilisateurs, une libraire de comportements à envisager et développer,
Giving a place to your product knowledge can help you keep focus, build faster and reduce waste as you go.
IBM’s Color palette uses the full range of saturation and brightness, but it was challenging to identify uniform patterns among the different ramps. When looking at Green (see below), IBM broadly shifts the Hue value between 78 and 120, which can be difficult to consistently replicate and manage within other colors. IBM clearly values accessibility, because the contrast ratio is consistently designed to be 4.5:1 or higher when the value is 50 or higher.