Pattern Languages for Interaction Design

An Interview with Erin Malone, Christian Crumlish, and Lucas Pettinati

Will Evans stalked and captured Erin Malone, Christian Crumlish, and Lucas Pettinati to talk about design patterns, pattern libraries, styleguides, and innovation. Erin, Christian, and Lucas are leading a workshop on design patterns at this year’s Interactions in Vancouver; and, Erin and Christian are writing a book on patterns for designing social spaces for O’Rreilly.

An interaction design pattern is not a step-by-step recipe or a specification. It’s a set of things we’ve learned that tend to work in clearly defined situations as well as some known issues that need to be balanced or sorted out or otherwise addressed. A pattern is closer to a checklist than to a mock or a wireframe.

*How did you get your start in Interaction/Information Design?*

*Christian Crumlish (Xian):* I came from book publishing where I wore many hats over the years (editor, author, agent). I ended up in technical publishing (“computer books”), an aftermarket made possible by shoddy user interfaces. This piqued my interest and the Web democratized information architecture, interaction and interface design.

*Erin Malone:* I actually started out as a print designer and Art Director. I went to grad school at RIT around the peak of CD ROMs. I did a project in Hypercard (in 1993). I thought I was going to do interactive education CDroms when I graduated but then the web happened. I taught myself HTML and came out to California to build Adobe’s first website, and I’ve been doing web applications and interactive work ever since.

*Lucas Pettinati:* I studied Architecture in college after realizing that one doesn’t learn how to design GUIs in a Computer Science program. My first job out of college was at an internet startup where I did general design work but it wasn’t until I created a user flow diagram that I fell in love with the principles of IA and Interaction Design.

*Who do you look to for inspiration?*

*Lucas:* I’m a huge Edward Tufte fan and am always trying to think of ways of displaying information. One of my oddest inspirations came from a Piet Mondrian painting; it helped me visualize a way to display a cluster of available flights relative to their price and departure time.

*Xian:* I steal from everyone. I think we should be careful not to throw out too much of what we knew from print design and layout, typography and rhythm.

*Erin:* I am a big proponent of looking to the past as well as the future. My work is very grounded in what I learned as a graphic designer – typography, color theory, readability etc. I have recently added motion and time as factors to design for. I also believe in looking at nature for inspiration – how things interact, human gestures, the landscape. Etc.

*Christopher Alexander, in his book, “A Pattern Language,” and his talks and papers seems to come from an ideological perspective. What role do you think ideology has in interaction design and in patterns in particular? Do you sometimes face questions or issues where your design decisions are influenced by political, ethical, or ideological considerations?*

*Xian:* For another time perhaps we can address how the pattern language movement has evolved and splintered since Alexander et al.’s beginnings. I think there is always an underlying ideological set of assumptions, examined or not, explicit or not, transparent or not.
That’s only a good thing if you make it so.

*Erin:* I think having a grounding behind the decisions you make is important. Ethics play a big part in many people’s decisions – in the type of work they do as well as the way to design a certain interaction. Being ethical and non-destructive is important as a designer. I think Alexander wanted to enhance and support the human condition and propagate positive interactions between people. That was the ideological perspective for his approach to developing a pattern language. I don’t see anything wrong with having that same attitude as an interaction designer.

*Xian:* I’d say if anything I see ethical dimensions to design problems more often now than ever before, perhaps because of the way our always-on digital interfaces are permeating everyday life more and more thoroughly. In fact, Erin and I agree that there are ethical factors in at least _some_ of the patterns in our forthcoming book, Designing Social Interfaces.

*I’m interested in your take on building corporate pattern libraries. Some companies, like Endeca, are creating a proprietary library for faceted navigation. Is there is an obligation for practitioners to share their design patterns?*

