My Yahoo! years

This post has turned out to be a lot more difficult to write than I expected. Last Tuesday was my final day at Yahoo! I wrote a valedictory post for the YDN blog as my official signoff.

It wasn’t easy resigning from Yahoo! I started working there more than three years ago and had a splendid time throughout. I met a slew of incredibly talented, brilliant people. I learned a lot about the pros and cons of large companies (and what can happen after a startup experiences hypergrowth). I expanded my network and became a much more visible member of the global user experience (aka “UX,” although I’m leaning toward describing it as “digital design” these days) community.

I’m leaving a lot of friend behind there and I expect to keep in touch with all of them. These days with the twitters and such, that shouldn’t be too difficult.

Beyond my work on the Yahoo! Design Pattern Library, and the social design patterns project, I’m most proud of my involvement with Yahoo!’s Open Strategy, from the earliest days of formulating and fleshing out the strategy, to the difficult, slow, but fruitful efforts to rewire Yahoo! and expose more and more of the underpinnings and utility features to the large web developer community. If you haven’t checked out YQL, for example, you really should.

Right now, I’m on a very brief hiatus between jobs. I just got back from a long overdue return to the New Orleans Jazz & Heritage Festival, today I’m speaking in Minneapolis on the UIE Web App Masters Tour, and on Friday I start my new job. More about that in my next post.

Talking patterns, openness, and community with the Tummelvision crew

Oh, cool! Heather posted the Tummelvision episode I appeared on a couple of weeks ago.

Tags as collecting behavior

When I first started curating the Yahoo! Design Pattern Library, I put “tags” near the top of my list of user interaction patterns to investigate. By that time, Yahoo! had already acquired several pioneers in the tagging realm, Flickr and Delicious, and there were some subtle distinctions in how they implemented the experience.

We got down in the weeds on these and did a lot of research, ultimately settled on offering high-level guidance, and finished the patterns in the course of writing the social patterns book, where we filed tagging under the group of patterns known as Collecting, under Social Objects.

Tagging and other forms of collecting are also an example of social design patterns that mimic game dynamics. Collecting objects is a core “easy fun” activity in many games, and similarly these extremely lightweight social interactions around gathering or tagging objects enable a form of self-interested behavior that creates aggregate value and potentially richer forms of engagement.

Our three new tagging patterns are Tag an Object, Find with Tags, and the somewhat controversial Tag Cloud, which some people view as an “anti-pattern.” Drop by, check them out, and let us know if we can make them any better.

Reposted from Patterns: Tag Collection (Yahoo! Developer Network Blog).

New navbar patterns in the Yahoo! library

Over the past few months I conducted an audit of the patterns in Yahoo!’s internal design pattern library, with an eye toward publishing as many of them as possible in the open library at YDN. Why? Well, for one thing, to get more eyeballs on them, to gather more feedback and keep improving the patterns. Also, since very few patterns in the library contain Yahoo!-specific information, and an alternative process is now in place for vetting requirements specific to the Yahoo! network and brand components, the design pattern collection can now more easily focus on (relatively) universal design principles for web implementations.

I completed the audit before the end of last year and expect to release new patterns in batches over the next few months. Some patterns will be mature and provide a solid foundation for site design. A few will be published as beta patterns which may undergo significant changes in subsequent updates based on feedback received. Regardless of their status, we hope you’ll get involved and review and provide feedback on the patterns provided.

The first batch of patterns to come out from the audit relates to navigation bars. There are three patterns so far in this grouping: Top Navigation, Left Navigation, and Progress Bar. One legitimate question is whether top and left nav bars are still the best or most current way to navigate a site and find content? We still find many examples of them across the web and in use at Yahoo! so for now I’ll say yes, but it’s worth thinking about.

Wherever possible I try to link patterns back to the YUI Library and, where appropriate, to other code and implementation solutions. YUI has great support for navbars and menu examples. Probably the best place to start is the menu widget.

