Facebook Developer Garage Milan

Loading...

Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

1 comments

Comments 1 - 1 of 1 previous next Post a comment

Post a comment
Embed Video
Edit your comment Cancel

Notes on slide 1







Facebook’s mission is to give people the power to share themselves and make the world more open and transparent.



What we all do – our engineers at Facebook and developers on Platform – is we give people tools, and the power, to share themselves and communicate in different ways. What we have found is that the most important information in the world is inside people. It’s how they’re thinking, how they’re feeling, how they relate to the people around them. And that information isn’t accessible in the world. It’s not out there available to be indexed. It’s only accessible if people choose to share it themselves and have the tools to do so, and that’s what we’re building.



The first version of the web was about putting all the information that existed offline now online. The next version will be about understanding that the web isn’t about sharing information, it’s about people sharing themselves. The full potential of the web is gives power back to the people so that everyone has a voice and can share what is important to them.



When that happens, more information will be available because people had control and chose to share it. The world will be a more transparent place, and this transparency will help us understand each other. It will help us see the good and the bad that we do and help us give each other more feedback to do more good. As the world gets more and more complex, transparency and sharing are key to the world being in harmony. And that’s what we’re all doing – we’re giving people the power to the share themselves and create this world.



This isn’t one organization’s mission. Making the world more transparent and bringing people together is more than any one organization can do. This is what we’re all doing, and we’re doing it together.


Facebook’s mission is to give people the power to share themselves and make the world more open and transparent.



What we all do – our engineers at Facebook and developers on Platform – is we give people tools, and the power, to share themselves and communicate in different ways. What we have found is that the most important information in the world is inside people. It’s how they’re thinking, how they’re feeling, how they relate to the people around them. And that information isn’t accessible in the world. It’s not out there available to be indexed. It’s only accessible if people choose to share it themselves and have the tools to do so, and that’s what we’re building.



The first version of the web was about putting all the information that existed offline now online. The next version will be about understanding that the web isn’t about sharing information, it’s about people sharing themselves. The full potential of the web is gives power back to the people so that everyone has a voice and can share what is important to them.



When that happens, more information will be available because people had control and chose to share it. The world will be a more transparent place, and this transparency will help us understand each other. It will help us see the good and the bad that we do and help us give each other more feedback to do more good. As the world gets more and more complex, transparency and sharing are key to the world being in harmony. And that’s what we’re all doing – we’re giving people the power to the share themselves and create this world.



This isn’t one organization’s mission. Making the world more transparent and bringing people together is more than any one organization can do. This is what we’re all doing, and we’re doing it together.






























































1) integrate- that’s why you’re here today.
2) Innovate- Integration is just a matter of syntax and technology. Truly revolutionary products have a vision. The most humbling part of my job...
3) Iterate-





7 Favorites

