On their annual f8-event in September 2011, Facebook introduced the biggest change to the platform since News-Feed in 2006: Timeline & Open Graph
In this briefing we want to give you an overview on these game-changing features, especially focussing on the opportunities they represent for publishers, startups and brands. Also included are our learnings from +1 year development on the Open Graph, best practises, recent changes, how to increase visibility of your stories etc.
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
Facebook Timeline & Open Graph Platform Briefing 11/2012
1. thanks for the ad(d).
Facebook Timeline & Open Graph
Platform Briefing - Die Socialisten 11/2012
(Photo: Facebook.com)
2. About: Die Socialisten
"Die Socialisten" is a Vienna-based social-software agency
focussing on the design & implementation of
applications and marketing-solutions on social web
platforms like Facebook.
To date, we have successfully built more than onehundred
brand-pages, applications and integrations of external
websites.
Our clients include Red Bull, Axel Springer/Bild.de,
Bertelsmann, FTD, Krone Multimedia, ATV and Hitradio Ö3.
"Die Socialisten" are Austria's first agency listed in the
official "Facebook Preferred Marketing Developer"-program.
http://die.socialisten.at | http://facebook.com/diesocialisten
die.socialisten.at
social network development
4. Intro:
Facebook Open Graph / Timeline
On their annual f8-event in September 2011, Facebook
introduced the biggest change to the platform since
News-Feed in 2006:
Timeline & Open Graph
In this briefing we want to give you an overview on these
game-changing features, especially focussing on the
opportunities they represent for publishers, brands and
startups.
Plus: Lessons learned after developing +1 year for the
Open Graph and launching numerous apps...
die.socialisten.at
social network development
5. Intro:
Facebook Open Graph / Timeline
The basic idea behind Timeline-/Open Graph-Apps:
People already are using apps (on Facebook, on the Web, Mobile).
People are doing all kinds of things on these apps (listening to
songs, watching movies, publishing what books they read, recording
their sports-activities etc.). Let’s call these activities ”actions”.
Now, let people continue using their apps the way they are already
doing it (no need to force them into new “Facebook-Canvas-Apps”).
Instead: let them publish all actions they want to their Timeline-
profile, by connecting your app to the Open Graph!
die.socialisten.at
social network development
6. Rewind:
Open Graph Protocol
Released in 2010, Open Graph Protocol allowed publishers to
connect their websites, blogs, apps with the Facebook Social Graph.
How? By adding the Like-Button:
die.socialisten.at
social network development
7. Open Graph Protocol connected users and objects with one type of
edge - the “like”. The objects (mostly articles, videos...) are
incorporated into Facebooks social graph.
8. Intro:
Facebook Open Graph / Timeline
With Timeline / Open Graph, Facebook allows developers to publish
almost any kind of connection between users and objects.
Objects can be any piece of content (music, video, article...), but
also more app-specific things - a running-route, a comment on a
book, a recipe...
Actions can be all kinds of verbs - read, listen to, watch, cook,
recommend, collect, run, comment...
die.socialisten.at
social network development
9. With Open Graph, users can connect with objects with all sorts
of actions! Everything is represented in Facebooks social graph.
10. Intro:
Facebook Open Graph / Timeline
How & when are Open Graph Actions published?
In some cases, actions can be published automatically,
after a user has consumed content for a while (Audio,
Video, News) = “Passive Sharing”
However, users should always be able to easily un-publish and opt-out.
Examples: Spotify, Social Reader-Apps...
In most cases, actions should be published when the
user takes the particular action in your app =
“Explicit Sharing”
When a comment is posted, a rating done, a friend followed etc.
die.socialisten.at
social network development
11. Intro:
Facebook Open Graph / Timeline
Two important caveats:
1. Users have to approve each app, before it is allowed to
publish to their timeline! Actions will never be published
without the users explicit consent!
die.socialisten.at
social network development
12. Intro:
Facebook Open Graph / Timeline
Two important caveats:
2. All actions a developer wants
to use, must be approved by
Facebook first!
The Approval-Process normally
takes a few days max.
Facebook checks on grammar,
user-experience, abuse etc.
die.socialisten.at
social network development
13. Intro:
Facebook Open Graph / Timeline
Why start building for Open Graph today?
Actions published through your App receive a great amount of
exposure on the platform, and therefore can drive massive traffic to
your app or content-site:
Early results from US-centric Showcase-apps are very promising:
Yahoo! News (+600% Referral-Traffic von Facebook)
The Independent (>1mio monthly active users)
The Guardian (4mio app installs)
Washington Post (3.5mio app installs)
Source: Facebook (https://developers.facebook.com/blog/post/603/)
die.socialisten.at
social network development
14. Intro:
Facebook Open Graph / Timeline
What type of apps can integrate with Open Graph?
- Stand-alone Web-Apps (http://yourdomain.com)
- Canvas- & Tab-Apps within Facebook
(http://apps.facebook.com/yourapp)
- Mobile Web-Apps
- Native iOS- & Android-Apps
-
die.socialisten.at
social network development
15. Intro:
Facebook Open Graph / Timeline
Not only content-sites, but apps & startups as well!
Lots of showcases incl. numbers, best practises can be found at:
http://developers.facebook.com/blog/archive#2012 (search f. “spotlight”)
die.socialisten.at
social network development
16. Intro:
Facebook Open Graph / Timeline
mixcloud.com: -40% bouncerate f. Facebook-referrals, spotlight
friends’ activity, easy sharing of listened music.
die.socialisten.at
social network development
17. Intro:
Facebook Open Graph / Timeline
tumblr.com: Increased Facebook-Referral Traffic x2!
die.socialisten.at
social network development
18. Intro:
Facebook Open Graph / Timeline
endomodo: Increased Facebook-Referral Traffic x1.75,
No. of shared stories on Facebook x2.5! die.socialisten.at
social network development
20. Intro:
Facebook Open Graph / Timeline
So, where are actions displayed, once they are being published?
They’re featured in the News-Feed, when deemed more important or
when similar actions have been performed (Cluster).
They’re featured on the new Ticker in Realtime.
They’re featured in Stories & Aggregations on Timeline-Profiles.
They’re featured in app-specific Timeline-Views on profiles.
Not all published actions will be displayed in every channel!
All your friends can see published actions, wether they have installed
the app, from which actions are originating from, or not!
die.socialisten.at
social network development
21. Distribution:
Where are Actions being displayed?
Newsfeed - Single Action:
Available f. all Custom
Actions, but heavily
filtered by GraphRank
(=most OG-actions won’t
be displayed in
Newsfeed!)
die.socialisten.at
social network development
22. Distribution:
Where are Actions being displayed?
Newsfeed - Multiple Actions:
Available f.
all Custom
Actions, but
heavily
filtered by
GraphRank
(=most OG-
actions won’t
be displayed
in Newsfeed!)
die.socialisten.at
social network development
23. Distribution:
Where are Actions being displayed?
Newsfeed - Aggregated:
Only f. Built-in Actions
(maybe even only
“listen”?) - Heavily
filtered by GraphRank
die.socialisten.at
social network development
24. Distribution:
Where are Actions being displayed?
Newsfeed - Aggregated:
Only f. Built-in Action
“read”. Only displayed
if a no. of friends have
read the article!
die.socialisten.at
social network development
25. Distribution:
Where are Actions being displayed?
Ticker:
Contains more
actions, but is
still filtered, so
f.e. not every song
listened on Spotify
is displayed!
die.socialisten.at
social network development
26. Distribution:
Where are Actions being displayed?
Timeline - Stories:
Most actions won’t be
displayed as separate
story. There are some
tricks though :)
die.socialisten.at
social network development
27. Distribution:
Where are Actions being displayed?
Timeline - Aggregations:
Facebook will display
aggregations for most
frequently used apps only!
die.socialisten.at
social network development
29. Distribution:
Where are Actions being displayed?
Timeline - App-Views:
App-specific Views are quite hidden, only
user can set visible tiles! Still a great
feature to show off all your aggregations!
die.socialisten.at
social network development
30. Distribution:
Where are Actions being displayed?
Dev-Tip: Users see all published actions in the “Activity Log” -
contains all actions, from all apps, no matter how it was published!
die.socialisten.at
social network development
31. The Activity Log: If its not there,
it probably hasn’t been published at all!
die.socialisten.at
social network development
39. Best Practise:
Built-in Open Graph-Actions
For content-heavy sites (news, video, music):
Use the built-in actions read, watch, listen!
Feel free to share these actions passively!
(=in the background, with no explicit user-interaction)
Give users a clear indication that
they’ve published an action!
Give users an easy undo-option and/or history/log
to un-publish their actions!
Give users an easy way to opt-out
for the session or even forever!
die.socialisten.at
social network development
40. Best Practise:
Built-in Open Graph-Actions
Opt-out, Indication & Undo
http://apps.facebook.com/meinklub
die.socialisten.at
social network development
41. Best Practise:
Built-in Open Graph-Actions
Action-History/Log
http://apps.facebook.com/meinklub
die.socialisten.at
social network development
42. Best Practise:
Custom Open Graph-Actions
Add 3+ Custom Open Graph-actions
that mirror the interactions users naturally take in your app!
Add rich OG meta-data your OG-objects!
Connect your OG-object-model!
Build rich stories for your published OG-actions!
Build attractive aggregations for Timeline!
Watch out: Passive Sharing is not allowed for Custom
Actions starting February 2013!
die.socialisten.at
social network development
44. Best Practise:
Custom Open Graph-Actions
Let users enter custom messages!
die.socialisten.at
social network development
45. Best Practise:
Custom Open Graph-Actions
Inter-connect your OG-object-model & add rich metadata!
die.socialisten.at
social network development
46. Best Practise:
Custom Open Graph-Actions
Let users upload images & add location!
die.socialisten.at
social network development
47. Best Practise:
Custom Open Graph-Actions
Use @-mentions to Tag friends!
die.socialisten.at
social network development
48. Best Practise:
Custom Open Graph-Actions
How-to increase visibility of Custom Actions
in Newsfeed and other channels!
- Add OG-metadata to your stories!
- Let users add custom text-messages
- Let users add location
- Let users upload images
- Let users @-mention friends
- Use “fb_explicit_sharing”-Option when publishing
die.socialisten.at
social network development
49. Die Socialisten
Apps Showcase 2012
Mein Klub
http://apps.facebook.com/meinklub
Last.fm Scrobbler f. Facebook
http://apps.facebook.com/lastfm-og-scrobbler
Krone Social TV
http://www.facebook.com/kronetv?sk=app_135828866537171
ATV ampunkt
http://www.facebook.com/AmPunkt/app_119818284846
Uberch.at
http://uberch.at/
Social Reader Widget
http://nonsmokingarea.com/blog/
http://www.thomashutter.com
http://www.nintendo-online.de
Social Wall
http://wall.socialisten.at/
Swat.io
http://www.swat.io/
die.socialisten.at
social network development
50. “Facebook Programmierung -
Entwicklung von Social Apps & Websites”
Michael Kamleitner, Galileo Computing 2012
http://book.socialisten.at
die.socialisten.at
social network development