One interesting nomenclature issue we studied was the distinction between a stepwise progress indicator (which is what the pattern is about) and a continuous progress bar (for which there’s a great YUI example). These two things are often referred to with similar names, but perform different functions. Suggestions for more appropriate terminology are welcome.

Please check out these new patterns and let us know what you think!

Reposted from Three new navigation design patterns » Yahoo! User Interface Blog (YUIBlog).

Putting the social in the mobile

My continuing series of blog posts linking to essays published in our book, well, continues now with Billie Mandel’s Designing Social Interfaces for Mobile, in which she writes:

Contextually speaking, mobile phones are by definition social networking devices. Breaking out of the classic phone/phone book mental model and transforming that experience to include 21st century-style social networking, though – that’s where the fun challenge is for designers. Asking ourselves some mobile-specific questions can lead us as a community to create some exciting, disruptive social interfaces for mobile.

See also her essential list of do’s and don’ts.

(Bit by bit we are making sure all the essays are available online, either hosted on their authors’ blogs or personal websites or in some cases included in the project’s wiki, where we’re maintaining a list of essays.)

Talking social patterns with thriving UX communities in London and Berlin

A week or so ago I undertook a whirlwind visit to the UK and the Continent, giving two presentations about design patterns and social design, one in London on Tuesday, and another in Berlin on Thursday, each event sponsored by YDN (and the one in Germany co-sponsored by the local IxDA group).

The London event was in a wonderful gallery/cafe venue called Wallacespace filled with a standing-room only crowd. I was pleased to see a couple of friends from the international UX community there and the audience as a whole was wonderful, attentive, and ready with interesting, challenging questions for me when I was done.

Afterward we ate some snacks and drank some beers courtesy of YDN, before heading over to a nearby pub for more beers and conversation. This was my first time back in London in fourteen years and I was impressed by the vibrancy of the web-design community in what may be the “capital” of the Web in Europe.

The next day I headed to Berlin, where a pal picked me up at the airport and helped me get settled in my hotel in Alexanderplatz. It’s actually been 20 years since I was in Berlin! Back then, the Wall had only recently been dismantled and the east was frozen in a sort of time capsule due to economic stagnation. A lot has happened since Berlin reunited and resumed its role as the capital of Germany and arts mecca of Mitteleuropa. In fact, there was a fashion convention going on during my visit, so the airport and hotel were full of people who made me feel, in comparison, more like a geek than a designer.

East Berlin is now full of trendy gentrified neighborhoods. I had lunch at a burrito place (!) called Dolores that’s decorated with maps of the Mission in San Francisco. Clearly the internet-savvy crowd in Berlin feels a kinship with our own community in the Bay Area.

Berlin is also the home of a thriving local Interaction Design Association (IxDA) group, which helped secure the venue for my talk–(Newthinking Store) and helped promote and publicize my talk. I had a chance to meet some longtime virtual acquaintances from the IxD and IA communities in Berlin, such as Jan Jursa, of IATV and the Berlin IA Cocktail Hour.

The Berlin talk was also full, and again I was blessed with a generous and attentive crowd. More great questions. (We did the whole evening in English. Try as I might to speak slowly, I still probably spoke a bit too fast at times but just about all the German I know is noch ein Bier, bitte so it’s just as well.)

One interesting difference between the two groups is that the folks in Berlin asked me more process questions: How was the social design project organized? How did the wiki figure into the writing of the book? What’s an unbook? and so on. The questions in London tended to be more about the efficacy of design patterns in general and the application of social design patterns.

At both sessions, certain attendees had reached out to me in advance over Twitter and proposed questions that they had a chance to ask at the events. In London and again in Berlin I was asked the perennial question about whether the use of design patterns stifles innovation. My traditional answer, “No. Now shut up and do your wireframes!” got a laugh in both settings as well. (My real answer: “Not if they are applied as guidelines and with sensitivity to context.”)

One other curious difference between the two events was that the audience in London had nearly perfect gender balance, whereas the one in Berlin was, by my estimate, about 90% male. I’d like to learn more about what the differences are between the web design and development communities in the two cities that might account for that variance.