*Lucas:* No, there shouldn’t be an obligation to share a design pattern – but much like the Open Source software movement, I think the future of pattern libraries lies with the participation of a broad community. The important thing to remember is that design patterns are living things. They can evolve over time and are adapted and refined as new technologies emerge. For example, a mere five years ago, the gesture-driven interfaces were in their infancy. Today, we have devices like Apple’s iPhone that rely on flicks, pinches and drags as core patterns for how to interact with the device.

*Good point – and in fact, gestural interfaces have now become such a part of the mainstream—between iPhones and those election maps on CNN—that people in our field aren’t surprised to see Dan Saffer’s new book, “Designing Gestural Interfaces”.*

*Christian, do you agree with Lucas that there’s no obligation to share? Do you think they should be open so they can evolve and become more widespread?*

*Xian:* I don’t personally think there’s any inherent obligation (certainly not in the sense of a mandatory, enforceable one) to share patterns. Over time un-shared patterns probably have limited utility. Patterns are a bit like tamagotchi. If you don’t keep tending them they die, and they’re social in the sense that they thrive and become more refined and useful and subtle the more people are able to engage with them.

*Erin:* For every corporation out there interested in building their own library, almost all of them will want to keep some, if not all, proprietary. I believe that as firms create their own library, they’ll see benefits in adopting open and shared patterns. After all, why reinvent the wheel when there’s already a fine, well-adopted and understood approach to a problem. On the other hand, they will develop a subset of highly proprietary interactions that become brand differentiators. These are the things they can patent and call attention to in a competitive landscape. After a certain point, though, many of these patterns will become part of the vernacular landscape and therefore more open.

…a subset of highly proprietary interactions [can] become brand differentiators. These are the things [companies] can patent and call attention to in a competitive landscape.

*Is a private corporate pattern library simply a style guide? People sometimes confuse the two. How are they different?*

*Erin:* In my mind, the pattern library is the architecture of the system, and the style guide is the wallpaper and paint color. The brand and style guide may change more often than the patterns — the interaction solutions. A certain instance of a pattern — with it’s skin and specific points of interaction and behavior — may also be promoted to a standard in the style guide for various companies as part of their brand experience and there’s nothing wrong with that.

*Xian:* Pattern libraries are often presented as an alternative to, and improvement over, corporate style guides. This is usually based on the idea that they tend to be maintained on an intranet as living repositories rather than as occasionally published brand guidelines in a binder on your shelf. Secondly, a case can be made that thinking in terms of patterns and following one of the semi-standard ways of exploring each pattern can provide for more stable, longer lived guidelines that aren’t as brittle as specs (though they can and should of course point to today’s specs and assets).

*So you fundamentally believe that the difference may lie in their velocities and life span?*

*Xian:* Yeah – To clarify, patterns are on a slower pace layer than most style guides, but the truth is that — yes — you could safely describe most real, existing pattern libraries as a kind of style guide, but a living, moving one.

*Lucas:* It’s easy to get all these different tools — corporate guidelines, style guides, brand values, etc. — mixed up with a pattern library. Pattern libraries address the need of a consistent interaction. Analogously, style guides address the need of a consistent aesthetic, and brand values address the need for a consistent outward image. Though they each serve a unique purpose, my opinion is that keeping these tools as separate entities is by far the easiest way to ensure that design quality will suffer. Integrating of all these different design tools with an engineering code library is what — I believe — is at the heart of a successful plan for communicating design consistency across an organization. This should be the heart of a private company’s pattern library — a way to provide interaction, visual, and engineering consistency for a range of products.

*I have heard it argued that use of design patterns and pattern libraries removes creativity and innovation from the solution-finding process? Do these criticisms have merit?*

*Xian:* I don’t really think that argument holds water. I do understand the concern, and it’s totally possible to apply patterns mindlessly or to force their use inappropriately, but, to my mind, patterns focus innovation and creativity on the leading edge of the problem: the unsolved part.

