Inkwell: Authors and Artists

    
For our next open Inkwell conversation, let's welcome Christian
Crumlish and his recent work,  "Designing Social Interfaces," written
with Erin Malone, and inspired by the groundbreaking work Christian has
been doing at Yahoo's design pattern library. This is a great topic
because so many of us here have been using interactive tools together
for decades, and are sometimes all too aware of the social implications
of tool design.

Christian Crumlish has been participating in, analyzing, designing,
and drawing social interactive spaces online since 1994. These days he
is the curator of Yahoo!’s pattern library, a design evangelist with
the Yahoo! Developer Network, and a member of Yahoo!’s Design Council.
He is the author of the bestselling "The Internet for Busy People," and
"The Power of Many."  He has spoken about social patterns at BarCamp
Block, BayCHI, South by Southwest, the IA Summit, Ignite, and Web 2.0
Expo... and he's been a guest at Inkwell.vue previously. As <xian> he
is a host of the <blog.> conference here at The WELL. (You'll find his
blog at http://xianlandia.com/ ) Christian has a bachelor’s degree in
philosophy from Princeton. He lives in Oakland with his wife Briggs,
his cat Fraidy, and his electric ukulele, Evangeline. 

Leading the discussion is Jon Lebkowsky.

A Social Web Strategies Founding Partner, Jon Lebkowsky is a culture
and business strategist and thought leader focused on the Internet, the
World Wide Web, and the social uses of digital technologies. An early
host on The WELL, and a founder of Fringeware - one of the first
Internet businesses - Jon has been a direct participant in the
formative conversations that have generated our contemporary global
digital society. Writing on digital culture, technology, media, and
global sustainability, he was one of the web’s first bloggers, and has
blogged regularly since 2000. He is an acknowledged authority on the
social web, online communities, web development, public wireless
broadband, and e-democracy. (see
http://en.wikipedia.org/wiki/Jon_Lebkowsky) 

Thank you both for joining us, and taking us into such interesting
territory!
  

    
Welcome, Christian, and thanks for joining us to discuss _Designing
Social Interfaces_. You were inpired by Christopher Alexander's concept
of "pattern language," which he applied in the field of architecture.
How did you apply his thinking to the social web?
  

    
Well, to back it up a little, Alexander (et al.)'s concept of a
pattern language, literally a sort of grammar and syntax of design, had
been working its way through several disciplines, mutating along the
way, before I showed up.

The computer programmer / software developer crowd, as exemplified by
Ward Cunningham and his seminal Portland Pattern Repository
<http://c2.com/ppr/> or the so-called "Gang of Four" book
<http://isbn.nu/0201633612>, embraced many of Alexander's ideas, coined
the terms "design pattern" and "anti-pattern," debated whether
patterns should be descriptive (capturing existing practices only) or
generative (providing recipes), and firmly established patterns as a
viable component of some software engineering projects.

The HCI crowd picked up on patterns a bit later, with Jenifer Tidwell
and Martijn van Welie some of the earliest collectors and documents of
user interface patterns. The Yahoo! library that I curate today
<http://design.yahoo.com/> did its part in helping to popularize the
idea.

Patterns have also made their way into program management, education,
organizational change, and any number of other areas, adapting
themselves and evolving with each new application.

To get back to your specific question, in some ways I see the social
(user experience) design patterns in our book and wiki as closing the
loop and returning very close to Alexander's original ideas, as
desiging for social experiences is similar to architecture in the sense
that it is not so much about building completed, fully defined
phenomena and experiences but rather creating "spaces" (in this case
virtual spaces) or arenas or playing fields designed to be inhabited by
human beings, to be completed and ramified by the population itself.

You provide boundaries (walls, types of rooms) and rules (hallways,
doors, windows with locks, etc.) but if you're successful the people
who come and live in your social application and who relate to each
other through your social space have an equal or even greater say in
the ultimate design of the experience (interior design, art of living).

Now, we didn't perform a systematic mapping of the Alexander patterns
to social design. That would be a cool experiment. Various folks have
taken individual patterns and applied them (examples:
<http://www.socialtext.net/exchange/index.cgi?intimacy_gradient>,
discusion of "Child Caves" and "Degrees of Publicness" in
<http://www.alistapart.com/articles/theelementsofsocialarchitecture>,
etc.) and I'd love to see more of that.
  

    
("documents" should be "documenters" above)
  

    
(and "discusion" should be "discussion" ... sigh)
  

    
No worries, Christian.  As you know, this odd WELL artifact of "when
you post you are finished" can make for some typos, but it makes for a
kind of cultural forgiveness since everybody remembers posting one in a
while without doing a quick proofread, and some do it routinely.  (One
of my first friends around here was a professional journalist who is
legendary for his creative typing, and I credit him for a willingness
to plunge in and talk with a keyboard instead of polishing up a little
composition of clean prose with each post.)   

It's the opposite of a wiki in that regard, but the expectation is
less of composing a document toegether, and more of a conversation
around a table, or when there is a lot of traffic to a Topic, like
people sequentially getting access to the microphone at a town hall
meeting, and having it transcribed or close-captioned, at times
imperfectly.  (At least that's how I experience it)
  
Wow, just had a look at
http://www.socialtext.net/exchange/index.cgi?intimacy_gradient (posted
above)...

> Alexander writes about an "intimacy gradient". There are some areas
> in a house that are public -- the front porch; areas that are 
> indoors and public -- the living room; and areas that are indoors 
> and more private -- bedrooms and bathrooms.

That is nicely expressed. 
  

    
Patterns are also related to standards, no? As you find best ways of
doing specific things, you standardize on patterns that everyone will
understand, especially as those patterns are repeated often. Hence the
idea of a language - language requires shared understanding and
standard expressions.

One reference I think you missed was Doug Schuler's _Liberating
Voices: A Pattern Language for Communication Revolution_.
http://mitpress.mit.edu/catalog/item/default.asp?ttype=2&tid=11601

How do you distinguish an interface as "social" vs some other kind of
interface? I generally understand, but I'm wondering where you set the
boundaries?
  

    
Yes I omitted numerous important pattern language efforts. it's now a
world unto itself. you could spend you life engaging with the greater
pattern language community (or "movement"?).

I'll punt on standards for a sec and answer your latter question. We
view an interface as social if it facilitates interaction between or
among two or more people. The contrast is with single-user interfaces
such as, say, a typical check balancing application. 

of course many UIs originally designed primarily for individuals are,
or can be, or are becoming social. There are gray areas. We tried not
to get hung up on it. 

By analogy, I'd say a filing cabinet has a user interface but a
telephone is a social interface.  
  

    
Can you give examples of a couple of typical patterns and how they
would be addressed or incorporated in user experience design?
  

    <scribbled by brian Wed 20 Mar 13 18:16>
  

    
That's an interesting bit of topic stretch, and an interesting
question. I think I would ask it a little differently. Are there
patterns that have obvious utility that should just be free? Thinking
of email and other communication protocols - latest being Google Wave -
as well as Twitter, which makes sense as a protocol but maybe not as a
business.
  

    
replying out of order, Brian we did not address monetization design
patterns. It's also been suggested to me recently that the Yahoo!
pattern library should perhaps address advertising patterns, given how
central they are to the information design and business model of so
many web products.

We do talk about principles and anti-patterns and the idea that
instead of being black and white, they values are often in tension with
each other and need to be balanced. We address ethics, for example,
without so much trying to dictate good vs. evil behavior but to draw
out the the business imperatives (grow the social graph, get more
users, increase engagement) might at times be at odds with ethical
standards or moral values.

I think it's a good challenge, though, to look monetization square in
the eye. The folks around Tim O'Reilly and the Web 2.0 meme have spent
some time thinking about principles such as "create more value than you
capture" and some of the generative, iterative ideas about software
design apply to finding a sustainable business model as well.

One meta- point about comprehensiveness: Erin and I did our best to
capture a very wide range of ideas "abroad in the land" about social
design, and to propose a framework that might help organize these ideas
into a coherent landscape and assist in everyone's ability to discuss
these ideas together, look for gaps, identify realms hungry for
improvement, and so on...

...so it's great for me to hear suggestions about what we missed or
left out, and I'm taking notes, and of course we have a wiki
<http://designingsocialinterfaces.com/patterns.wiki> where we hope to
continue evolving the pattern language in tandem with the larger
designer, developer, and entrepreur communities.

I'll get to Jon's question next, with some example, patterns, after my
next meeting.

p.s.: while I'm throwing out links, my blog is actually now at
<http://mediajunkie.com/blog/>, a recent post there that includes an
hour-long talk I gave at Web Direction South is here
<http://mediajunkie.com/2009/designing-social-interfaces-at-web-directions-sout
h-2009/>,
and I'm extremely envious that JonL has a wikipedia entry, as I am
still apparently not notable enough for my own. :D
  

    
But email is a business too!

Plus I wouldn't call email or Wave patterns. I'd say that their
implementations exhibit a number of patterns (and perhaps anti-patterns
as well). 

We have a chapter on openness where we talk about patterns related to
things like open source, open standards, open APIs, and so on. These
aren't inherently anti-business or anti-monetization but they do relate
in some ways to the sense of free that I think you (Jon) are getting
at.

OK, I'm late for my call now.
  

    
You have a point, I've stepped us into confusion. You can build
business around email protocols, but the protocols themselves are not
directly monetized. There's no company set up to sell POP, IMAP, or
SMTP. And I stepped from pattern to protocol in thinking about what is
or isn't monetized. Can you think of any product that is a single
pattern? 

And I agree with you that protocols, standards, open APIs, open source
licensing are about free as in freedom, as Stallman says. And doesn't
it make sense to say that these are all actually pro-business, pointing
that the many business opportunities that emerge around them?

You mention Erin - how did your collaboration with her work? (We
should ask her to chime in - and anyone else who has a question or
comment can do so, as well, via email to inkwell at well.com).
  

    
I can't think of any product that consists of one single pattern.
There are certainly some products out there that fundamentally just add
a single feature to an existing ecosystem (say something like Twitpic)
but even they tend to employ a number of patterns, consciously or not.

The collaboration with Erin was amazing. Co-authoring a book can be
extremely challenging and we found that our shared passion for the
material meant there was very little of the work that *neither* of us
wanted to do, but at the same time we each had our preferences and were
easily able to divvy things up. We have complementary skills in some
ways.

Erin is more scholarly than I am, tends to do more thorough research.
I'm a bit more glib perhaps and have some aptitude for chasing down
vivid metaphors and coming up with ways to explain things.

We agreed on the approach of writing the book "in the open," on a
wiki, and so we had a few other collaborators show up along the way as
well.

I will ask Erin to drop by. I've been meaning to - we're both pretty
busy with our regular jobs and then the various speaking engagements,
workshops, articles and so on that we're doing to spread the word.

Remind me at some point to talk about the card game we designed to
help people really explore the dynamics of the patterns and principles.
  

    
No time like the present - unless you think there are prerequisites we
need to cover before you get to the game? I'm also interested in
hearing how the wiki collaboration went - what challenges did it
present? How hard was it to integrate input from people who you didn't
necessarily know would be involved until they showed up? Did you find
that anyone was completely out of sync?
  

    
OK, so a ways back there you asked for some typical patterns. Let me
point to a few from the book project that have made their way into the
Yahoo! library I curate:

First a few social ones:
"Talk Like a Person"
http://developer.yahoo.com/ypatterns/social/core/conversation.html
"Your vs. My"
<http://developer.yahoo.com/ypatterns/social/core/yourvmy.html>
"User Card"
<http://developer.yahoo.com/ypatterns/social/people/identity/usercard.html>
"Competitive Spectrum"
<http://developer.yahoo.com/ypatterns/social/people/reputation/competitive.html
>
"Vote to Promote"
<http://developer.yahoo.com/ypatterns/social/objects/feedback/votetopromote.htm
l>

The first is a principle we identified ("Talk like a person") that
helps foster a social environment by setting a humane, conversational
tone and encouraging users to relate to the other human beings within
and behind the software.

The second ("Your vs. My") walks through the tradeoffs between
labeling the user's stuff as "Your stuff" or "My stuff." We think the
"Your" usage, in most cases, aligns better with social interfaces, and
that the "My" usage lends itself better to solipsistic, single-person
experiences.

"User Card" is in the People category and addresses the problem of how
to offer an overview of another person in the system in a context
outside of a dedicated profile page.

"Competitive Spectrum" is another People pattern in the Reputation
subcategory. It counsels designers to figure out where the community
they're trying to build or grow fits on a spectrum from nurturing to
intensely competitive and then select reputation patterns that fit best
with that atmosphere.

"Vote to Promote" is an Object pattern in the Feedback subcategory and
it described a method for enabling users to vote content up without
giving equal weight to down votes. It's used at sites such as Digg,
Reddit, and by Yahoo!'s own Buzz feature.


Some of the non-social, more UI/affordance-oriented patterns in the
library include such elements as
"Accordion"
<http://developer.yahoo.com/ypatterns/navigation/accordion.html> (a new
beta pattern we just published)
"Autocomplete"
<http://developer.yahoo.com/ypatterns/selection/autocomplete.html>
"Carousel"
<http://developer.yahoo.com/ypatterns/selection/carousel.html>
"Crossfade Transition"
<http://developer.yahoo.com/ypatterns/richinteraction/transition/crossfade.html
>
"Drag and Drop Modules"
<http://developer.yahoo.com/ypatterns/richinteraction/dragdrop/modules.html>

and so on...
  

    
I'll answer the game and wiki questions a little later this morning,
when I'll be riding in my vanpool down to Sunnyvale (hurry for mobile
wifi!)
  

    
I first learned about the social design patterns from Randy Farmer at
Online Community Business Forum 2008 in Santa Fe, and started poring
over them at the time... the UI patterns are almost as interesting as
the Social patterns, and some of them make me wonder how they might
influence social patterns too.  

