Erin Malone
Designing Social Experiences
@emalone
founder of Yahoo Pattern Library
partner at tangile ux
author of Designing Social Interfaces
email: at tangible-ux.com
- Engaging and Onboarding
- flow: to move or run smoothly with unbroken continuity / to exhibit a smooth or graceful continuity.
- The New User Spiral:
- Initial Exposure, Education “The Sell”, Registration, Onboarding, First Time User Experience, Second Time User Experience, Third Time User Experience, The Passionate User
- The Usage Lifecycle: diagram Joshua Porter
- Email example: solicitation to sign up for service
- Good: uses friend’s real name in from. Bad: uses company name – perceived as spam.
- Good: uses full name in subject line. Bad: use only first name. erin who?
- Good: uses photo in email, reinforces that it is actually from someone they know. sign up success is much higher with phot.
- Good: Action button is large and obvious. The call to action is clear.
- Full of Life
- Twitter is good because it shows pictures of the active people, and top tweets, even if you are not signed in. It shows that the site is alive, not a ghost site.
- Research at Yahoo showed that best landing page design should have
- a large feature block on 2/3rds left side, and main call to action as a large button on the right 1/3rd side, with secondary actions below primary action and more pushed back. (e.g. flat buttons, rather than big web 2.0 button)
- another big call to action button below the fold.
- Examples of this include:
- Yahoo messager
- Togetherville http://togetherville.com/
- Sign up / registration
- Example is http://knx.to
- No creating an account – uses existing social networks
- State that they don’t store personal information
- Have fun: “Enter your DJ name” instead of boring “username”
- Use Facebook Connect or Twitter API
- Onboarding
- Tumblr example: “To get started, why don’t you try uploading a photo you took recently or just add a text update about what you did today.”
- Full set of options are below. But the introductory text ensures they won’t get overwhelmed.
- Togetherville: Prompts parent to send Hello message to child. They don’t even have to type anything. The message benefits both parent (who sends something) and child (who receives something).
- Blip.fm: uses some informal handwriting overlays to show people what to enter where: “type in the name of a song you’d like to hear”.
- These introductory messages should go away after 2 or 3 times.
- Re-engagement
- Send an email when you add new features or content on the site.
- TripIt uses peer pressure to show what the rest of your network is doing, which may inspire you to share what you are doing, or to actually do things.
- Care and feeding of the passionate
- Featuring what people do on the homepage: shows that not only do their friends see what they do, but the system sees it and values it. Even if people don’t say it outright, they want to be recognized as an expert.
- At least show the potential that it can happen.
- Always show something new each time: question / quiz of the day.
- Badges, points, and stats:
- Foursquare uses all of the above. Mayorships, badges, and points, plus publishing the stats.
- Share and share alike
- You want more people, you want people to bring in their friends.
- Some patterns, mostly from Christina Wotkle
- B=f(P,E)
- Behavior is a function of a Person and their Environment
- e.g. reputation / points will create competition. whereas labels like “funny”, don’t create competition, just sharing.
- At Hand: Make the tools for viral sharing be very easy, and obvious.
- Hulu makes the controls for share and embeding puts the controls right at hand on the borders of the video.
- YouTube puts the controls right below – within eyesight of the screen.
- Frictionless
- Make sure the defaults make sharing easy. Default sharing on flickr is public. (but easy to make it private.) Flickr grew really fast by going against conventional wisdom that picture sharing was private among friends.
- Email vs. Network
- What is the default sharing? Email goes to a single person, or multiple people typed in. To the network can go to 200 people with no effort.
- Connectedness
- The more connected people are, the more active they will be. Becomes virtuous cycle, because more active people will invite more friends.
- Make recommendations (facebook connect)
- Lety users walk other people’s networks to find people they know
- Password Anti-Pattern: Don’t Use It!
- Startups frequently are faced with cold-start issue. They say “give us your name and password and we’ll scrap other sites”, e.g. gmail, yahoo, linked in.
- But that trains people to give away their login information. That’s bad.
- Bridging Real Life
- user and activities flows across real world and online world
- online tools -> real world gatherings -> artifacts from real world -> conversations / pics / data -> online tools
- Meetup / Evites type sites
- Need a dashboard of activity, gives people something to come back to and use.
- Encourage membership: meetup makes you join a group to get all the details. That gate determines interest, and that interest feeds the dashboard.
- Show friend activity: their taste in music, their events, etc.
- Travel Sites or Hiking Sites
- Allow people to put together their top ten hikes, or best vacation package, and share: like lists on Amazon.
- Foodspotting: food scavenger hunt encourages people to participate in visiting restaurants and sharing experiences.
- Meetup has second view of event after it happened: add comments, photos. Shows up again in dashboard with stuff added.
- Upcoming will pull in photos from flickr uploaded with correct tag.
- Questions
- Q: Do you have any good resources for dealing with ethics and privacy?
- A: Check out the EFF – Electronic Frontier Foundation. Also covered in her book Designing Social Interfaces. Copyright of content is an important consideration.
- Q: How can you pull together pieces from other sites with some kind of flow (we can’t afford to build it all ourselves)
- A: Look at each individual piece, and see what it has: if you have a blog, is there a way to alert people to new content on that blog? Is there an email that goes out, and what does that email look like? If you can share, what are the defaults around who it is shared with?
- Q: We have a bunch of introverted scientists who aren’t very social. How can we entice them to participate?
- A: Look at what are they doing now? Are they having conversations in email? Is there something you can do that is very simple: e.g. move the conversation from email to basecamp, where the history of the conversation can be maintained, but they can still get emails. … Look at what they are already doing, and see if there is a more social interface to support that behavior.
- Q ongoing: scientists don’t want to give an offhand comment in public because they don’t want to have a record of being wrong, which can afford tenure, and other things like that.
- Q: Registration is a barrier to participation. registration/comment spam is high. Captcha don’t work well. How can we solve this problem?
- A: No good answer… stuck with Captcha. People are working on it, but no good answer.
- Q: Any recommendations on how to get more user data after registration?
- A: Work it into your site contextually and gradually. e.g. give them value for what they give you. If you can give them value with their zip code, then they’ll give you their zip code.
- Q: Have you seen evidence where engagement increases when people can control what information they have on screen? (e.g. more customization, personalization)
- A: You have to design for your demographic, and one size doesn’t fit all. Attuning your interface to the type of people you are seeking is good. It can be hard to have an interface that attunes to someone without knowing who they are. Lightweight interface techniques like collapsing stuff and making stuff go away, that makes sense.