Atomic Design
Una forma de construir interfaces empezando por las piezas más pequeñas y combinándolas en otras cada vez mayores, igual que en química los átomos forman moléculas. Lo propuso Brad Frost y ordena las pantallas en cinco niveles, de lo más simple a lo más completo, para que todo encaje y se reutilice en vez de rehacerse.
En una analogía · Es la química aplicada a las pantallas: los átomos forman moléculas, las moléculas organismos, y así hasta la página completa.
Los cinco niveles
- Átomos: las piezas mínimas que ya no se dividen, como un botón, una etiqueta de texto o un campo de formulario.
- Moléculas: pequeños grupos de átomos que funcionan juntos, como un campo de búsqueda (etiqueta + caja + botón).
- Organismos: bloques más grandes y reconocibles, como la cabecera de una web con su logo, su menú y su buscador.
- Plantillas: el esqueleto de una página, con los bloques colocados pero todavía sin contenido real.
- Páginas: la plantilla rellena con contenido de verdad, lista para el usuario.
La utilidad práctica es pensar la interfaz como un sistema de piezas reutilizables y no como un montón de pantallas sueltas. Esa misma idea (construir desde piezas con reglas claras) es la base de cualquier sistema de diseño y la que permite que un agente componga pantallas reutilizando lo que ya existe en vez de inventar.
Lecturas de referencia
A seguir
Recibe la próxima guía en tu correo
Una guía operativa nueva cada poco: cómo se construye, qué decisiones implica y qué no se hace. Sin ruido, solo cuando hay algo útil.