Google Devfest 2009 Argentina - Google and the Social Web

2,067 views
2,003 views

Published on

Google Devfest 2009 Argentina - Google and the Social Web

Published in: Technology, News & Politics
0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,067
On SlideShare
0
From Embeds
0
Number of Embeds
7
Actions
Shares
0
Downloads
31
Comments
0
Likes
4
Embeds 0
No embeds

No notes for slide

Google Devfest 2009 Argentina - Google and the Social Web

  1. 1. Google and the social Web Patrick Chanezon @chanezon Google Mauro Gonzalez @gmaurol Globant 11/16/09 Post your questions for this talk on Twitter #devfest09 #opensocial
  2. 2. “The web is better when it's social.” David Glazer, Google Engineering Director
  3. 3. Clock 4
  4. 4. Movies 5
  5. 5. Stocks 6
  6. 6. Google is Better When it’s Social
  7. 7. Google Docs Collaboration is social 8
  8. 8. Google Reader Sharing is social 9
  9. 9. Google Groups, Google Talk, Gmail Communication is social 10
  10. 10. YouTube Updates are social 11
  11. 11. Implicit Social Graphs
  12. 12. Google Contacts –  Contacts lets users manage relationships 13
  13. 13. Profiles –  Let users create a persona –  Public image on the web –  Available in search 14
  14. 14. What's Google Getting with Social? •  Richer web apps More revenue More users Increased usage 15
  15. 15. Recommendations for the Social Web Use the same approach –  Interact with your friends where you are and where they are –  Don't lock users into a single site –  Take advantage of implicit social graphs The result is more powerful, more useful applications 16
  16. 16. How Developers Benefit
  17. 17. How Developers Benefit –  Use Google's social graph •  In your own apps •  To integrate with our apps •  To add features to our apps –  Several technologies to accomplish these goals… 18
  18. 18. OpenSocial –  Common APIs for accessing social data •  People •  Activities •  App Data –  JavaScript, REST, and RPC implementations –  Newest version, 0.9, just released 19
  19. 19. OpenSocial Supporting products 20
  20. 20. Portable Contacts –  The coolest technology without a logo –  Fully compatible with opensocial.Person API –  Pulls the user's social graph into a 3rd party site (with the user's permission) 21
  21. 21. Google Friend Connect –  Uses OpenSocial (gadgets, REST/RPC) –  Allows site owners to mix in social data to existing sites –  Cut and paste or –  Deep integrations 22
  22. 22. Back to OpenSocial… 23
  23. 23. What They Have in Common –  Millions of users with a shared focus and demands –  Common social graph and social data •  Uses the 'Friends' group in Contacts •  App data is shared between app instances •  The same endpoint is used for the REST/RPC protocols 24
  24. 24. iGoogle OpenSocial –  Provides 'home' and 'canvas' views –  requestShareApp and Updates for organic growth 25
  25. 25. Gmail OpenSocial –  Provides 'nav' and 'canvas' views –  Enabled as a Gmail Labs feature 26
  26. 26. Google Calendar OpenSocial –  Early preview –  Provides 'nav' and 'canvas' views –  Includes google.calendar API extensions, eg: •  google.calendar.showEvent •  google.calendar.subscribeToDates •  google.calendar.getUserEvents 27
  27. 27. Google Calendar OpenSocial –  Gadgets are all about making Calendar extensible –  Bringing apps into Calendar –  Private whitelist for now, open to developers in the near future –  Check out the Developer Sandbox at I/O for a closer look at more details 28
  28. 28. Container Cheat Sheet Leverage social graph Quick data entry Dashboard view Container-specific extensions 29
  29. 29. Quartermile: An Example Gadget 30
  30. 30. Quartermile: An Example Gadget
  31. 31. Quartermile Gadget overview –  Track exercise with others –  View stats –  Quick, "smart" data entry box –  Google App Engine backend 32
  32. 32. Quartermile Architecture Signed request JSON 33
  33. 33. Quartermile Designing for iGoogle Leverage social graph Quick data entry Dashboard view Container-specific extensions 34
  34. 34. Quartermile Joining a team –  Load VIEWER_FRIENDS –  Send result to backend –  Return set of "interesting" teams 35
  35. 35. Quartermile Retrieving friends (client) var batch = osapi.newBatch(). add('viewer', osapi.people.getViewer()). add('friends', osapi.people.get({ userId: '@viewer', groupId: '@friends' })); batch.execute(callback); 36
  36. 36. Quartermile Retrieving friends (compared with 0.8) var req = opensocial.newDataRequest(); req.add(req.newFetchPersonRequest('VIEWER'), 'viewer'); var friends = opensocial.newIdSpec({ 'userId':'VIEWER', 'groupId':'FRIENDS' }); req.add(req.newFetchPeopleRequest(friends), 'friends'); req.send(callback); 37
  37. 37. Quartermile Getting a team list (client) // ['2001', '2003', '3000'] function getInterestingTeams(ids) { var request = { 'method':'get_interesting_teams', 'data':ids }; osapi.http.post(SERVER, { body: gadgets.json.stringify(request) }). execute(displayTeams); } 38
  38. 38. Quartermile Getting a team list (server) // team_ids = [2001, 2003, 3000] teams = model_get_by_id(models.Team, team_ids) gql = models.Team.gql("ORDER BY count DESC") interesting_teams = gql.fetch(Settings.MAX_INTERESTING_TEAMS) return teams + interesting_teams 39
  39. 39. Quarter Mile Displaying the list of teams (client) //[{'team_id':2001, 'team_name':'Fitness Nuts'}, // {'team_id':2003, 'team_name':'Code Runners'}] function displayTeams(data) { var teams = data.teams; for (i in teams) { $('#interesting').append(jQuery('<li>' + teams[i].team_name + '</li>'); } } 40
  40. 40. Quartermile Designing for Gmail Leverage social graph ✓ Quick data entry Dashboard view Container-specific extensions 41
  41. 41. Quartermile Recording an exercise –  User enters an activity –  Gadget sends request to server –  Response is rendered in the activity list 42
  42. 42. Quartermile Recording an exercise (client) // 'walked 1 mile' function saveExercise(text) { var request = { 'method':'create_activity', 'data':text }; osapi.http.post(SERVER, { body: gadgets.json.stringify(request) }). execute(updateExercises); } 43
  43. 43. Quartermile Designing for Gmail part two Leverage social graph ✓ Quick data entry ✓ Dashboard view Container-specific extensions 44
  44. 44. Quartermile Displaying a dashboard 45
  45. 45. Quartermile Navigating to the canvas view (client) gadgets.views.requestNavigateTo('canvas'); 46
  46. 46. Quartermile Rendering charts (client) var table = new google.visualization.DataTable(); table.addColumn('string', 'Timestamp'); for (i in data.accounts) { ... } var chart = new google.visualization.ColumnChart( document.getElementById('dash_chart')); chart.draw(table, {isStacked:true, width:600, height:400, legend:'bottom'}); 47
  47. 47. Quartermile Designing for Calendar Leverage social graph ✓ Quick data entry ✓ Dashboard view ✓ Container-specific extensions 48
  48. 48. Quartermile Viewing a slice of data –  User loads Calendar –  User switches between dates or daily, weekly, or monthly view –  List of activities updates based on the current view range 49
  49. 49. Quartermile Specifying a date callback (client) function changeDateView(dateRange) { var startTime = dateRange.startTime; var endTime = dateRange.endTime; updateRange(startTime, endTime); } google.calendar.subscribeToDates(changeDateView); 50
  50. 50. Quartermile Finished gadget Leverage social graph ✓ Quick data entry ✓ Dashboard view ✓ Container-specific extensions ✓ 51
  51. 51. Quarter Mile Getting users –  Submit to container directory –  Use available API calls for organic growth •  requestShareApp, Updates –  Cross promote –  Advertise 52
  52. 52. Out to the Social Web 53
  53. 53. Out to the Social Web Signed request JSON 54
  54. 54. Google Friend Connect Integrations •  Wordpress •  Drupal 55
  55. 55. Q&A

×