If you use "accordian" - a good term to have for those little
expandable areas - for example, in a social setting with info by and
about people, you may make a significant choice about what is upfront
and what is a click away.  It all works together.

Could you talk about the differences between the social impacts of
"vote to promote" (thumbs up only, or Fave star as on Flickr, etc)
versus thumbs up/thumbs down?  How did you observe these effects?
  

    
Missed my vanpool and have been caught up in some Halloween
shenanigans at work. (Example:
<http://www.flickr.com/photos/basictheory/4056648964/>)

I'm getting a bit of a backlog here. Need to talk about the wiki, the
game, and the interplay between social patterns and "traditional" UI
patterns....

In many ways, writing the book in public, on a wiki, functioned more
as a gesture of openness than as a true, fully engaged collaborative
workspace. We welcomed outside input and feedback but we didn't devote
a lot of energy to drumming it up. Basically, we were too busy writing
the book!

It did offer us a way to share our thinking before killing the trees,
and we did get a fair amount of feedback, some directly in the context
of the wiki and some via other channels. One interesting thing was that
the day we posted the tentative outline (the "taxonomy of patterns" as
it were) we immediately started getting some traffic, some incoming
links, and people blogging or telling us that the mere outline itself
was valuable before we had even posted a single pattern. This told us
that our curation effort and our plan of trying to describe a coherent
landscape of social features was likely to be welcomed.

Erin tended to post her chapters to the wiki after submitting them.
After a while, though, I pretty much wrote my chapters directly on the
wiki and then converted them for submission. This worked best for me
and enabled me to get unstuck and work on other pages when I was bogged
down on a particular pattern.

We did get a number of people signed up to use the wiki, a few
spammers whom we've blocked, and one or two who wrote entire patterns
from whole cloth or made suggestions about content to add, or offered
definitions, and so on. At least one of those people was invited to
contribute an essay to the book. (We had one to three sidebars in most
chapters from outside contributors - to broaden the range of voices and
perspectives offered in the book.)
  

    
What was your process for creating the outline? I.e. how did you come
up with a list of patterns that you felt was close enough to
comprehensive?
  

    
The roots of the outline, or pattern taxonomy go back to public
conversations online (mostly in blogs) about the nature of social
software and to internal Yahoo! documents reflecting the ongoing
efforts of designers and developers and product strategists to get a
grip on the social design landscape.

From inside Yahoo! I was able to draw on concept models for identity,
platform diagrams for reputation, a "social media toolkit" largely put
together by Matt Leacock, Bryce Glass, and other members of Erin
Malone's old social platforms team, and a handful of internal patterns
in some stage of development.

As I got oriented in my new role as curator of the pattern library I
decided I wanted to focus particularly on the social space and work on
rationalizing what we were learning from acquisitions such as Flickr,
Delicious, and MyBlogLog as well as from homegrown services such as
Groups and Answers.

There have been attempts to define and characterize social software
going on in those public conversations I mentioned for at least the
past 5 years. Much of our taxonomy stems back to a series of blog
posts:

Stewart Butterfield's
<http://www.sylloge.com/personal/2003_03_01_s.html#91273866> from 2003
listed five key elements: Identity, Presence, Relationships,
Conversations, and Groups

Matt Webb's
<http://interconnected.org/home/2004/04/28/on_social_software> year
later added Reputation and Sharing to the list.

Three years after that, Gene Smith collected those seven elements into
a honeycomb diagram at
<http://nform.ca/publications/social-software-building-block>. We
looked at ongoing efforts to visualize these elements and their
relationships, coming up with venn diagrams, trees, and other ideas
along the way.

At BarCamp Block in 2007 I invited people to help me brainstorm a
giant taxonomy and what we came up with was posted to a wiki:
<http://barcamp.org/BarCampBlockSocialMediaDesignPatterns>. (Here's a
link to my slides from that event:
<http://mediajunkie.com/2007/my-social-media-design-patterns-slides-from-barcam
p-block/>)

