Unique web design book explores how interfaces fit together

How designing, coding and writing in the open has helped Brad Frost make better products.

Pittsburgh based web designer, Brad Frost, is writing a book – Atomic Design. Frost will be writing the book live on GitHub. As he works, the community can read what he's written and contribute to the work. More importantly, the community can start using learning and benefiting from the book before its complete.

"I don't think it needs to be finished before people can start using it," Frost explained. Going further, he told us: "The prospect of going away, hiding in a cave for a year and a half and coming out with a book. It doesn't work... We work in a fast paced industry. I don't want to go 'hey, look, here's an out of date book!'"

Atoms and molecules

Brad Frost idea of atomic web design draws on the periodic table of elements

Brad Frost idea of atomic web design draws on the periodic table of elements

Frost's book will be called Atomic Web design. It's a subject that's close to his heart, and one he's pioneered. Atomic Design is Frost's way to explaining how interfaces fit together.

Interfaces like all matter, are made of smaller elements that link together. Adopting this approach, Frost told us, means we break entire interfaces down into their fundamental building blocks, and work up from there.

The birth of book

Frost designed the Greater Pittsburgh Community Food Bank's in the full gaze of the public, and learned from the experience

Frost isn't new to his idea of designing and making in the full gaze of the public. "Last year, my wife and helped I redesigned the Greater Pittsburgh Food Bank website, and we did it all in the open," Frost enthuses. "And it was an epiphany."

The Food Bank project was blogged and made available on GitHub. The idea being, other similar projects – who may be cash-strapped – can use Frost's work. And they can do it quickly, easily and efficiently.

The unexpected

The approach of designing in the open helped Frost. As he worked, the web community chipped in with ideas, code and – he says – the odd criticism.

"People would yell at me 'here's how I would do it!' So I'd cut and paste their code." Frost told us. "That was awesome." Even before the food bank project went live, the code took on a life of its own. When in New Zealand, Frost met a Professor who was using his work to teach her students.

The Food Bank project changed his creative approach and Frost says he's keen to see how the method will translate to writing.

Atomic Web Design by Brad Frost is live on GitHub now

Words: Martin Cooper

If you like this, Read these!

Do you have any great tips you'd like to share? Let us know in the Comments below!