Tuesday, January 5, 2010

Face Book Applications

A Facebook application can take on many forms. However, to fully utilize the suite of integration points and deliver a full user experience, we recommend integrating your application into the following areas of the Facebook profile:
  1. Application Directory
  2. Application Profile
  3. Canvas Page
  4. Profile
    1. Profile Boxes
    2. Applications Menu
    3. Bookmarks
    4. Application Tabs
    5. Boxes Tab
    6. Application Info Sessions
    7. Publisher
    8. Feed Forms
  5. Privacy Settings
  6. News Feed
  7. Alerts
  8. Requests
  9. User Dashboard
  10. Interacting with Users
On this page, you'll see how our sample application Smiley integrates many of these various components. Note that none of these integration points are mandatory, but the more you include in your application the richer the user experience becomes

Application Directory

Many users may find your application by browsing the Facebook Application Directory. This is where beautiful imagery and concise, descriptive text pay off. You need to submit your application to Facebook so it can be included in the directory.

Application Profile

The Application Profile tells users about your application and is accessed from the Facebook Application Directory. It should inspire users to interact with your application. The profile is a Facebook Page

Canvas Page

This is the main page of your application on Facebook. Application canvas pages appear within the Facebook frame and can either be FBML (Facebook's version of HTML) or an external Web site presented within an iframe.

Profile

The Facebook profile is the online representation of a user's real world identity. We have included many integration points on the profile. This enables you to empower users to express themselves through your application.

Profile Box

The profile box is usually the place to show the most recently updated information or the most recent actions of the user. This information should reflect how the user would want to represent their identity through your application on their profile.
The user can choose to put your box on the main section of her profile (the Wall and Info tabs - see Smiley in the lower left corner of the image), or can put it on the Boxes tab (see below).

Applications Menu

The Applications menu is where users go to access your applications. They can bookmark applications, edit application settings, and go to their recently viewed and bookmarked applications.

Bookmarks

Bookmarks appear on every user's home page as well as on the Applications menu.

Application Tabs

Application tabs let users feature full canvas-like pages for applications they enjoy the most. Tabs behave like a hybrid of a canvas page and a profile box
More information about tabs and how they behave can be found on the Developers Wiki

Boxes Tab

The Boxes tab contains application profile boxes. Users can move profile boxes from the main profile to the Boxes tab and vice versa.

Application Info Sessions

The Info tab on the profile allows users to express their interests in a more structured way than before. Users can add structured information from your applications by way of application info sections. An application info section is a list of text and/or images provided by your application.
When a user chooses to add an application info section, you set the format with the profile.setInfo API call.

Publisher

Applications can integrate into the Publisher so users can create or find rich content and post it directly into their own or their friends' Walls. And these stories can leverage any of the new Feed story sizes — see below for more details.

Feed Forms

Feed forms are special FBML components that allow applications to publish Feed stories on the behalf of users. Your application can publish directly into the user's and the user's friends' Mini-Feeds.

Privacy Settings

Users can set their privacy options from your application's privacy/settings page. These options include approval for publishing stories...
... and whether the user wants to add or remove your application's profile box, tab, and info section, and who can see these elements.
A user can also decide whether to add a bookmark for your application. Bookmarks appear on the Applications menu — see above.

News Feed

Applications can access News Feed and post stories to it. Each user has a maximum number of News Feed stories that they can see from all applications. Once that maximum is reached they cannot see any more application stories during that sweep. For example, the Photos application publishes News Feed stories about photos your friends have uploaded recently.
You send News Feed stories as notifications; use Notifications.send.
In addition, your application can post stories directly onto users' profiles by using Feed forms (see above).

Alerts

Applications can send notifications to a user through email. Users must grant your application permission before they can receive email. The user of the application who triggers this action must approve of the email. You send email with notifications.sendEmail.

Requests

Applications can create requests that show up at the top right of a user's homepage. These requests are usually initiated by a user's friend and often require the user to take some form of action. An example of this in the Photos application is a photo tag request confirmation.
Like News Feed stories, requests are also sent in the form of notifications, so use notifications.send.

User Dashboard

The user dashboard is usually accessed at the top of the application's canvas page. This is where users manage their own content within an application or see information about another user's content within that application.
To create a dashboard, use the fb:dashboard FBML tag.

Interacting with Users

While the current version of the API does not support performing Facebook-specific actions directly, you can direct your users to various Facebook pages to perform an action. To do this, link the user to one of the following pages:
To...Use this URL...
View the specified user's profile. http://www.facebook.com/profile.php?id=XXXXX
Poke the specified user. http://www.facebook.com/poke.php?id=XXXXX
Send a message to the specified user. http://www.facebook.com/message.php?id=XXXXX&subject=XXXXX&msg=XXXXX
Note: {{c|subject}} and {{c|msg}} parameters are optional ways to pre-fill the contents of the message (the user will still be able to edit the message before sending).
Add the specified user as a friend. http://www.facebook.com/addfriend.php?id=XXXXX
See photos taken by the specified user. http://www.facebook.com/photos.php?id=XXXXX
Read or post on the specified user's Wall. http://www.facebook.com/wall.php?id=XXXXX
Read the specified user's notes. http://www.facebook.com/notes.php?id=XXXXX
Note: Facebook doesn't look fondly upon spammy behavior, so please don't encourage your users to abuse this functionality.

1 comment: