Facebook Login and Open Graph at Conversion Conference London by Timon Hartung. http://www.timonhartung.com

1. Facebook Login & Open Graph
by Timon Hartung @ Conversion Conference London 2012
source: http://www.digitaltrends.com/opinion/opinion-where-should-you-stand-on-kony-2012-just-ask-your-social-network/ 1
Donnerstag, 29. November 12

2. Timon Hartung
• CTO at 121WATT.de
• Master of Business Informatics
• 9 years SEO & online marketing
experience
• Former Head of Online Marketing
at amiando
• Consulting cooperations on
international SEO
• 13 years coding experience Java,
PHP, MySQL
• Previously spoken at SMX Munich
and Social Media Economy Days
2
Donnerstag, 29. November 12

3. I am not a
Conversion Rate Expert
3
Donnerstag, 29. November 12

4. I want to show you what you can do with
Facebook
4
Donnerstag, 29. November 12

5. Identity Login after Login
5
Donnerstag, 29. November 12

6. Identity on the Web
source: http://youthadvisoryboard.wordpress.com/2012/05/14/social-networking-the-digital-identity/ 6
Donnerstag, 29. November 12

7. Offline - Identity
7
Donnerstag, 29. November 12

8. Offline - Identity - Who are we?
8
Donnerstag, 29. November 12

9. Online - Identity
9
Donnerstag, 29. November 12

10. Online - Identity
PsyGnamStyle2000
Real name Nickname
(Avatar)
10
Donnerstag, 29. November 12

11. Online - Identity
Nickname
11
Donnerstag, 29. November 12

12. Online - Identity
& &
PsyGnamStyle2000
Real name Nickname
(Avatar)
Google+ & Facebook & other OAuth applications want to connect
those nicknames to real people in the real world. 12
Donnerstag, 29. November 12

13. The Internet giant Google wants to ring in the end of
anonymity on the web. Its new social network Google+
requires all members to log in with their official names. Who
doesn‘t, is warned and then excluded.
Source: http://www.zeit.de/2011/32/P-op-ed-Anonymitaet 13
Donnerstag, 29. November 12

14. Would it not civilize the web if all people would be
online under their real names, just like in real life?
Source: http://www.zeit.de/2011/32/P-op-ed-Anonymitaet 14
Donnerstag, 29. November 12

15. Digital Identity Supremacy
15
Donnerstag, 29. November 12

16. google vs. facebook vs. Microsoft
Source: http://blogs.canada.com/2012/01/20/fortune-names-google-best-place-to-work/ Source: http://www.theepochtimes.com/n2/business/how-valuable-is-a-like-on-your-facebook-fan-page-200796.html
Source: http://es.wikipedia.org/wiki/Archivo:Microsoft_Sign_on_German_campus.jpg
Competitors to an identity on the web. Facebook with fb Login and
google with its google app logins. 16
Donnerstag, 29. November 12

17. google vs. facebook
Source: http://blogs.canada.com/2012/01/20/fortune-names-google-best-place-to-work/ Source: http://www.theepochtimes.com/n2/business/how-valuable-is-a-like-on-your-facebook-fan-page-200796.html
Competitors to an identity on the web. Facebook with fb Login and
google with its google app logins. 17
Donnerstag, 29. November 12

18. Who‘s going to be the winner?
18
Donnerstag, 29. November 12

19. Over 1 billion active users on Facebook
Source: http://www.statista.com/topics/751/facebook/chart/639/monthly-active-users-of-facebook/ 19
Donnerstag, 29. November 12

20. Over 1 billion active users on Facebook
20
Donnerstag, 29. November 12

21. Facebook the Consumer Identity on the Web
21
Donnerstag, 29. November 12

22. facebook the „Consumer Identity“ on the Web
Profil Pictures
Friends
Things you „Like“
22
Donnerstag, 29. November 12

23. facebook the „Consumer Identity“ on the Web
23
Donnerstag, 29. November 12

24. Quick: Social Plugins
source: http://www.ecreativeim.com/blog/2011/05/facebooks-like-icon-drives-traffic-to-your-website/ 24
Donnerstag, 29. November 12

25. fb: Facepile
25
Donnerstag, 29. November 12

26. fb: Like box
26
Donnerstag, 29. November 12

27. fb: Like button
27
Donnerstag, 29. November 12

28. Example Lieferheld.de
28
Donnerstag, 29. November 12

29. fb: log in
29
Donnerstag, 29. November 12