I’d like to thank YDN for sponsoring the trip, and O’Reilly Media for providing logistical support (and some copies of the book to give away as rewards for great questions). Interested folks can see my slides on Slideshare:

Yahoo! Pattern Library & Social Design PatternsView more presentations from Christian Crumlish.

Several attendees in London took great notes of my talk and published them on their blogs or personal websites, including Jeff Van Campen, Suw Charman-Anderson, Michael Mahemoff, and O’Reilly’s Craig Smith.

Image credit: Jeff Van Campen

via First we take London: The Social Pattern Detective in Europe (Yahoo! Developer Network Blog).

Your users are mental

In writing Designing Social, Erin and I wanted to include as many voices as possible and represent a wide variety of perspectives. We did this by stealing coopting curating many patterns and tropes already unearthed and documented by smart web people over the past decade and we also invited a large roster of brilliant web folk to contribute essays.

Bit by bit we are making sure all the essays are available online, either hosted on their authors’ blogs or personal websites or in some cases included in the project’s wiki.

Recently, my colleague Tom Hughes-Croucher reprinted his essay on your users’ mental models on his blog, and I think it’s worth reading even if you aren’t designing or developing (yet) in a social context. I love his first line: “One of the things I like about computers is their ability to create magic,” and – to me – the nut graf is here:

The Web is probably one of the least benign environments for a user on their computer and yet it is arguably the most successful computing platform. Using the Web there are numerous contextual or circumstantial errors than can occur, however the majority of users have no mental model with which to understand and recover from them.

…but “read the whole thing” as we used to say on the blogterwebs.

(image courtesy of Mary Harrsch)

New iPhone stencils for prototypers

Interaction designer and prototyper Chris Stone recently volunteered to adapt the iPhone stencils in our OmniGraffle based stencil kit in the Yahoo! Design Pattern Library and optimize them for use in Adobe InDesign.

Chris “created a customizable, vector-based iPhone stencil library for InDesign.”

To make it he worked from the PDF version of the stencil kit originally made by Lucas Pettinati and built out the InDesign snippets with customizable gradients.

See Chris’s blog post Lightweight Prototyping with InDesign for more on how to use them.

(via YUI blog)

New Presence patterns in the Yahoo! Pattern Library

We just published two new social patterns in a new category, called Presence (under People), in the Yahoo! Design Pattern Library. The two patterns are Availability and Updates.

The Design Pattern Library is a collection of guidelines for the design of online interactions that can aid decision-making and guide the work of web developers and designers.

I’ve been studying the concept of “Presence” (often meaning remote presence – telepresences – or digitally mediated partial presence) for about five years now, with an eye toward a possible unbook on the subject some day, and I was able to flesh out a handful of presence patterns for the social patterns project and Yahoo! Press book.

These two patterns emerged from that process and carry within them the work of many Yahoos. The Availability pattern is derived from the work of ex-Yahoo Matte Scheinker and the Messenger team, and the Updates pattern leans heavily on the work of Barry Crane and the Vitality platform team.

It’s not always easy pairing social pattern with useful code examples or resources but with Updates I’m excited that we’re able to offer crosslinks to three relevant Yahoo! APIs (Updates, Meme, and MyBlogLog) and an emerging open Atom extension (Activity Streams).

Likewise, for Availability we’ve got a code link to the Yahoo! Status API.

via Presence, the new social pattern category (Yahoo! Developer Network Blog).

Designing social interfaces at Web Directions South 2009

I had a great time presenting at Web Directions South 2009. J.J. Halans took some wonderful photos at the event, such as the one showing the Where’s Waldo slide (above) and this one (showing Erin’s awesome visualization behind me):

The slides by themselves are only part of the story of course but I’ve just posted them to slideshare (now synced with the audio podcast to make a “slidecast”):

Designing Social Interfaces at Web Directions South 2009

Here’s the podcast:

You may find Matt Balara’s sketchnotes (first page, second page) useful as well:

Or check out Daniel Bogan’s one-page sketchnotes!