5 Steps to Building Social Experiences

by:   |  Posted on

Nowadays everyone wants social in their sites and applications. It’s become a basic requirement in consumer web software and is slowly infiltrating the enterprise as well. So what’s a designer to do when confronted with the requirements to “add social”? Designing social interfaces is more than just slapping on Twitter-like or Facebook-like features onto your site. Not all features are created equal and sometimes a little bit can go a long way. It’s important to consider your audience, your product—what your users will be rallying around and why they would want to become engaged with it and each other, and that you can approach this in a systematic way, a little bit at a time.

These concepts derive from a book I wrote recently with Christian Crumlish, “Designing Social Interfaces“. They are quick and easy things to remember when infusing social into your site. Each points offers some simple suggestions and points to consider when designing. Potential design patterns are recommended (and linked to) as examples for what could be done in your interface as you design and grow your service. Keep in mind that your context will dictate different specific solutions but the questions and concepts to think about will still be applicable.

Step 1 – What’s your social object? Make sure there is a “there” there. Give users a reason to rally. Why would someone come to your site?

Most people are drawn to a site based on their particular interests, in hopes of learning more or meeting others like themselves. They may be looking for information or they may have information to share. They have a passion—such as making handcrafted jewelry or taking landscape photographs—and at some point, they will want to share that with other people. That passion, that thing that people rally around is often referred to as the social object. It’s the object around which conversations emerge and thrive.

Remember that sometimes, the social object is a person – or the conversations between people. But don’t forget history (remember Friendster? or SixDegrees?), if the only thing to do is build a profile, people will eventually go somewhere else to have conversations or to do things around objects of interest.

Step 2 – Give people a way to identify themselves and to be identified.

This can be as simple as an “attribution” line when contributing and signing content.

Attribution of a comment on flickr
Attribution of a comment on flickr

It could be an “identity card” that shows a little bit about the person and is attached to every thing they do or can be as robust and complex as a “full profile” that is linked from all their contributions. The method can start out simple and grow over time.

Identity or Contact card as seen on FriendFeed
Identity or Contact card as seen on FriendFeed

It’s important to give people credit for their words and contributions. It helps others recognize their friends and disambiguate them from other people with the same name and builds a “reputation of quality” or lack thereof for their participation on your service.

Public display of relationships allows viewers to find others they might know by allowing them to browse contacts for the person whose info they are viewing.

Public display of relationships allows viewers to find others they might know by allowing them to browse contacts for the person whose info they are viewing. Module shown from MyBlogLog
Relationship module shown from MyBlogLog

Once you have given people the ability to identify themselves, allow them to “find each other” and claim their tribe. “Relationships” make the world go round and online it’s no different.

Step 3 – Give people something to do.

Provide a path for participation so lurkers as well as early adopters can be engaged at the level of effort that is appropriate for them. Things like ratings (“1-5” or “thumbs up“) are easy ways to get low participation people involved by letting them quickly register their opinion with little effort.

Thumbs up and down ratings for restaurants on GoodRec let people quickly register their opinion with little effort
Thumbs up and down ratings for restaurants on GoodRec

Allow them to “share items” they find interesting with their friends or family and “curate and collect their favorites“. The latter requires a little bit more effort, but lets your users have ownership over what they find meaningful.

Flickr allows users to “favorite” images they like and collect them for display to others.
Flickr allows users to “favorite” images they like and collect them for display to others.

At the other end of the spectrum is full authorship of content with “reviews“, “comments“, “blog postings“, and “wiki entries” all the way through to participation as a moderator or guide in your service.

Wikimedia allows collaborative editing of content on sites built with the software.
Wikimedia allows collaborative editing of content on sites built with the software.

Start simple, with light features, and gradually add more complexity if it is really needed. Keep the structure flexible enough for your users to mold and adapt to their needs. In the book, we discuss several principles related to this including “Deliberately Leave Things Incomplete“, which reminds designers to allow features to emerge from the community behavior rather than forcing behavior to fit the UI and “Strict vs. Fluid Taxonomies” which merges a strict taxonomy like your site navigation with user generated groupings and organization with features like Groups, Message Boards, Tagging, etc.

