Atomic design is a methodology for creating design systems and templates. In presentation, we will look at https://patternlab.io/ & https://fractal.build/ and how they work at real projects. - Atomic design, principles, and methodology. - The difference between atomic design and UI kit. Component design approach. - A short overview of static site generators using atomic design methodology: Fractal, Pattern lab, Storybook. - Comparing Fractal and Pattern lab at real Drupal projects: advantages and disadvantages for the team. https://drupalcampkyiv.org/node/31

1. Atomic design
or:
How I Learned to Stop Worrying
and Love the
Frontend for Drupal

2. AndriI Turik
● Remote Frontend Developer at Smile Open Source
Solutions
● Volunteer / Frontend Developer at «The White Collar
Hundred» («Kantseliarska sotnia»)
● CTO / coOwner at Schrödinger's Cat Laboratory
● andreyturik@gmail.com

3. First steps

10. Attempt to organize
a convenient process

11. Brave
new world

12. So,
what is
atomic design ?

13. UI-kit
vs
Atomic
design

14. Let’s look
how its
works

15. extra advices

16. special thanks
to
Bohdan Moskalenko

17. Links:
● https://patternlab.io/
● https://fractal.build/
https://github.com/moskalenkoBV/pattern-drupal
● https://github.com/Adyax/fractal-twig-drupal-adapter
● https://github.com/ArialBlack/Fractal-for-Drupal