Facebook Developer Garage Milan - Presentation Transcript

  1. Developer Garage Milan Main Topic: Facebook Connect April 23, 2009
  2. James Leszczenski Software Engineer at Facebook james@facebook.com
  3. Agenda 1. Our Mission ▪ 2. Facebook Connect, An Overview ▪ 3. Getting Started ▪ 4. What’s Next? ▪ 5. Questions ▪
  4. Facebook’s Mission: Give people the power to share and make the world more open and connected
  5. Your Mission: Create opportunities for people to share and make the world more open and connected
  6. What are your goals? 1) Build Trafic 2) Create Deep Engagement 3) Profit Wildly
  7. How can Facebook Connect help? 1) Build Trafic through social distribution 2) Create Deep Engagement with identity and social context 3) Profit Wildly with more trafic and engagement
  8. Agenda 1. Our Mission ▪ 2. Facebook Connect, An Overview ▪ 3. Getting Started ▪ 4. What’s Next? ▪ 5. Questions ▪
  9. Overview of Facebook Connect
  10. Engaging with a new site is dificult Think of the steps users need to go through to sign up & engage with your content. • Decide to register • Click “sign up” • Decide on the basics: Which email will I use? The usual password? User name? • Add extra info: Birthday Name etc… • Enter a CAPTCHA • Confirm • Get sent to verify email page • Wait • Go back in your email, verify email • Go back to browser • And… … the end result is a website with no social data, no customization, and no friends  10
  11. Facebook Connect Increase registration, engagement and trafic on your site. Facebook Connect allows your visitors to: Share their identity and log • in with 1 click Identity & Login Bring their friends to your • site, increasing engagement Friends Generate more trafic by • distributing your content to Distribution Facebook’s 200 million users 11
  12. Facebook Connect makes it easy for your users A Connected user brings all of their rich Facebook information and friends to your site in 1 click. • Decide to register • Click “Connect” • Done 1. User’s real identity 2. Easy access to their … a website with your friends and friend content real-life identity, customized content and all your friends. 12
  13. Users share content back to Facebook Content from your site gets shared to Facebook. Trafic comes back to your site. 3. Content from your site is easily distributed on Facebook, sending trafic back to your site. 13
  14. Connect is revolutionizing the web sites nect eb 00 w ook Con ,0 ver 8 Faceb O ed dopt ave a h What sites are seeing: • Registrations 30-100% • User-generated content 15-60% • Each story published to FB generates 0.5 to 2 clicks back to the publishing site “Supporters of this idea say such “It is an ingenious stab at solving several “Because Facebook Connect is not just a programs will help with the emergence nagging problems at once. Web surfers like registration system, but also a marketing of a new ‘social Web,’ because chatter to socialize while they browse the internet, channel with a built-in audience of 130 among friends will infiltrate even sites but many prefer to do so only with their million monthly active users, this program that have been entirely unsociable friends rather than with perfect strangers.” will crush competing registration systems.” thus far.” - Dec 4, 2008 - Nov 30, 2008 - Nov 30, 2008 14
  15. Agenda 1. Our Mission ▪ 2. Facebook Connect, An Overview ▪ 3. Getting Started ▪ 4. What’s Next? ▪ 5. Questions ▪
  16. Getting Started
  17. Objectives Main Objective: Integrate Facebook Connect into a web site ▪ 1. Register a new application with Facebook. ▪ 2. Detect the login status of a user. ▪ 3. Use XFBML/API calls to show user information. ▪ 4. Publish actions to the Stream/News Feed. ▪ 5. More advanced features. ▪
  18. Objectives Main Objective: Integrate Facebook Connect into a web site ▪ 1. Register a new application with Facebook. ▪ 2. Detect the login status of a user. ▪ 3. Use XFBML/API calls to show user information. ▪ 4. Publish actions to the Stream/News Feed. ▪ 5. More advanced features. ▪
  19. Setting Up your Application 1. Go to http://www.facebook.com/developers/ ▪ 2. Click “Set Up New Application” ▪ 3. Choose an Application Name, agree to Terms of Service, ▪ submit. 4. Go to the ‘Connect’ tab and fill in ‘Connect URL’ and ‘Base ▪ Domain’ 5. Submit the form. You now have a new application! ▪
  20. Setting Up your Application (2) 1. Download a cross-domain receiver file ▪ Ex. http://www.somethingtoputhere.com/xd_receiver.htm ▪ 2. Upload xd_receiver.htm to your directory. ▪ 3. Open up the web page for development. ▪ 4. Change the <html> tag to: ▪ <html xmlns:fb=\"http://www.facebook.com/2008/fbml\"> ▪
  21. Setting Up your Application (3) 5. Insert a few lines just before the </BODY> tag: ▪ <script type=\"text/javascript\" src=\"http:// static.ak.connect.facebook.com/js/api_lib/v0.4/ FeatureLoader.js.php\"></script> <script type=\"text/javascript\"> FB.init(\"YOUR_API_KEY_HERE\", \"xd_receiver.htm\"); </script> 6. And save your file. ▪
  22. Objectives Main Objective: Integrate Facebook Connect into a web site ▪ 1. Register a new application with Facebook. ▪ 2. Detect the login status of a user. (Identity) ▪ 3. Use XFBML/API calls to show user information. ▪ 4. Publish actions to the Stream/News Feed. ▪ 5. More advanced features ▪
  23. Login Status 1. Include a Facebook Connect login button: ▪ ▪ <p> Click here to connect with Facebook: <fb:login-button onlogin=\"facebook_onlogin()\"> </fb:login-button> </p> 2. Side note: What is FBML/XFBML? ▪
  24. Login Status (2) 2. Create the facebook_onlogin() function in JavaScript: ▪ <script> function facebook_onlogin() { alert(FB.Connect.get_loggedInUser()); } </script>
  25. Login Status (3) 3. Simpler: Detecting status upon page load: ▪ <script type=\"text/javascript\"> FB.init(\"YOUR_API_KEY_HERE\", \"xd_receiver.htm\", {\"ifUserConnected\" : facebook_onlogin} ); </script>
  26. Objectives Main Objective: Integrate Facebook Connect into a web site ▪ 1. Register a new application with Facebook. ▪ 2. Detect the login status of a user. (Identity) ▪ 3. Use XFBML/API calls to show user information. (Friends) ▪ 4. Publish actions to the Stream/News Feed. ▪ 5. More advanced features. ▪
  27. XFBML 1. Insert XFBML with facebook_onlogin(): ▪ function facebook_onlogin() { fbuid = FB.Facebook.apiClient.get_session().uid; us = document.getElementById('user_section'); us.innerHTML = ‘<fb:profile-pic uid=\"’+fbuid+’\">’ + ‘</fb:profile-pic>’ + ‘<fb:name uid=\"loggedinuser\"></fb:name>’ + ‘has connected with Facebook.’ + ’<br/>’ + ’To log out: <a href=\"#\" onclick=\"FB.Connect.logout(facebook_onlogout)\">Click here</a>'; FB.XFBML.Host.parseDomTree(); // Finds all XFBML tags and re-renders HTML }
  28. XFBML (2) 2. What to do when the user logs out: ▪ function facebook_onlogout() { us = document.getElementById('user_section'); // Reset back to the default state us.innerHTML = 'To log in with Facebook: <fb:login-button onlogin=\"facebook_onlogin()\"></fb:login-button>'; FB.XFBML.Host.parseDomTree(); }
  29. Objectives Main Objective: Integrate Facebook Connect into a web site ▪ 1. Register a new application with Facebook. ▪ 2. Detect the login status of a user. (Identity) ▪ 3. Use XFBML/API calls to show user information. (Friends) ▪ 4. Publish actions to the Stream/News Feed. (Distribution) ▪ 5. More advanced features. ▪
  30. Feed Forms • User-editable comment field • Comment can be pre- filled by application with user content • User comment will be returned to application
  31. Feed Forms (2) • 1. Go to http://developers.facebook.com/ • 2. Click Tools in the top navigation. • 3. Click the Feed Template Console tab. • 4. Choose your new application from the list and click Next. • 5. Fill out a One Line Template + Short Story Template Title. • e.g. “{*actor*} reviewed a restaurant on Citysearch.” • 6. Submit your template, and get a template ID.
  32. Feed Forms (3) // Initialize feed form data var body_general = null; var user_message_prompt = \"How was the restaurant?\"; var user_message = {value: \"The restaurant was...\"}; FB.ensureInit(function() { // Show the feed form to the user FB.Connect.showFeedDialog(<?=FEED_FORM_ID?>, template_data, null, body_general, null, FB.RequireConnect.require, FB.RequireConnect.promptConnect, user_message_prompt, user_message); });
  33. Objectives Main Objective: Integrate Facebook Connect into a web site ▪ 1. Register a new application with Facebook. ▪ 2. Detect the login status of a user. (Identity) ▪ 3. Use XFBML/API calls to show user information. (Friends) ▪ 4. Publish actions to the Stream/News Feed. (Distribution) ▪ 5. More advanced features. ▪
  34. Objectives Main Objective: Integrate Facebook Connect into a web site ▪ 1. Register a new application with Facebook. ▪ 2. Detect the login status of a user. (Identity) ▪ 3. Use XFBML/API calls to show user information. (Friends) ▪ 4. Publish actions to the Stream/News Feed. (Distribution) ▪ 5. More advanced features. ▪ Integration points on facebook.com ▪ Add server-side logic ▪ Anything that Facebook Platform can do. ▪
  35. Agenda 1. Our Mission ▪ 2. Facebook Connect, An Overview ▪ 3. Getting Started ▪ 4. What’s Next? ▪ 5. Questions ▪
  36. What’s Next? 1) Integrate Check out our video tutorials: wiki.developers.facebook.com 2) Innovate 3) Iterate and Grow <fb:comments>, <fb:intl>
  37. Agenda 1. Our Mission ▪ 2. Facebook Connect, An Overview ▪ 3. Getting Started ▪ 4. What’s Next? ▪ 5. Questions ▪
  38. Resources Documentation: wiki.developers.facebook.com Help: forum.developers.facebook.com James Leszczenski james@facebook.com

+ jleszczejleszcze, 7 months ago

custom

1778 views, 7 favs, 4 embeds more stats

Presentation by James Leszczenski at Facebook Devel more

More info about this document

© All Rights Reserved

Go to text version

  • Total Views 1778
    • 1661 on SlideShare
    • 117 from embeds
  • Comments 1
  • Favorites 7
  • Downloads 0
Most viewed embeds
  • 74 views on http://stacktrace.it
  • 38 views on http://fb.mikamai.com
  • 4 views on http://blog.hagam.it
  • 1 views on http://www.esserincomunicazione.it

more

All embeds
  • 74 views on http://stacktrace.it
  • 38 views on http://fb.mikamai.com
  • 4 views on http://blog.hagam.it
  • 1 views on http://www.esserincomunicazione.it

less

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate. If needed, use the feedback form to let us know more details.

Cancel
File a copyright complaint
Having problems? Go to our helpdesk?

Categories