Non Breaking Space Show
-
- Hosted by Christopher Schmitt
Weekly podcast seeking out the best, brightest, and smartest creatives to find out why they do what they do and how they did it. Free trial plan, no CC required.
Brad Frost — Atomic Design
Episode 103 • Published Jan 25, 2017
Brad Frost is the web designer who created the mental model of Atomic Design. He’s a sought-after designer, speaker, and consultant about responsive design. His new book Atomic Design explains the concept of modular design as well as how to position it in a workflow for multi-device web developers.
This episode of Non Breaking Space Show is sponsored by:
- SVG Summit — A full-day, virtual UX design conference on SVG that you can attend online on February 15th. Free recordings with registration at SVG Summit. Use discount code
NONBREAKINGSPACESHOWfor 20% off. - CSS Dev Conf — Conference dedicated to CSS and its super friend technologies like JavaScript, Sass, NPM, and more. A limited supply of Early Bird Tickets go on sale soon. Register now!
- UX Design Newsletter — A weekly free newsletter containing a collection of tutorials, articles, and videos about frontend design and development, plus tips on how to bring better engagement to the multi-device world curated by Christopher Schmitt.
- Feed.Press — Hosting and feed support provided by Feed.Press. Sign-up today and try FeedPress on a 14-day trial (no contracts or commitments). Use promo code
NBSPduring checkout to get 10% off your first year.
Feed and MP3 files are proudly hosted by Transistor.fm. Learn how to start your own podcast.
Video
Links and Show Notes
- Brad Frost
- Brad Frost on Twitter
- Brad Frost’s blog post on Atomic Design
- Dave Olsen on Non-Breaking Space Show #86 talking Pattern Lab
- Bootstrap
- Foundation
- Pattern Lab
- Brian Muenzenmeyer
- Lamp Stack
- Pattern Lab
- Tiffany & Co.
- Artifact Conference
- Shopify
- Brad on GitHub
- Atomic Design on Github
- DeployBot
- The book, Atomic Design, free online version
- Buy Brad’s Frost Atomic Design book
- Ron Popeil
- Owen Gregory
Jump to a conversation on…
- 3:10 Introduction
- 3:40 Brad describing Atomic Design
- 5:01 5 Distinct stages of UI
- 8:02 Organisms and hierarchy of a webpage
- 10:40 Introduction of pattern lab
- 12:30 Pattern lab is really plain, you have to bring your own vision, it’s a workspace
- 16:16 UI Auditing, consistency and patterns of website forms
- 18:02 How to introduce people to change and convince them that change is good
- 21:04 Communication with boss, don’t ask permission because boss only cares about end result
- 23:30 We’re already doing things like Pattern Lab - we just need to be more aware of it.
- 24:35 Don’t ask for permission, ask for forgiveness after.
- 27:01 Don’t need to go vertical for approval, talk with your colleagues
- 29:01 29:30 Example of how responsive experience works
- 30:03 Approval by way of conversion instead of convincing
- 31:30 Working without boss approval to make a bank site responsive
- 33:01 Page concept is out of date and from process standpoint doesn’t serve it’s use
- 34:20 Keep language the same, call it a webpage, but make website an ecosystem not a printed page
- 37:05 Keeping things above the fold
- 38:03 Using open source for writing the book and book deployment
- 41:45 Contributions to the book from others
- 45:19 How to find the book
- 48:15 Ending the interview with thanks