Posts Tagged ‘pattern library’

Where do you build UI code? That sounds like a dumb question, but it’s a deceptively important one. There’s a few ways to do it: UI code is authored within your application environment. If you’re working on a WordPress or Drupal […]

Dave shared some battle-earned insights about working in a pattern-driven manner and creating pattern libraries. I love his thoughts on the topic, and since I’ve seen this play out in my own work I thought I’d share my own thoughts […]

Erin Malone, who helped create Yahoo!’s pattern library, gives a fantastic timeline of modular UI design. I especially love her emphasis on people sharing what they know, which is how ideas evolve and take root: It’s important to not forget […]

My friend and frequent collaborator Dan Mall wrote up a fantastic post about a crucial part of creating design systems: pilot projects. PILOTS ARE ONE OF the best ways to put your design system through its paces, especially before the design […]

Anna has updated her book on front end style guides! The first edition was amazing, and since then we’ve had a chance to collect a lot of resources on Styleguides.io and interview people on the Style Guides Podcast. It sounds like she was […]

Technically a pattern library is a simple collection of UI components, but in order for design system users do their best work, a pattern library should also present other important info. Let’s take a look at what information can be displayed alongside each pattern […]

Chris Coyier ended the latest CSS Tricks newsletter with some thoughts about style guides. As much as I love style guides, and I love style guides, I wonder if we’re at Peak Style Guide. I’ve seen logos and mascots. I’ve seen dedicated […]

The frontend considerations of an organization are many. We’re overwhelmed by tools, processes, workflows, styles, opinions, and ever-changing best practices. In order for frontend teams to create cohesive, consistent work, it’s important for organizations to establish some guidelines for how […]

Last month I was in beautiful Berlin for the wonderful Beyond Tellerrand conference, where I had the opportunity to talk about style guide best practices and all that goes into creating and maintaining successful pattern libraries. Here’s a video of my […]

The folks at Net Magazine asked if I’d be interested in answering some reader questions about style guides and pattern libraries. Of course I said sure. I answer some questions about container queries and keeping pattern libraries in sync and useful.

There’s a National Geographic article that’s been stuck in my mind for many years now. It discusses how overfishing will destroy the richness and diversity of ocean life if we don’t radically alter our behavior. The post focuses on the decimation […]

On a recent episode of Shop Talk Show, Chris Coyier and Dave Rupert fielded a question regarding style guides and where they fit into the design/development process. Here was the question: I’m working on a redesign for an old website. […]

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

I absolutely love Harry’s post about creating agnostic UI components for more resilient design systems. I get this question a lot: how do I create a component that looks/behaves one way in one context, but another way in a second context? And […]

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

Really cool to see A List Apart hosting a conversation all about style guides, featuring some fantastic people! Looking forward to this.

When discussing a pattern-based design workflow, one knee-jerk reaction I hear from visual designers is that a design system will stifle creativity, leaving everything looking homogeneous and bland. I think there is some validity to this concern, and this sentiment can’t […]

I’m thrilled to announce that Anna Debenham and I making a podcast dedicated to all things related to style guides and pattern libraries. Why We’re Making It Anna and I are firm believers in style guides and think they’re essential […]

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

Style guides and pattern libraries are essential tools to help Web teams maintain sanity while creating experiences for our multi-device Web. The benefits of style guides are many: they establish a common language, make testing easier, save time and effort, […]

The team at education startup Future Learn used atomic design as the backbone of establishing their new pattern library. I especially love how they shared why the first stab at a pattern library didn’t work: Finding specific information was often […]

This is why I love the Web. In a Twitter conversation sparked by someone looking for resources on style guides, we ended up in a conversation that led to a simple suggestion: @Falkowski @anna_debenham Hey you wanna put our heads […]

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

Recently I’ve seen some confusion about designing interface patterns and pattern libraries, and have had a lot of conversations with design/development teams who are struggling with the concept of breaking interfaces down into their component parts. I don't understand the […]

Hey there! I wrote a book called Atomic Design that dives into this topic in more detail, which you can buy as an ebook. We’re not designing pages, we’re designing systems of components.—Stephen Hay As the craft of Web design continues […]

A curated project library for Hammer For Mac. Rock Hammer contains baseline typography, plus styling for common HTML elements including images, forms and tables, as well as navigation, responsive modules and widgets This is awesome stuff from Andy Clarke. Read […]