gráfico de Brad Frost
IIndustrias como la Arquitectura o el Diseño Industrial han desarrollado sistemas modulares inteligentes para fabricar objetos extremadamente complejos como aviones, barcos y rascacielos. Inspirado por esto, Atomic Design se propuso como un sistema que implica descomponer un sitio web o una aplicación web en sus componentes básicos para que puedan reutilizarse en todo el sitio. Debido a los nuevos dispositivos con nuevos tamaños de pantalla que se lanzan cada año, crear un diseño con píxeles perfectos se vuelve más difícil si no se implementan sistemas.
Al abordar este problema, Brad Frost acuñó el término y la metodología de diseño atómico. El diseñador web, orador y escritor es autor de Atomic Design y dice que:
“El diseño atómico no es un proceso lineal, sino más bien un modelo mental que nos ayuda a pensar en nuestras interfaces de usuario como un todo cohesivo y una colección de partes al mismo tiempo”.
En este artículo, me gustaría señalar 4 cosas que debes saber sobre el diseño atómico y cómo tú, como diseñador, podrías beneficiarte de él.
Definición de Diseño Atómico Diseño Atómico e Inventario de Interfaces Diseño Atómico y Sistemas de Diseño Beneficios del Diseño Atómico
Atomic Design, introduce una metodología para crear sistemas escalables, componentes reutilizables y sistemas de diseño. En los primeros días de la web, teníamos “páginas” limitadas que no eran responsivas ni escalables. Hay cinco niveles distintos en diseño atómico:
átomos representan la entidad más pequeña en los elementos de la interfaz de usuario y no se pueden desglosar más. Piensa en ellos como bloques de Lego. Sirven como pilares fundamentales de su interfaz. Algunos ejemplos son: colores, fuentes, animaciones e imágenes individuales.