¿Qué es el sistema Atomic Design y cuáles son sus beneficios?

mayo 12, 2021 Conecta Software

El concepto de Atomic Design se emplea por primera vez en el año 2013, de la mano de Brad Frost, autor del libro Atomic Design Brad. Este sistema de trabajo basa su funcionamiento en la creación de elementos modulares sencillos que permiten crear estructuras de información mucho más complejas.

¿Qué es Atomic Design?

Brad Frost apuesta por una perspectiva del diseño que pivote desde elementos particulares hacia proyectos de carácter general. Por lo tanto, en cada flujo de trabajo deben quedar presentes un universo de átomos, moléculas, organismo y sistemas que permiten cubrir con nuestras necesidades.
conecta hub conector ecommerce
Atomic Design se utiliza para construir sistemas de diseño efectivos y orientados hacia un sitio web o un destino digital. Para ello, se inspira en los principios de la Teoría General de Sistemas. Esta teoría considera los sistemas vivos como un conjunto de sistemas abiertos.

Los componentes de Atomic Design

Átomos

Los átomos constituyen la identidad básica del sistema Atomic Design. Son los bloques elementales sobre los que se fundamentan estos sistemas. Su principal característica es que no pueden ser divididos en otras unidades.
En un sitio web, los átomos son, por ejemplo, el titular de una página o la imagen principal de un artículo. Son los elementos más simples pero, al mismo tiempo, imprescindibles.

Moléculas

Tras los átomos, llegan las moléculas. Éstas adquieren nuevas funcionalidades y características a partir de la unión de diferentes átomos. En conjunto, se encargan de formar componentes de la interfaz de una web que se caracteriza por su simplicidad. Pero con una estructura algo más compleja que en el caso anterior.
Un menú en una categoría de productos o una tabla son solamente algunos de los elementos que pueden adquirir esta perspectiva. La reutilización de moléculas nos permite eliminar la complejidad de nuestro sitio web. Asegurando una coherencia a nivel tanto gráfico como estructural.

Organismos

Los organismos son conjuntos de moléculas que nos permiten crear elementos mucho más complejos de los alcanzados hasta este momento. Un logotipo o la selección de un idioma son, por ejemplo, algunos de los organismos más habituales. 
Los organismos suelen reutilizarse en forma de cabeceras o de footers. No obstante, es importante conocer que existen una gran cantidad de aplicaciones que permiten llevar a cabo su ejecución.

Las plantillas

Las plantillas permiten organizar los organismos, focalizando su utilidad en la estructura del contenido, no en el contenido final de la página. Las plantillas definen las propiedades de todos los componentes que las integran. Es decir, se centran en atributos como el tamaño del texto, la alineación del mismo o el estilo, entre otros muchos elementos.
Su aplicación en el producto digital asume la forma de la Home, la página de Contacto o el Sobre nosotros, entre muchos otros elementos.

Sistema

El sistema se encuentra conformado por un conjunto de organismos. Un conjunto de páginas de un sitio web conforman la web completa, por ejemplo.
Mediante el término de sistema se hace referencia al resultado final de una página web, una aplicación móvil o un software, entre otros productos.

Construir y crear interfaces al detalle

Inspirada en los principios de la química, esta metodología nos permite construir interfaces de manera detallada, perfectamente planificadas. De este modo, se facilita tanto el proceso de actualización como el de ejecución de cualquier proyecto web que se desee llevar a cabo. Una integración de la metodología Atomic Design nos permite, además, optimizar la gestión de sprints entre diseñador, programador y cliente.
El Atomic Design ayuda, además, a definir un sistema que en un futuro podrá asumir nuevas funcionalidades gracias a que los átomos ya estarán creados. Asegurando la máxima escalabilidad para cada proyecto que llevemos a cabo.

Get in Touch
newsletter

Suscríbete al newsletter sobre ecommerce y transformación digital.

Además, te regalamos el primer capítulo del libro
«Conecta tu negocio. La transformación digital de los canales de venta»


newsletter
Get in Touch
Contact
conecta-logo-blanco-retina

Producto

Info

Soporte

Conecta tu Negocio.

922-014-341

Proyecto Cofinanciado por el Fondo Europeo de Desarrollo Regional, Consejería de Economía, Conocimiento y Empleo y el Fondo Social Europeo (FSE) . Beneficiario: Conecta Software Soluciones SLU. Nº expediente: IPI2020010003. Inversión Aprobada: 71.895,20 €. Comienzo: 23/07/2020. Finalización: 20/01/2023. El presente proyecto tiene como objetivo el Desarrollo de una solución de movilidad comercial.

Proyecto Cofinanciado por el Fondo Europeo de Desarrollo Regional. Beneficiario: Conecta Software Soluciones SLU. Nº expediente: EATIC2019010001. Inversión Aprobada: 173.800,00 €. Comienzo: 01/04/2019. Finalización: 30/09/2020. El presente proyecto tiene como objetivo el desarrollo de una capa de usuario multilingüe y dashboards para entornos web y windows de solución de Business Intelligence.

Proyecto Cofinanciado por el Fondo Europeo de Desarrollo Regional. Beneficiario: Conecta Software Soluciones SLU. Nº expediente: PI2019010001. Inversión Aprobada: 6.444,80 €. Comienzo: 17/10/2018. Finalización: 16/10/2019. El presente proyecto tiene como objetivo el desarrollo de un software conector que automatiza la generación de catálogos virtuales para que la empresa pueda ofrecer en su Tienda online productos con una amplia descripción y con imágenes que hagan la experiencia del usuario más rica y completa.

© 2021 TODOS LOS DERECHOS RESERVADOS. CONECTA SOFTWARE

Contact