30. is facebook Log in exciting?
30
Donnerstag, 29. November 12

31. facebook Login
source: http://www.4thmedia.org/2012/06/06/facebook-targeting-pre-teens/facebook-login/ 31
Donnerstag, 29. November 12

32. Live Example: AirBnB www.airbnb.com
32
Donnerstag, 29. November 12

33. Facebook Login Step 1
33
Donnerstag, 29. November 12

34. Facebook Login Step 2
34
Donnerstag, 29. November 12

35. Facebook Login Step 3
35
Donnerstag, 29. November 12

36. Facebook Login Step 4
36
Donnerstag, 29. November 12

37. Why is the login button so cool for the users?
37
Donnerstag, 29. November 12

38. Why is the login button so cool for the users?
•2 clicks and you are logged in
•ultrafast
•Always logged in
•fewer passwords
•Easier to interact with friends
•relatively Safe
38
Donnerstag, 29. November 12

39. Why the login button is cool for companies?
39
Donnerstag, 29. November 12

40. Why the login button is cool for companies?
•Possible higher conversion for registrations
•Access to the user's data
•Access to the Friends of the user
•Possibly viral spread through the actions the user makes
•Custom user expierence, custom landing pages
•Less fake registrations
40
Donnerstag, 29. November 12

41. Okay! The users can log on super easy and now?
41
Donnerstag, 29. November 12

42. Facebook Login normal!
42
Donnerstag, 29. November 12

43. tripadvisor example
43
Donnerstag, 29. November 12

44. tripadvisor example
44
Donnerstag, 29. November 12

45. What if we already had the fb data?
45
Donnerstag, 29. November 12

46. Facebook Login on Crack :)
source: http://www.fanpop.com/clubs/animal-humor/images/29016374/title/funny-animals-photo 46
Donnerstag, 29. November 12

47. tripadvisor example
47
Donnerstag, 29. November 12

48. tripadvisor example
48
Donnerstag, 29. November 12

49. tripadvisor example
49
Donnerstag, 29. November 12

50. tripadvisor example
50
Donnerstag, 29. November 12

51. tripadvisor example
51
Donnerstag, 29. November 12

52. tripadvisor example
52
Donnerstag, 29. November 12

53. tripadvisor example
53
Donnerstag, 29. November 12

54. tripadvisor example
54
Donnerstag, 29. November 12

55. tripadvisor example
55
Donnerstag, 29. November 12

56. tripadvisor example
56
Donnerstag, 29. November 12

57. How cool that would be?!
57
Donnerstag, 29. November 12

58. Unfortunately, it is not so easy!
•Instant personalization is currently
only available for 8 selected
facebook partners in the U.S.
58
Donnerstag, 29. November 12

59. Instant Personalization
source: http://www.mrcapetown.co.za/brands-marketing/sneakers-3-0-who-is-your-favourite-brand-and-why/ 59
Donnerstag, 29. November 12

60. Instant Personalization: Rotten Tomatoes
60
Donnerstag, 29. November 12

61. Instant Personalization: Scribd
61
Donnerstag, 29. November 12

62. Instant Personalization: Bing
62
Donnerstag, 29. November 12

63. Instant Personalization: Yelp
63
Donnerstag, 29. November 12

64. Facebook Instant Personalization
•https://www.facebook.com/instantpersonalization/
64
Donnerstag, 29. November 12

65. So you still have to get the users to register with
your conversion optimization skills. But then you‘re
ready to go!
65
Donnerstag, 29. November 12

66. Behind the Facebook Login
source: http://www.scenicrefl ections.com/download/208106/THE_OPEN_DOOR_IN_HEAVEN_Wallpaper/ 66
Donnerstag, 29. November 12

67. Access to the users friends (Airbnb)
67
Donnerstag, 29. November 12

68. Access to the users friends (Pinterest)
68
Donnerstag, 29. November 12

69. Access to the users data in the Open Graph
69
Donnerstag, 29. November 12

70. What is the Open Graph?
70
Donnerstag, 29. November 12

71. What is the Open Graph?
•Facebook is built on the Social Graph
•The social graph are all people, objects and links on
facebook
•The social graph has been repeatedly extended by
Images, places, likes, ...
71
Donnerstag, 29. November 12

72. This is the Social Graph!
72
Donnerstag, 29. November 12

73. What is the Open Graph?
•The Open Graph is an extension of the Social Graph
73
Donnerstag, 29. November 12

