Posts Tagged ‘atomic design’

Containing multi-site management within a single codebase covers how one can apply atomic design principles in a React codebase.

Here’s the Storybook team with a post that breaks down how different teams organize and structure their Storybooks. This kind of analysis is great and demonstrates how you can slice things in many useful ways depending on the needs and […]

I’ve always been surprised to see how people interpret/reinterpret atomic design, but I’ll say seeing atomic design mashed up with Stewart Brand was particularly surprising! Source: The onion for Design Systems: atomic design and pace layering

Like atomic design? Like Pattern Lab? Or even just like chemistry? You can order an atom t-shirt from Cotton Bureau. Thanks Brian for making this happen! 

Atomic design is now over 6 years old (which is nuts!). I’m thrilled that all these years later the methodology continues to help teams think of their user interfaces as a hierarchical, interconnected set of components that build real product […]

I had a great time at Smashing Conf San Francisco, where my session involved live-coding a design system on stage. It was the first time I’ve ever live-coded on stage before and was terribly nervous about the whole thing. Thankfully, […]

Atomic Design has been on sale for about two and half years, and I’m making the decision to stop selling paperback copies of the book. You can still buy the ebook version of the book for 10 bucks in addition […]

It’s great to see that design tools like Figma and Sketch have improved so designers can practice atomic design within them.

Rather than starting out by building out buttons and components (a mistake we made early on), focus instead on building flows and working backward from there. It took hundreds of sketches, brainstorming sessions across teams, wireframes, and mockups to arrive at […]

React, at its core, follows Atomic Design inherently by encouraging developers to keep components as simple and as broken down as possible. From this simplicity, we can create more complex components and containers of components to create the user interfaces […]

I’m excited to share an online course called Working With Atomic Design and Pattern Lab for Gymnasium. Here’s what the course covers: This course will teach students the atomic design methodology, setting up Pattern Lab, building & using UI components […]

This post lays out a lot of the first steps of creating a design system in short order. I enjoy how the author reflected on some of the initial tool and process churn as the team found their bearings. This […]

After putting my daughter to bed last weekend, I crept downstairs to finally hang pegboard and organize the jumble of tools scattered around my basement. And wow, what a therapeutic, enjoyable experience that was! As I was performing this strangely […]

A few people have gotten in touch with witty comments like “Care to comment?” It’s always fun to see people get caught up in labels and nomenclature, but ultimately I think the mental model continues to be helpful (for me […]

TL;DR: Design systems + CSS Zen Garden = Awesome. Is it possible to create a single design system that powers wildly different-looking brands and experiences? The answer is yes! But why would you want to? Different audiences and contexts – […]

I wrote and self-published a book called Atomic Design, and I’m really pleased with how the whole thing turned out. I want to share my experience largely because I think the process has a lot to offer other authors who […]

Adam McClean and Dan Mall had a fantastic chat with Jared Spool about the work we did to help transform About.com into the new Dotdash. We took their monolithic brand and exploded it into a suite of topic-specific brands, with […]

This is fun. I’m a big fan of designing for dynamic content, which is why template and page stages of the atomic design methodology are two separate things. It’s critical to address best case scenarios, worst case scenarios, and everything in between. That’s […]

Josh wrote up some thoughts about the fantastic, previously-shared Full Stack Design System article, which includes a bit where he goes to bat for atomic design. From the original article: Atomic Design will tell you to take some of your […]

Here’s a very kind book review of Atomic Design from Josh Tuck. I remember talking to him about Bob’s Burgers, so I’m glad that made it into the review 🙂

Emmet Connolly underscores the point that simply having a UI pattern library isn’t enough to create successful work across products at an organization. To return to our Lego analogy, simply having a limited pattern library of bricks to choose from doesn’t […]

Ian wrote up some thoughts about how he came into the web industry. By way of being my brother, he had the concepts of modularity and atomic design beaten into him from Day 1 on the job. Perhaps he has […]

I had a great time chatting with my pal Christopher Schmitt about atomic design principles, my book, and a bunch of other stuff. Give it a listen!

I have great news: Atomic Design is complete and is on sale now!  You can pick which flavor of the book suits you best: Paperback for $20 Ebook for $10 Paperback + Ebook for $25 The ebook includes ePub, mobi, and PDF formats so you […]

I had the great opportunity to chat with Chris, Dave, Val, Simon, and Richard about what goes into writing a book. It was fun to hear some the other authors all talk through the same challenges I’ve had (like competing with […]

I’m in the process of wrapping up the manuscript of Atomic Design, and it’s time to begin the copy editing process. Up until this point this book project has been a solo endeavor. Writing this book in the open has been fantastic so […]

I was happy to see The Next Web include modular design as an important trend in modern web design, and of course was happy to see they think atomic design is a good resource for it.

Dan Mall posted an absolutely epic article that encapsulates a lot of the pattern-based concepts the community has been advancing for the last few years. I highly recommend reading it in its entirety. Here are some key highlights I took away […]

Atomic design in one gif.