I kept massaging what came out of that and posted a third revision of
it to my blog:
<http://mediajunkie.com/2007/enumerating-social-media-patterns-a-work-in-progre
ss/>
with a downloadable PDF:
<http://xianlandia.com/pix/SocialMediaDesignPatternsV3.pdf>

Then I presented at BayCHI in early 2008 and continued mapping out
these ideas further:
<http://mediajunkie.com/2008/social-design-patterns-slides-from-baychi-last-wee
k/>

Then I covered some of the key social anti-patterns (anti-social
patterns) in Grasping Social Patterns at Ignite SF a month or so later:
<http://mediajunkie.com/2008/ignite-was-fun/>

And finally, as the book deal came together we put the taxonomy up on
the wiki. Writing a book is a forcing function so that made us settle
on at least one snapshot of the hierarchy, which we now consider to be
version 6 (I will post it to my blog later if people care to see the
latest version).

Meanwhile we've continued to post sketches and model concepts
collected over time to Flickr:
<http://www.flickr.com/photos/socialpatterns/sets/72157618641664322/>

And Erin recently adapted a Nancy Duarte graphic from slide:ology to
make our latest and greatest visualization thus far:
<http://www.emdezine.com/deziningInteractions/2009/10/08/diagramming-the-social
-ecosystem/>

