Social design (Seattle 09-2011)


Published on

Published in: Education, Technology
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • \n
  • \n
  • Search is about finding answers\n\n2 types of questions \nFactual\nSubjective\n\nSearch solves factual, but not subjective.\n\nUsers often have subjective questions, like Recommend me a film, this is what social excels at.\n\nWhen a computer cant answer a question, turn to friends.\n
  • Eric Fisher, Facebook Social Design Strategist\n\nRelationships can be broken down to 2 axis.\n\nFriends and family in the trust area\n\nBrands and people like the pizza boy live bottom left, least trust.\n\nWe need a way to bring the “brand” into the top right and this is what social design achieves/enables.\n
  • Circle of trust, top right quadrant\n\nFriends and Family vouch for others and they enter the circle of trust\n\n\n
  • I’ve been staying with a close friend in Seattle the last few days. But during the day she was at work, so I needed to go out and explore, \n\nFriend recommendations out weigh unknown third parties.\n\nThey know and understand you, personalisation goes a long way.\n\n“This place is awesome (local knowledge) you should go”, “skip that, you’ll hate it”\n\nEvents like this happen Millions of times a day already on Social networks and you need to figure out how to ride the wave.\n
  • Social networking sites have 3 key parts\n\n1. Identity, this includes not only your “profile” but any badges/awards/points the whole eccosystem\n2. Communication\n3. Community \n
  • Communication is often misunderstood\n\nMost assume its distribution, and SHOUTING..... its not its a two way street\n
  • Consumption is a massive driver of retention... always overlooked, (sharkfin)\n\nBut also strangely you see the following...\n\nDistribution drives consumption, but also consumption drives distribution = Growth + Retention increase\n\n\n
  • We have been through this consume/create (review) cycle before, with reviews.\n\nWho are these people?\nThey don’t know me?\nDo we share the same interests?\n\nLike is one example of an attempt to solve this issue, by focussing on the top right quadrant or trust, engaging the user\n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • Its not just photos the social graph includes - Events, groups, applications everything in the eccosystem.\n
  • \n
  • \n
  • Lets add a new type of node.... a webpage..... (or domain)\n
  • like it, this is what the “like” button does internally within the graph\n
  • Define the “object”\n\nTitle and image’s lock after 10? likes (images and title)\n\nIf you are debating SOCIAL put these tags on your site and start checking out insights straight away, see if there is anyone already sharing your content.\n\nRequired. title, type, image, url.... just for FB ensure you have site and fb:admins as well\n\nembedding flash to or not depends on what you want to optimize for.\n\nTOP TIP, never use # in urls, it buggers up insights totally. \n\nOfficial line is they will all be merged, I’m pretty sure it just dumps them entirely, do some tests.\n\nAlso #! urls work as well (google ajax crawling spec) but dont do that its bad for everyone, pjax it up :)\n\n
  • Facebook linter, good at spotting tagging issues, things like duplicates can throw a real spanner in the works.\n\nFlush the FB cache with it, for example if you have uploaded the wrong image\n\nCan also be done programatically\n
  • There was this trend of publishing/liking actions for a long time this does not work, people don’t reshare/like that\n\nArticle, blocked posting to the “page” so dont use it.\n\nfb:admin fb:app_id\n\nMake sure you have a favicon as well.\n
  • \n
  • \n
  • Like objects not actions\n\nobjects produce content = returning users\n\nEvery new like adds another page to the graph, its better to keep a small set with lots of likes than spreading them out. Having said that we now manage 100,000 pages\n\n\n\n
  • Default code examples are synchronous, the block horribly. Use this example to do async + GA tracking of events\n\niFrame version a second class citizen\n\n
  • remember those admin tags..... now goto and we can start getting to the real data.\n
  • \n
  • Using Like buttons to track demographics,\n\nYou can either hide them, or make them public. Hiding will screw the stats.\n
  • \n
  • Default code examples are synchronous, use this example to do async + GA tracking of events\n
  • \n
  • \n
  • effective for invite mechanics...\n\nWho actually runs these?\n
  • \n
  • Remember that you can post as a brand as well\n\nComment order is important, (friends show up at the top)\n\n
  • Ditch sharer.php, legacy\n\n\n
  • Ditch sharer.php, legacy\n\n\n
  • actions is a historical bug, but you can only have one action, and you shouldn’t because it removes the ahre option.\n
  • \n
  • No action links\n\nFocus on objects and allow the user to define the reason in the messaging.\n\nAwesome touch point for signup\n\nIf you want to do more advanced integrations it is possible. For example you can target specific users but you need to get the uid first, good for invites....\n
  • \n
  • Screen grab from F8 2010 Session\n
  • Time is probably your best bet here, focus on adding more content to recent edges, not old ones.\n\nIf you release new content, drive engagement quickly, don’t do it over a long period\n\naggregating edges onto a single object. \n
  • \n
  • Realtime, so ignore the last day drop off (has stalled a few times) \n\nNote share is way more effective than like.\n\nLike x326 CTR 0.2%\nShare x645 CTR 0.9%\n\nLet me know what you guys are seeing, no one is publishing this data, we openly share and to date we are way above average.\n\n
  • Social engaged users are happy users :)\n\n46mins average time on site! This is certainly biased, however we aim to transition users from not engaged to engaged.\n
  • Breakdown by type.\n\nGoogle now accounts for 16% of our Social Actions! not bad for month 1, maybe its a fad, but seems to be increasing\n
  • Breakdown by type.\n\nGoogle now accounts for 16% of our Social Actions! not bad for month 1, maybe its a fad, but seems to be increasing\n
  • \n
  • \n
  • Its a known active area of work.\n
  • Maybe a Geo element as well “Cambourne runners” is local to me, or could be minimal distance across graph.\n\nThe other key thing to remember with search at FB is that this is in very active development, and results change frequently.\n\nI can’t login to our analytics clusters from here, but last time I checked search aren’t important at all.... fb_source=search is seen in referrer\n\n\n
  • \n
  • Use personal information to kick start the social experience.\n\nUse things like Facepile to increase signup\n
  • Auto login to ensure minimal effort on the users part. This will take a while to fine turn, and will confuse users for a while, until you perfect the UI. \n\n\n
  • Do not ask for too many! 3% drop per permission, bullshit. \n\nMy tip is ask for email, so you can manage the user. (proxy emails don’t happen that often, although its a possibility)\n\nWe just ask for email, offline_access and stream_publish, and are considering dropping offline_access shortly.\n\nManaging deleted access_token is a pain (realtime helps a lot), changing a password also deletes the access_token. Do not depend on them, learn to adapt when they change\n\n\n
  • OAuth 2.0 + FB JS Kit only\n\nUse the Facepile Social Plugin\n\nOfficial Facebook line is that each permission causes a CTR drop of about 3% (massive Standard deviation though)\nHowever I dont agree, asking for email caused a 5% increase in CTR...\n
  • The on-ramp is crucial, get this right and everything follows.\n\nConsider your core pages, what are they. For us. Content/Profiles and soon player. Can you Socialize these? \n\nWhat are your landing pages, can you Socialize even before signup. Aim for the initial touch point\n\nEnsure Social Context through out the entire experience.\n
  • \n
  • Of 6,981 people listening, it isn’t a coincidence that Rob is showing up.....\n\nWe go to great lengths to track relationships, either those you follow directly, or friends on other sites...\n\nWorse case we can post to FB with a tainted link and either know your id or who posted it, and from that do indirect targeting, its still better than none\n\nDrive retention/engagement through adding social context, this increases the CTR of the play, and also the share rate and viral factor of the pages significantly.\n\nCreate all content as close as possible in social context to the user, aim for the top right quadrant.\n\nFACES ARE KEY, not NAMES.\n
  • Nikhil mentioned on the left (out of 1000 friends)\n\nNico was at out with Rawson (other hidden friends I dont know)\n
  • Social plugins can even do this when you aren’t authenticated... first page, are you likely to sign up now? What do you think we did to the bounce rate, conversions? \n
  • Social plugins can even do this when you aren’t authenticated... first page, are you likely to sign up now? What do you think we did to the bounce rate, conversions? \n
  • \n
  • Grow in narrow niches first, keeps concentration higher and increases the “community” density\n\nMake it EASY to share and give back (lots of AJAX) to the community.\n
  • Touch points\n\nconsider your key actions both on and off your site. What actions do your users do which suggests increased engagement.\n\nFor both your own actions, signup after share/like? you can track and count these. If someone likes your content 10 times they “might” be a good candidate for signing up.\n\nAlso if they just listening or read an article will they share? You can force these things but if you pick your timing smartly you can win big.\n
  • Touch points include\n\nShare, Tweet, like, +1, Follow, Comment, Play, embed\n
  • \n
  • Auto login to ensure minimal effort on the users part. This will take a while to fine turn, and will confuse users for a while, until you perfect the UI. \n\n\n
  • Social context - A friend has just recommend the item (come from newsfeed), they land on our site, already signed into FB (we check in JS), this is one of our key touch points.\n\nNote the use of FacePile, this associates friends alongside the action of “Connecting”\n\nBiggest issue with this is that users don’t fully understand “Connect” with Facebook and that they are creating an account.\n\nGuess what this did to the bounce rate?\n\n\n
  • 55% reduction in bounce for FB users (38%->17% bounce rate, for FB traffic)\n\n15min time on site\n\n80% increase in signup rate\n\nBiggest shift in site usage to date.\n
  • \n
  • Contact details\n
  • Social design (Seattle 09-2011)

    1. 1. Social Design @matclaytonWednesday, November 9, 2011
    2. 2. What is Social? why is social so effective?Wednesday, November 9, 2011
    3. 3. Recommend me a filmWednesday, November 9, 2011
    4. 4. Wednesday, November 9, 2011
    5. 5. Wednesday, November 9, 2011
    6. 6. Wednesday, November 9, 2011
    7. 7. Wednesday, November 9, 2011
    8. 8. Wednesday, November 9, 2011
    9. 9. Wednesday, November 9, 2011
    10. 10. Stars and ReviewsWednesday, November 9, 2011
    11. 11. The Social GraphWednesday, November 9, 2011
    12. 12. Wednesday, November 9, 2011
    13. 13. Wednesday, November 9, 2011
    14. 14. Wednesday, November 9, 2011
    15. 15. Wednesday, November 9, 2011
    16. 16. Open GraphWednesday, November 9, 2011
    17. 17. Wednesday, November 9, 2011
    18. 18. Wednesday, November 9, 2011
    19. 19. Open Graph TagsWednesday, November 9, 2011
    20. 20., November 9, 2011
    21. 21. Tag Tips • Open graph tags on objects not actions. • “Secret” admin panel • DO NOT USE the “article” type • make sure to add fb:admins for insights and admin panel • Open graph pages can post to usersWednesday, November 9, 2011
    22. 22. Wednesday, November 9, 2011
    23. 23. Creating Edges Like, Send, Share, Requests 2.0Wednesday, November 9, 2011
    24. 24. LikeWednesday, November 9, 2011
    25. 25. Code <fb:like href="..." ref="my_ref"></fb:like> <div id="fb-root"></div> <script> (function() { window.fbAsyncInit = function() { FB.Event.subscribe(edge.create, function(response) { _gaq.push([_trackSocial, facebook, like, response]); }); FB.Event.subscribe(edge.remove, function(response) { _gaq.push([_trackSocial, facebook, unlike, response]); }); }; var e = document.createElement(script); e.async = true; e.src = document.location.protocol + //; document.getElementById(fb-root).appendChild(e); }()); </script>Wednesday, November 9, 2011
    26. 26. Like Tips • Use XFBML not iFrames • Higher weighting • Commenting/cleaner ui • Don’t use the demo code, it blocks • Point the url to the creation object not the current page • Aggregates likes to onto single object • Create a good reason to post new updates to user • Track them! In Insights + Google Analytics • Touch point for FB signupWednesday, November 9, 2011
    27. 27. Bonus Tip: Demographic trackingWednesday, November 9, 2011
    28. 28. SendWednesday, November 9, 2011
    29. 29. Code <fb:like href="..." send=”true” ref="my_ref"></fb:like> <div id="fb-root"></div> <script> (function() { window.fbAsyncInit = function() { FB.Event.subscribe(message.send, function(response) { _gaq.push([_trackSocial, facebook, send, response]); }); }; var e = document.createElement(script); e.async = true; e.src = document.location.protocol + //; document.getElementById(fb-root).appendChild(e); }()); </script>Wednesday, November 9, 2011
    30. 30. Wednesday, November 9, 2011
    31. 31. Send Tips • Dont expect good results....... yet, maybe in time • Users still don’t understand it. • CTR’s are low • No fan out distribution effect • :(Wednesday, November 9, 2011
    32. 32. ShareWednesday, November 9, 2011
    33. 33. FB.ui() - FeedWednesday, November 9, 2011
    34. 34. <script> FB.ui({ method: feed, Code message: Come checkout Laid back radio, name: Laid Back, caption: on Mixcloud, description: ‘Laid back is an internet medium...’, link:’, picture:, actions: [ { name: mixcloud, link: } ] },function(response) { if (response && response.post_id) { _gaq.push([_trackSocial, facebook, share, response]); } }); </script>Wednesday, November 9, 2011
    35. 35. Feed Dialog Tips • Stop using sharer.php • Fb.ui works for logged out users as well • Dont include action link(s) • Share objects not actions • users more likely to add message • Touch point for FB Connect signup • Can directly post to another users wallWednesday, November 9, 2011
    36. 36. Edge Rank News Feed Optimization (NFO)Wednesday, November 9, 2011
    37. 37. Wednesday, November 9, 2011
    38. 38. News Feed Optimization • Create engaging content, encourage likes/ shares/comments • Increase affinity between users (Friend Dialog) • Create > Share > Comment > Like • Reduce time period of activityWednesday, November 9, 2011
    39. 39. Social AnalyticsWednesday, November 9, 2011
    40. 40., November 9, 2011
    41. 41. EngagementWednesday, November 9, 2011
    42. 42. Analytics - Social ActionsWednesday, November 9, 2011
    43. 43. Analytics - Social ActionsWednesday, November 9, 2011
    44. 44. Analytics - Social ActionsWednesday, November 9, 2011
    45. 45. Facebook Platform identify, distribution and communityWednesday, November 9, 2011
    46. 46. 1. Authenticate identity + permissionsWednesday, November 9, 2011
    47. 47. User targetting FB.getLoginStatus(function (response) { if (response.status==connected) { // Auto log the user in } else if (response.status==notConnected) { // Signup with Facebook Dialog } });Wednesday, November 9, 2011
    48. 48. PermissionsWednesday, November 9, 2011
    49. 49. Wednesday, November 9, 2011
    50. 50. 2. Personalize add social contextWednesday, November 9, 2011
    51. 51. Wednesday, November 9, 2011
    52. 52. Wednesday, November 9, 2011
    53. 53. Wednesday, November 9, 2011
    54. 54. Artfinder.comWednesday, November 9, 2011
    55. 55. Artfinder.comWednesday, November 9, 2011
    56. 56. iFrame <iframe src=";width=300&amp;height=300&amp;header=tr ue&amp;colorscheme=light&amp;font&amp;border_color&amp;recom mendations=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:300px;" allowTransparency="true"></iframe> XFBML <fb:activity site="" width="300" height="300"></fb:activity>Wednesday, November 9, 2011
    57. 57. 3. Drive Distribution make it easy to share / contribute backWednesday, November 9, 2011
    58. 58. Touch points key moments in the user journeyWednesday, November 9, 2011
    59. 59. Wednesday, November 9, 2011
    60. 60. Offsite touch pointsWednesday, November 9, 2011
    61. 61. Advanced FB targetting FB.getLoginStatus(function (response) { if (response.status==connected) { // Auto log the user in } else if (response.status==notConnected) { // Signup with Facebook Dialog } });Wednesday, November 9, 2011
    62. 62. Wednesday, November 9, 2011
    63. 63. Customize landing pageWednesday, November 9, 2011
    64. 64. Wednesday, November 9, 2011
    65. 65. Please get in touch Weʼre keen to hear your thoughts Email: Twitter: @matclayton / @mixcloud Code:, November 9, 2011