Allowing behavior to guide your features and giving your users ownership of the structure make the site much more personal for them which in turn encourages repeat and longer term usage.

Step 4 – Enable a bridge to real life (groups, mobile, meetings, face-to-face).

Don’t be afraid to build in tools that allow your users to bring their community into the real world. In many online groups, a majority of people know each other personally.

Upcoming shows local events and allows people to add events to their calendar and view events their friends are interested in.
Upcoming shows local events and allows people to add events to their calendar and view events their friends are interested in.

Providing tools to help plan face-to-face meetings and then archive those happenings will strengthen your site and the community. Consider incorporating “geo” features like “GeoMapping“, and “GeoMashups“.

Additional features might entail creating “subspaces (groups)” and coordinating real time “face-to-face meetings” and gatherings among users of your service.
Meetup lets people affiliate with groups of interest and the site helps coordinate real life - in person meetings and gatherings between members.
Meetup lets people affiliate with groups of interest and the site helps coordinate real life – in person meetings and gatherings between members.

Step 5 – Gently Moderate. Let the community elevate people and content they value.

This can be through simple things like ratings or “reputation labels“.

Reputation labels on the intranet at Yahoo!.
Reputation labels on the intranet at Yahoo!

The community can help you surface contributions of quality which in turn should help attract future participants and will help keep the interactions lively. This process also helps push bad quality content down and out of sight.

Keep an eye on the community, participate yourself, welcome people as they join, set yourself up as a role model.

Hunch founder, Catarina Fake, acts as a role model for the community being built on the site.
Hunch founder, Catarina Fake, acts as a role model for the community being built on the site.

Notice who is passionate and who is potentially causing trouble. Conversations should run their course. Let the “community moderate itself” and provide tools to allow them to do that, like allowing them to mark content as spam or block trolls or “report abuse“. Step in only when necessary.

Report Abuse is available on every comment in Yahoo! Answers and allows users to moderate the content quality.
Report Abuse is available on every comment in Yahoo! Answers and allows users to moderate the content quality.

Make sure people are aware of the “terms of service” and “license” implications of content they create – both as it relates to your site as well as what they can permit others to do with their content.

Go out and get started

These are a few of the things to consider when building a social application or when adding social features to an existing site. There are a lot more features and concepts available within the social ecosystem but these should get you started and will build a good foundation from which more robust and complex features can be added to.

It is important to remember that you don’t have to do it all at once. You can apply features sparingly and let the community tell you when you need to expand. Consider the bare minimum while fleshing out your infrastructure. Add complexity as your community grows and scales. Remember that you are building a container for activity and conversation and that you don’t have to have everything figured out. The people will create their own paths of interaction making their own meaning and experience.

Erin Malone

Erin Malone, Principal at Tangible ux, has over 20 years of experience leading design teams and developing web and software applications, social experiences and system-wide solutions. Prior to Tangible, she was at Yahoo! where she led the Platform User Experience Design team and was responsible for building the Yahoo! Design Pattern Library and for providing design expertise to the popular YUI (Yahoo! User Interface Library). Additionally, she led the redesign of the Yahoo! Developer Network, oversaw the redesign of Yahoo!’s Registration system, designed cross-network social solutions, developed the ux team’s Intranet and other cross-company initiatives. Before Yahoo!, she was a Design Director at AOL leading a range of community and personalization initiatives; Creative Director at AltaVista responsible for the AV Live portal and community tools and Chief Information Architect for Zip2 which produced a custom content management system for local city guides, entertainment guides, maps and yellow pages, including New York Today for the NYTimes. She was the founding editor-in-chief of Boxes and Arrows, a role she served for 5 years. She is the author of several articles on interaction design history and design management and a founding member of the IA Institute. Erin has a BFA in Communication Design from East Carolina University (1986), Greenville NC and an MFA in Information Design from the Rochester Institute of Technology (1994), Rochester NY. She is the author of the book Designing Social Interfaces with Christian Crumlish for O’Reilly Media and its related site designingsocialinterfaces.com.
View all posts by