Too much info? Too many links?
  

    
Can't get too much info - those links are very helpful in showing the
evolution of thinking about social software, as well as the pathway to
the pattern library and your book. I fondly remember the early 2000s
and the conversations many of us were having about social software and
how to optimize to support sharing, group-forming, and sustained
relationship online. The conversation about optimal social patterns and
structures is currently less pervasive, I think, than social media
marketing conversations. At their best, those conversations align with
cluetrain - not "how do you find an audience" but "how do you build
relationships with your customers." Is there an understanding implicit
in the patterns overall about how marketing and business should be
conducted in the evolving online social context? Best practices for
social media marketing? Was business use much of a consideration in
pulling the patterns together?
  

    
    
(A few housekeeping items --  if you want to tell friends about this
conversation, or blog, tweet or post about it off-site,  here's a link
to the external view of this topic:
<http://tinyurl.com/inkwell-crumlish>   And as always, if you are
reading along without being logged in you are welcome to join The WELL,
but you can also email a question for posting - send it to
inkwell@well.com and put "social" in the subject line.)
  

    
<key social anti-patterns>
Not sure if this is related to "anti-social" communications patterns,
but I am wondering, as these interactive media "go viral" in
popularity, how much of the design is largely accidental to the
eventual level of use.

I'm thinking of YahooChat in the mid-'90s which allowed a participant
to follow another participant, then as the medium expanded into
primarily a hook-up site, the follow feature was eliminated,
ostensibly, to stop unwanted on-line "stalking."  A decade or so later,
counterintuitively, Twitter, at its root is based overtly on
"following" in order to gain "followers".  Of course, the 140 character
limit to posts is part of the formula, but how surprised were the
designers of Twitter at the phenomenal level of utilization? 

