Posts Tagged ‘pattern lab’

Subscribe via RSS
  1. 22 Nov, 2019

    Atomic design / Pattern Lab logo shirt

    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! 

  2. 26 Apr, 2019

    Let’s Make A Design System! Live Coding at Smashing Conf

    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, […]

  3. 08 Nov, 2018

    Designer+developer workflow: more head-down work

    As part of Dan and my designer+developer collaboration series, I recorded another video building upon the work we’ve done so far. If you’re not caught up, feel free to watch the other videos: Video 1: Designer+Developer pair session Video 2: […]

  4. 10 Aug, 2018

    Designer + Developer Workflow

    I’ve had the extreme privilege of collaborating on a bunch of projects with my friend Dan Mall (@danmall) over the last five and a half years. Dan is a designer. I’m a developer. And together, we’ve been refining our process to […]

  5. 09 Jul, 2018

    Working With Atomic Design and Pattern Lab Online Course

    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 […]

  6. 03 Oct, 2017

    What’s Next for Pattern Lab

    Pattern Lab is an open-source tool for building UI design systems. I’ve been using it to build production-ready frontend code for the last four and a half years, and I’m watched it grow from humble beginnings into powerful software that […]

  7. 16 May, 2017

    The Workshop and the Storefront

    My wife is a jewelry designer. She has a workshop where she spends much of her time hammering, soldering, tinkering, shaping, sawing, buffing, polishing, experimenting, and iterating in order to produce gorgeous designs from a slew of shiny metal materials. Her […]

  8. 25 Apr, 2017

    Designing for Edge Cases

    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 […]

  9. 30 Aug, 2016

    CSS Tricks Screencast #149: A Quick Intro to Pattern Lab Node with Brian Muenzenmeyer

    Brian walks Chris through Pattern Lab, including how to get it up and running, make changes to patterns, etc. Great stuff!

  10. 04 Jan, 2016

    Content and Display Patterns

    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 […]

  11. 13 Dec, 2015

    Brian Muenzenmeyer on MS Dev Show

    Brian Muenzenmeyer (@bmuenzenmeyer) appeared on the MS Dev Show to talk about Pattern Lab Node and his involvement with the project. He does a great job explaining atomic design, defining the Pattern Lab project, and explaining its benefits to the hosts. […]

  12. 12 Dec, 2015

    Pattern Lab Node 1.0.0 Released

    Brian Muenzenmeyer (@bmuenzenmeyer) has done a fantastic job of bringing Pattern Lab Node to life, and it’s now officially in 1.0 status. Brian wrote about what’s changed, and I’m exciting to see things moving forward! Speaking of moving forward, Dave Olsen is working […]

  13. 04 Sep, 2015

    Pattern Lab Exporter

    Pam Griffith created a script to migrate patterns from inside of Pattern Lab into a CMS. She wrote a post explaining a bit more about the project: So I’ve been playing with making a conversion script that takes the patterns from […]

  14. 06 Jul, 2015

    City of Los Angeles Pattern Lab

    It’s really cool to see Los Angeles using Pattern Lab to make and maintain their website’s style guide.

  15. 25 Jun, 2015

    Sketch, Iterate, Repeat: Prototyping Your Website Design

    Andrew Smyk (@andrewsmyk) discusses how he iterates on his web designs. There’s a strong focus on getting ideas out of his head and onto paper as quickly as possible, which is excellent. I enjoy how he cuts up his sketches to play with […]

  16. 08 Jun, 2015

    Style Guide Best Practices Presentation

    I recently spoke at An Event Apart in San Diego where I presented on the whys, whats and how’s of style guides. Here are the slides: And here are some resources I reference in the talk:   Style Guide Types […]

  17. 11 May, 2015

    To the Pattern Lab! Collaboration Using Modular Design Principles

    If you’re into Drupal and interested in Pattern Lab, this session at DrupalCon in Los Angeles looks like it fits the bill!

  18. 20 Apr, 2015

    The What and Why of Pattern Lab

    Dave Olsen (@dmolsen), the beloved developer of the Pattern Lab project, gave a great presentation about why Pattern Lab matters and what it can do.

  19. 29 Dec, 2014

    Keeping Pattern Libraries in Sync

    Marcelo Somers responded to my style guide best practices post with some thoughts on how to keep pattern library and production CSS/JS in sync. There’s some great stuff in there, however I’ve found the CSS and JS aren’t the difficult […]

  20. 24 Nov, 2014

    University of Dammam build blog part 1: Using Drupal’s Panopoly distribution and Pattern Lab

    The team who redesigned the University of Dammam website used Pattern Lab to construct the front-end and to use it as a living style guide for the site. More from the article: An important deliverable for this project was a […]

  21. 19 Nov, 2014

    Harvard Business Review Pattern-Lab Team workflow

    It’s so wonderful to see teams using Pattern Lab to launch successful projects. In fact, it makes me a little teary-eyed. In this case, the Harvard Business Review team used Pattern Lab to create an interface design system for their […]

  22. 18 Nov, 2014

    Style Guides

    It’s becoming increasingly necessary to be consistent and cohesive across an ever-growing number of media channels. As it turns out, that’s no easy task. That’s why organizations, companies, and brands are turning to style guides to establish sound footing in […]

  23. 14 Nov, 2014

    Bad day at 350 N. Orleans: Anybody home at Sun-Times?

    So this is hilarious. The Chicago Sun-Times website went live with placeholder content. Not just any placeholder content, but my placeholder content! I’ve been using the grayscale images for years now (on This Is Responsive pattern demos), but added the […]

  24. 13 Nov, 2014

    The Death of Lorem Ipsum & Pixel Perfect Content

    Dave Olsen (@dmolsen) nails it. In his talk at Confab EDU, Dave addresses the frustrations of our web design and development process, and how a pattern-driven workflow can help. Dave describes the many benefits of pattern-driven workflow: Patterns encourage communication […]

  25. 10 Nov, 2014

    Frost Finery

    My amazing wife Melissa (@minifrost) has launched a new jewelry studio called Frost Finery. For the last few months she’s been hard at work sawing, soldering, laser cutting, water jetting, buffing, stone setting, welding, centrifuging, hammering, and filing. The result […]

  26. 15 Oct, 2014

    Working with Atomic Design by Berit Hlubek

    Berit Hlubek gave a great presentation (slides here) overviewing atomic design and Pattern Lab.

  27. 11 Oct, 2014

    Working with Atomic Design

    Berit Hlubek created a fantastic deck about atomic design, Pattern Lab, and how to apply it to a real-world project. It’s so great to see other people successfully using atomic design principles to create great work. Very inspiring.

  28. 26 Jun, 2014

    Designing with Dynamic Content

    A lot of visual designers I’ve worked with have convinced themselves every user’s name is “Sara” without an “h”. For most of my career I’ve had to battle designers creating incredibly unrealistic best-case scenario mock-ups. You know what I’m talking […]

  29. 29 May, 2014

    Using Grunt with Pattern Lab

    Grunt is a powerful Javascript task runner that can make your web design workflow much more efficient by automating a slew of tedious tasks. Pattern Lab is a tool created by Dave Olsen and myself to help you efficiently create […]

  30. 18 May, 2014

    Atomic Design at InControl

    Here’s the video of my talk on Atomic Design at InControl Orlando 2014.