12 thoughts on “5 Steps to Building Social Experiences”

  1. Great article and easy to transfer to clients / managers. Many intranets are stepping into this realm, and typically suffering while they learn the lessons of appropriateness, how to encourage participation, moderation, and maintenance.

    This article is a lovely summary of the key point of good social media experience. Thanks Erin.

  2. Encouraging article. Wise to add a dash of realism by suggesting we need not do everything at once, but rather let it grow over time. Nothing is ever finished; the evolution of life.

  3. Seems like step 2 has the most practical parts/most widely used elements in it.

    The parts and pieces brought up in the other steps, to me, are more core components to particular networks or services. The sites that use these features were designed to “be social” rather than adding social, like you say at the beginning. Still, great post- everything in one place, good examples- I can definitely use this as a reference. Thanks Erin.

    One example of a social comments feature I like is on Men With Pens dot com, where commenters are IDed by their last blog posts, linked to their own sites. I think it encourages comments, and prevents people from having to be slick or sales-y, trying to link to their own posts. It can be abused, sure, but what can’t?

  4. This is a great article. Thought this would amount to a lot of repetitions before in can get synced to my system. Thanks!

  5. Great article. I’m planning to extend my current website profile and it helped me a bit. Maybe my site isn’t too big now and it’s based on wordpress cms but I’m planning to switch to custom cms.

  6. Web sites grow and change over time, and accommodating change is helpful for clients and their customers

  7. I’d like to point out that in #3 you got it right. One of the best example would be twitter, when it started there was really no convention in interacting through 140 characters, over time users devised a way to better express themselves hence the creation of hashtags, RT, DM, and etc. later these conventions were officially adapted by the platform.

    Really a good read! 🙂

  8. The growth of social media is drastically changing both the way we do business and the way we interact with each other. How popular the websites become is really down to how technology facilities the growth and how well it becomes part of peoples every day lives. If you look at twitter, it was really when celebrities starting using it, that it became so popular. Lance made a good point, opensource really is the best way to watch technology evolve. If you hand it over to the people, they will find ways to use it that you never thought possible (good example is Linux).

  9. Good Article… Erin.

    There are a lot more features and concepts (depending upon your target audience) available for social sites but the above points as mentioned by Erin are basic foundation blocks. I believe point number two and three are the most important points for consideration while creating a social networking site. More social interactions/participation on sites with little or simple UI interactions is the mantra for a successful site.

    Again… thanks for sharing this nice article Erin… Keep posting 🙂

  10. Great article, i think that points 3 is useful to give users a something to do on the site that doesnt require any effort (such as thumbs up rating . This is a great way to get users to participate without registering. Once users are comfortable with the idea of contributing more, they can register and create a profile.

    Also there must be some reason to keep coming back to the site and do or participate.
    Too much to do and too much choice? Do users have too much choice to comment about virtually everything?

    It would be nice is if more site had profiles which carried over to other sites, so essentially you only have one or a few, not multiple on each site, so users are constantly, something which Facebook and PublicSquare seem to do. Understandably each site/ service provider want their own private database.

  11. This is some of the best writing I’ve seen done on “designing social”, it’s really, really good.

    That being said this site, Boxes & Arrows needs to keep up technically, the sign up process I just had to go through was totally unnecessary, it asked for a lot of simple things in the on the form that it could have grabbed automatically from a number of services via Twitters Oauth, facebook connect, openID, etc. As a user I hate it when a site asks me to do unnecessary work 🙂 and in a number of cases you could offer people different login options depending on the referer (if it hasn’t been broken by a url shortner that is).

    Hope I don’t lose reputation points for moaning 🙂

    http://twitter.com/karllong

  12. Would suggest that you look at Maslow’s B-values in terms of the “things” that seduce tribes into working for them.

Comments are closed.