Atomic Design Methodology | Step by Step Process Explained

Atomic Design Methodology
#uxdesign #uidesign #atomic

What is Atomic Design?
Atomic design is a design methodology created by Brad Frost that considers creating and maintaining design systems while providing an attractive way of explaining using chemistry.

5 stages of the Atomic Design methodology:
1. Atoms
Atoms are the basic building blocks in this design system. All elements are individual items consisting of labels, icons, buttons, and more.
2. Molecules
It is a combined group of atoms. For instance, a form label, search input, and button can create a search form molecule.
3. Organisms
The combined group of molecules is called organisms. This is a more significant component. It includes navigation, sidebars, and pop-ups.
4. Templates.
Templates are the combined group of organisms, and this will eventually be forming as a useful web or mobile layout, like a wireframe.
5. Pages
Once you create the templates, you can add actual contents and images to the page; now, you have a page containing all the atomic design elements like atoms, molecules, and organisms.

Benefit of the atomic design is that the components are reusable. By dividing elements into basic atoms, we can quickly identify what parts of the site should use those atoms and how we can mix and match them to create molecules and organisms.

-----------------------------------------------
Facebook Page
  / uxable-learning-ux-together-102970578129835  
-----------------------------------------------
#uxdesign #uidesign #atomic
Atomic Design Methodology