*Lucas:* As designers, we all want to innovate and take a crack at defining the details of a design. In that respect, using a pattern library does constrain some of the choices that one makes. But this is a very superficial way to look at the benefit of using a pattern library . In reality, a pattern library should house the _archetypes_ of common interactions and help the designer select a solution that best fits the current project. Projects have deadlines and the use of a pattern library helps designers quickly — and confidently — craft parts of a design so the bulk of their time is spent designing what’s unique, rather than what’s common. Think of it this way: the pattern library is like a compass. It’ll tell you what direction you should go in, but it’s up to you to figure our how to get there.

“…The pattern library is like a compass. It’ll tell you what direction you should go in, but it’s up to you to figure our how to get there.”

*Xian:* An interaction design pattern is not a step-by-step recipe or a specification. It’s a set of things we’ve learned that tend to work in clearly defined situations as well as some known issues that need to be balanced or sorted out or otherwise addressed. A pattern is closer to a checklist than to a mock or a wireframe. Patterns can’t do the design for you.

*Erin:* I agree with Christian here. Critics say patterns remove creativity. But that’s like saying that having only 64 crayons in the pack removes creativity. Constraints are a fact of life. Patterns are just tools to guide decisions. Converting every pattern to a component solution with skin and code will limit a designers options but they still have to resolve how it will all go together in a cohesive way — how the hierarchy of information guides the user; how pieces move from one into another; how to keep things from clashing or being confusing. And, in almost every design problem I’ve seen, there are also one-off, new problems to be solved. So I think the criticism is a cop-out.

*Xian:* Agreed — and of course some pattern libraries are really more like catalogs of UI widgets, and a catalog of widgets can be slapped together to create poor design, but I don’t think you can pin that problem on patterns.

*Okay, so patterns don’t kill innovation, people do! Taking a different tack, do you think the use of design patterns and libraries are an effective way to train people new to interaction design?*

*Xian:* I think it’s part of a well balanced breakfast, but there are a lot of fundamentals of design, interaction, and information that come first.

*Erin:* Pattern libraries are tools. Just like having a stencil set and understanding of things like gestalt and readability. The library can be a great reference for designers to start with, to help uncover questions and considerations they might not have considered before, as well as offer ideas for quick solutions to easily solved problems.

*Lucas:* Consuming pattern libraries does not in and of itself create good interaction designers. Writing patterns, on the other hand, is something I feel helps new interaction designers better understand why some designs work and others don’t. Anyone interested in becoming an interaction designer should understand that even when using pattern libraries, there’s an awful lot of original design needed to complete a project.

*”Designing and Building with Patterns and Pattern Libraries” workshop at Interactions ’09*

Erin, Xian, and Lucas are leading a patterns workshop at Interactions ’09 in Vancouver. “Designing and Building with Patterns and Pattern Libraries” is a hands on workshop where participants will come away with some practical experience spotting patterns, describing them, and thinking about how to apply them to design work.

You can find out more about the workshop on the Interaction ’09 website: “http://interaction09.crowdvine.com/talks/show/2574″:http://interaction09.crowdvine.com/talks/show/2574

Christian and Erin’s book, Designing Social Interfaces, has a website where you can contribute to, refine, and discuss social design patterns: “http://designingsocialinterfaces.com/ “:http://designingsocialinterfaces.com/

Posted in Deliverables and Documentation, Interviews, Learning From Others | 13 Comments »

