Les Lois de la Proximité

Le framework

01
Les éléments proches sont liés
Le cerveau groupe automatiquement ce qui est spatialement proche. Si votre label est plus près d'un autre champ que du sien, l'utilisateur se trompe. L'espacement est un outil sémantique.
02
Creez des groupes visuels
Rapprochez les éléments qui vont ensemble, éloignez ceux qui n'ont rien à voir. Pas besoin de cadres ou de séparateurs -- l'espace suffit à créer la structure.
03
L'espacement prime sur les lignes
Un filet de séparation est souvent un aveu de faiblesse. Si vos spacings sont bien gérés, vous n'avez pas besoin de bordures pour distinguer les blocs.
04
Cohérence des distances
Choisissez 2-3 valeurs d'espacement et tenez-vous-y. 8px entre éléments liés, 24px entre groupes, 48px entre sections. La régularité crée le rythme et la lisibilité.
05
Appliquez au-delà du layout
La proximité s'applique aussi au texte : un titre collé à son paragraphe, un label collé à son champ. Chaque micro-décision d'espacement communique une relation.

Parlons-en ?