74. What is the Open Graph?
•First, in 2010, the Open Graph Protocol (OGP) was
introduced to be able to „like“ third-party websites
(OGP meta tags)
74
Donnerstag, 29. November 12

75. Open Graph Protocol
•With the OGP tags normal web
pages are enriched to objects in the
Facebook social graph
<html prefix="og: http://ogp.me/ns#">
<head>
<title>The Rock (1996)</title>
<meta property="og:title" content="The Rock" />
<meta property="og:type" content="video.movie" />
<meta property="og:url" content="http://www.imdb.com/title/tt0117500/" />
<meta property="og:image" content="http://ia.media-imdb.com/images/rock.jpg" />
...
</head>
...
</html>
75
Donnerstag, 29. November 12

76. Open Graph Protocol
•By the OGP tags in the HTML head
facebook can represent a website
shared or liked on facebook as desired.
76
Donnerstag, 29. November 12

77. Example: OGP Tags good and bad
77
Donnerstag, 29. November 12

78. OGP Tags good
78
Donnerstag, 29. November 12

79. OGP Tags bad
79
Donnerstag, 29. November 12

80. What is the Open Graph?
•Then the Open Graph was extended to Actions and
Objects so third-party apps can integreate as deeply as
possible with facebook now.
80
Donnerstag, 29. November 12

81. Actions & Objects
•Fb apps can now integrate their own vocabulary and
behavioral adaptations on facebook
•A cooking app can set e.g. the Action "cook" with the
object "recipe"
•Actions are like verbs and nouns are like objects
•So users can now cook recipes on facebook
81
Donnerstag, 29. November 12

82. Actions & Objects
82
Donnerstag, 29. November 12

83. Actions & Objects
•Thus, all Social Objects in the social graph are
connected to each other through actions.
•Exactly this data and connections can be read via the
Open Graph by others (if the user agrees)
83
Donnerstag, 29. November 12

84. All Social Objects in the social graph are
connected to each other through actions.
84
Donnerstag, 29. November 12

85. Let‘s have a look at this!
85
Donnerstag, 29. November 12

86. The Open Graph Explorer
86
Donnerstag, 29. November 12

87. Access the users data via the Open Graph with the
Open Graph Explorer
87
Donnerstag, 29. November 12

88. Example:
Open Graph Explorer:
https://developers.facebook.com/tools/explorer/
Graph API:
https://developers.facebook.com/docs/reference/api/
88
Donnerstag, 29. November 12

89. Privacy!
89
Donnerstag, 29. November 12

90. Privacy & Dialogs
•Nearly any data from the user can be read via the Open
Graph API.
•BUT ONLY if the user chooses to share this data with
the App via the App Authentication dialog.
90
Donnerstag, 29. November 12

91. Privacy & Dialogs
•If the user chooses to let his data be accessed via the
dialog there is no data privacy or protection issue.
91
Donnerstag, 29. November 12

92. Privacy & Dialogs
92
Donnerstag, 29. November 12

93. Datenschutz & Dialoge: Share Public
93
Donnerstag, 29. November 12

94. Datenschutz & Dialoge: Share Friends
94
Donnerstag, 29. November 12

95. Sharing & Actions from fb Apps
95
Donnerstag, 29. November 12

96. Manual Actions & Passive Actions
•Active / manual actions:
• Like, Eat, Buy, ....
•Passive actions:
• Read, Listen, ...
96
Donnerstag, 29. November 12

97. Passive Actions
97
Donnerstag, 29. November 12

98. Active / manual Actions
98
Donnerstag, 29. November 12

99. Passive Actions
99
Donnerstag, 29. November 12

100. Active / manual Actions from foursquare
100
Donnerstag, 29. November 12

101. Sharing
•Apps can:
•Add to the news feed
•Appear when using in Ticker
•and appear aggregated in the timeline
101
Donnerstag, 29. November 12

102. source: http://developer.facebook.com 102
Donnerstag, 29. November 12

103. Takeways
•The Facebook Login an fast and safe way for the user
to log in
•Enterprises can give users a customized user
Expierence
•Social interactions after login can be shared
automatically or manually to friends and thus generate
traffic again
103
Donnerstag, 29. November 12

104. Thank you!
get in touch:
• facebook.timonhartung.com
• @timondeluxe
• linkedin.timonhartung.com
• googleplus.timonhartung.com
• www.121watt.de
104
Donnerstag, 29. November 12