13 Comments

  • Todd Zaki Warfel

    January 27, 2009 at 12:33 pm

    Great article. I think the compass quote is one of the best analogies for patterns. I’d also agree that while there’s no technical obligation to make pattern libraries public, it is the responsible thing to do. Looking forward to your book. Keep up the great work, gang.

  • Anders Toxboe

    January 27, 2009 at 1:12 pm

    You forgot to link to the different libraries out there…

    http://developer.yahoo.com/ypatterns/
    http://welie.com
    http://ui-patterns.com

    And a bunch more…

  • Don Habas

    January 27, 2009 at 5:15 pm

    Thanks Will. Great article.

  • shivan kannan

    January 28, 2009 at 9:53 am

    This is an excellent article. It is indeed true that open sourcing the patterns has all its goodies. Would be nice to give pointers at the end that are relating to the article.

  • emily conrad

    January 28, 2009 at 2:59 pm

    This is a great article and very topical. I mentioned the idea of a pattern language to a client of ours last week, and after explaining the benefits they got it. UX doesn’t need to be a rigid set of rules, but logical guidelines that yield innovation.

  • Will Evans

    January 28, 2009 at 3:49 pm

    Anders,

    Very good point – I should have included links to all the various pattern libraries out there. I’ll gather some and post them in the comments for now, and if it gets to onerous – a blog posting.
    Here’s one that Xian is curating:
    The Designing Social Interfaces patterns wiki
    http://www.designingsocialinterfaces.com/patterns.wiki/index.php?title=Main_Page

    Of course, Jen Tidell’s http://designinginterfaces.com site has a lot from here book, right there on the site, and very useful!

  • Christian Crumlish

    January 28, 2009 at 4:11 pm

    I have been maintaining a list of pattern libraries and am also in the process of completing a redesign of the Yahoo! Design Pattern Library, which will include a section where that list can be shared. If anyone else has such a list I’d be equally happy to point to it. Ideally, I’d like to distinguish “true” pattern libraries from catalogs of visual examples of patterns.

  • Erin Malone

    January 29, 2009 at 7:09 pm

    We are constantly adding related pattern sites to the Designing Social Interfaces wiki – which is the companion wiki to the book I am writing with Christian. Additionally Bill Scott has a list on his Designing Web Interfaces site.

  • Christian Crumlish

    January 30, 2009 at 1:07 am

    Just added a few more to our list (the same one linked in Erin’s comment above)…

  • Mike Schindler

    January 30, 2009 at 3:24 am

    It’s good to see several practitioners essentially agreeing on the purpose and value of patterns. Design to me is about problem solving — or resolving different tensions, which are typically unique on a given project. The peril of improperly using patterns (forcing a solution into a problem) often ends up counter to the fundamental benefits of pattern use. Efficiency and consistency can both be used to a fault and often times hurt a design. Rather it’s better to really understand the problem first, and then use patterns as a starting point.

    Excellent article.

  • Carlos Abler

    February 6, 2009 at 6:46 pm

    Awesome stuff.

    I think organizations that try to make these things proprietary is a waste of time. Extending what was said in the interview, this is definitely one genre of knowledge that will become highly refined in the discourse field of general practice.

    What organizations should be focused on is not reinventing the wheel or trying to create a walled garden in a jungle, (I love mixing metaphors), but they should be focused on how to educate their staff about them. They should create/aggregate handy reference tools and provide training so that staff knows where to look and when.

    The competitive problem — for those who care to be competitive — is not who has the best interaction design pattern library, it is which organization is the best at implementing the right patterns for the right solutions.

    Carlos

  • Peter Meany

    February 9, 2009 at 10:30 pm

    Cool discussion. I especially liked the back and forth on corporate, proprietary pattern libraries vs. the notion of open sharing of UX patterns. I’m for the open sharing of patterns and believe most patterns implementations are unique anyway to some degree.

    My UX team just released Quince, a free UX pattern explorer that is designed to allow easy access to a large pattern library and to foster a UX community where people don’t have to “reinvent the wheel” to solve common design problems.

    Check it out: Quince.Infragistics.com. We hope to add to the library through our own exposure to new patterns as well as through contributions by community members.

    Peter

  • David Lumerman

    February 19, 2009 at 12:19 am

    Interesting dialog.

    I have found that in the corporate setting design patterns help management to accept the consistency that design patterns bring as well as providing a comfortable space for buy in.

    They also help reign in developers and Content Management Application (CMS) user when they want to go off the reservation by pointing to established templates instead of speaking to generalities of consistency.

Sorry, comments are closed.