Also, why can't Twitter monetize its system with paid banners, etc? 
And who determined its billion dollar valuation and how?

(I'm just a tech layman here, not a Xian.)  
  

    
I was very surprised to see the wonderful "Design of Sites" (2nd ed in 
2006?), Van Duyne, Landay, Hong, not referenced. It's a book that is far 
more general than ya'lls, but there were many times in comparing patterns 
in "Designing Social Interfaces" where I was reminded how I have come to 
avoid the clumsiness of many Yahoo! social interface patterns--and would 
then find a corresponding entry in the earlier book that explained the 
issues as they were perceived at the time (I have the 2002 edition) with 
incredible accessibility, clarity, and brevity.

That's unfair--both books could have been excellent--there is so much 
un-thought-out or un-documented, that there is room for several excellent 
social design pattern books or web dp books. But what TDOS shows is that 
this is not a new problem--whereas DSI makes me think, "not bad for a 
first effort at documenting some of what we now about social interfaces.

I suspect that ya'lls book has excellent patterns for many things that I 
wasn't going through, but in the couple of examples among those I work 
with daily, I was surprised.

Here is a short example: sign-ups. In SDI, ya'll call this "Sign-up or 
Registration."

You quite nicely talk about minimizing sign-up fields, and show a nice 
pattern where you just let something known to be unique - an email address - 
in place of a login ID.

But, in the social sphere, filling in more information is how other people 
in the network find out about someone. There is reason to encourage 
filling in more information, but it isn't necessarily needed when someone 
is new - so, "Sign-up" should probably connect to some sort of personal 
information pattern (I gotta believe that one or more are detailed in the 
book, I just didn't find them in a quick glance.) which includes ways to 
make it easy for someone to fill in info later. (What info? Not sure that 
there is a general pattern there.)

But, there is also a way to get desirable info right at the beginning that 
is used by folks who do fundraising:
1. require minimum--either email or email+name
2. Thank person for signing up, then tell them that it would be helpful if 
they give more info (branch here to the aforementioned, "ways to continue 
to make it obvious how to change/add personal info from anywhere" pattern)
3. If someone does give you more info, then ask if they want to tell 
friends about your system and provide ways to "share"....

[In TDOS, they miss the minimization of info that SDI details a bit--but 
they do talk a lot about this being a "funnel" pattern, reference patterns 
for preventing bad info, etc.]

This, of course, all serves to remind me that I =hate= Yahoo! sign-in. I 
encounter it almost exclusively when I am going back and forth between my 
work and personal Flickr accounts. This is a sore point because we have 
never figured out how to get the aliases we want to work with the work 
flickr accounts. Logging in confuses everyone. But for me personally, 
because I also have a personal account, switching is an ongoing bad itch.

1. Log out of Flickr by clicking "log out" 
2. Get asked if I also want to log out of Yahoo! (!!!????). 
3. Log out of Yahoo!
4. Now, I am no longer on the Flickr site--I have a Yahoo! sign-in screen 
to return, so I use a bookmark or manually type in http://flickr.com
5. I can log back in to flickr.

Which leads me to my last point, which is the degree to which these 
patterns have been tested? Because some of the few I read--which I'll 
detail later--I believe to be blatantly wrong. So things, like the flickr 
logout I detailed above are simply inconsistent and don't connect to 
patterns, and others just feel incomplete--this is what we do--which isn't 
the same, with the exception of the anti-patterns--as saying, "we have 
good reason to believe that this is worth copying.

Sorry to go on and on. I guess what I'm saying is that what I'm reading 
feels much more tentative and incomplete than I expected--although the 
anti-patterns are quite amusing and =those= seem true. I guess, when 
things go wrong spectacularly and consistently, that's easier to document 
than, "what it is we're trying to solve, how it fits in with everything 
else, and why this is the best, reasonably complete way to go about it"