An inside look at the Pattern Library

By YUI TeamDecember 7th, 2007

As the third curator of Yahoo!’s Design Pattern Library I often receive a lot of thanks and praise from website designers and developers for the way we at Yahoo! have offered this resource to the world. I usually try to explain that much of the goodness happened before I came on board and that I can’t really take credit for it, but when my ego needs a boost I just smile and nod.

When Erin Malone and Matt Leacock and others first launched the internal pattern library, they presented a talk at the IA Summit, called Implementing a Pattern Library in the Real World: A Case Study (and subsequently the linked article on the same topic at Boxes and Arrows). Then Erin and Bill Scott took the library to the public on the Yahoo! Developer Network website and Bill Scott enriched the library with tons of Ajax-y goodness, closely tied to the YUI Library.

Since that time, I came on board and I’ve worked on reorganizing the library, updating the patterns, and shepherding a new generation of patterns through our internal refinement and review process, with an eye toward identifying useful social and openness patterns that we can share with the whole Web. So when people come up to me at conferences or find me on mailing lists for information architects and interaction designers frequently they are curious about how the library has evolved in the years since it was founded, what our internal process looks like these days for writing, reviewing, approving, and rating patterns, and how we decide which ones to publish in the open library.

Recently, I gave a talk here at Yahoo! as part of our UED brown-bag series, called The Pattern Library Wants YOU!, intended to update oldtimers on changes and improvements to our process and infrastructure and to orient new designers about the library, and of course to encourage people to get involved. Ricky Montalvo, our ace videographer for YUI Theater and YDN Theater, recorded my talk and edited it together with my slides, and we just spent a week or so removing any too-sensitive information and getting our friendly legal folks to sign off on releasing the talk to the public.

So, without further ado, here is the public version of my talk, which should answer a lot of those questions I’m hearing these days.


  1. This probably sounds jerky, but this sentence rubs me the wrong way: “Developer Network website and Bill Scott “enriched” the library with tons of Ajax-y goodness, closely tied to the YUI Library.”

    Why is the word enriched in scare quotes? It implies that you don’t think the library was enriched at all, but perhaps that it was damaged by the addition of the YUI behaviors.

    And could Yahoo possibly start leading the charge to stop using the stupid term “Ajax-y goodness?” Aren’t we mostly professional interaction designers around here? This childish phrase trivializes a transformative technology. You’ve got several developers at Yahoo doing astonishing work pushing web development forward, yet this kind of smirking term just makes it sound like it’s something “cute” or “flashy” to sprinkle on top of the real stuff.

  2. Evan, I apologize if my tone offends you. That’s actually the way I talk and was not intended to diminish or otherwise disparage the wonders of Ajax techniques or RIA’s in general.

    In fact I put the quotation marks around enrich to signal that it was a play on the conept of rich interactions (perhaps I should have used an emphasis tag instead?) and similarly I qualified Ajax merely because our patterns are actually implementation-agnostic.

    I do appreciate the feedback and look forward to comments on the vid and not just on my introductory blurb.

  3. As a recent former yahoo, I can see how this is a good video to distribute in Backyard. But on the public blog, I have to say that most of this is a waste of the public’s time.

    If there were 2 minutes of content that would actually be useful for the public, I’d love to see that blogged here… but otherwise, you’re doing yourself a negative favor by wasting 40 minutes of my time on stuff that is irrelevant to me.

    What did I expect? I’d like to have seen an overview of new or recently-updated patterns. Or an announcement about a newly-updated site for patterns, with the promotional material about how it’s useful, where we’ll see it being applied at Yahoo, that sorta thing.

    Okay, I’m out. Hope this helps!

  4. Is there a .m4v download available for this video?

  5. Thanks for the feedback, Randy. I tried to make it clear in my intro what the discussion referred to and who it might interest. As I said, there are folks out there creating and managing their own pattern libraries who are hungry for insights into how we do it here. They are no doubt a small percentage of the web-developing public but I hear from them all the time.

    That said, I think your description of your expectations comprises an excellent wishlist of items I can try to address in the near future.

    Thanks again for the comment!

  6. Thanks so much for posting this. For other companies trying to implement a pattern library, this is a huge help. All the background info can really help people understand the governance issues behind the pattern library, especially for large companies.

  7. Good god!

    Way to roll with the punches, at least you’re contributing something. I just find it so brutal for anonymous people to bite your head off for trying to share some knowledge and insight. Thanks for posting and updating the pattern library.

  8. [...] An inside look at the Yahoo Design Pattern Library (tags: patterns design yui) [...]

  9. [...] An inside look at the Pattern Library » Yahoo! User Interface Blog [...]

  10. xian, as someone who sought the Y! pattern library team leads past and present to learn from, i’m glad to see you sharing more about it. we talked about a pattern camp, and i think a lot of us would dig that. as we get towards launching our pattern library, the insights from you, erin, matt, and bill gave us an advantage. the hidden feats are understanding workflow and how your team processes that.

    and good job on taking the punches by turning the other cheek. corporate initiatives either make you bitter or better.

    happy to call myself a pattern library curator,

  11. Actually it looked more like a recruiting video than anything else.
    Shame we couldn’t hear any of the questions after, or were there none?

    I was looking thru the public patterns and I saw loads of things regarding social networking and ‘binding’.
    One thing I was looking for were good techniques in dealing with ajax calls, return data, errors and ‘now what’. Like for example sending back javascript functions (unsafe? but sexy!) vs monolithic clientside statemachines.
    This is probably leaning heavily towards implementation specific, yet something could be said about it on the abstract level. I don’t know that there are other protocols we have that are able to redefine themselves on the fly.

    Anyway, I generally liked the talk.