Brad Frost – Creating Responsive Interfaces

[ Transcript Available ] Brad is joining us to teach one of the daylong workshops in Denver, CO April 7-9 as part of the UX Immersion Mobile Conference. For more information about Brad’s and 5 other workshops, visit uxim.co. Frameworks and design patterns are no strangers in the world of web design. As responsive web design becomes common practice, making sure these templates work across every imaginable screen and device is trickier. There have been attempts to break down page elements in separate modules, but you often never see it fully assembled. Brad Frost shares this frustration and introduces Atomic Design as a solution. Borrowing from the metaphor of atoms making up molecules, molecules making up organism and so forth, Brad thinks responsive design needs to be approached deeper than at the page level. Having these individual modules is great, but how do they all fit together? Designing in this way allows you to be more deliberate and systematic in your approach. Dividing an interface up creates the ability to stitch webpages together but in a way that builds from an atomic level and you can clearly see how you’ve arrived at the end product. This approach to responsive design, as Brad says, serves to solve problems in a very acute way. Recorded: January, 2014 [ Subscribe to our podcast via ?This link will launch the iTunes application.] [ Subscribe with other podcast applications.] Full Transcript. Jared Spool: Welcome to another episode of the SpoolCast. I’m so glad you’re joining us today, and I’m even happier that we have the amazing Brad Frost with us. Brad is a wonder-dude....

UIEtips: Atomic Design

It’s quite common for designers to develop design systems and libraries of patterns. A designer can save a considerable amount of time if they develop a reliable design system. One that goes beyond colors, fonts, grid etc but rather focuses more on how the various elements and parts become a whole. In today’s UIEtips, we feature a post from Brad Frost where he explains a methodology for creating design systems. It’s called Atomic Design. It’s a term rising in popularity. We’re fortunate that Brad is giving a daylong workshop at this year’s UXIM conference in Denver, April 7-9. He’ll show you how your design team can establish a practical foundation to make flexible, adaptive UIs. Learn more about Brad’s workshop, Using Atomic Design to Create Responsive Interfaces. Here’s an excerpt from the article: The thought is that all matter (whether solid, liquid, gas, simple, complex, etc) is comprised of atoms. Those atomic units bond together to form molecules, which in turn combine into more complex organisms to ultimately create all matter in our universe. Similarly, interfaces are made up of smaller components. This means we can break entire interfaces down into fundamental building blocks and work up from there. That’s the basic gist of atomic design. Read the article Atomic Design. Does your company build interfaces using atomic design patterns? Tell us about it...