Frames introduce a groundbreaking approach to interactive applications within Farcaster. These self-contained applications operate directly in-feed, seamlessly integrating with any Farcaster client. This integration offers developers an unparalleled opportunity for instant distribution of applications or games in a frame format, fostering a surge of creativity and innovation.

​
Key Features of Farcaster Frames

Platform Agnostic

  • While the majority of development on Farcaster Frames has been concentrated around JavaScript, the framework is designed to be language-independent. The core requirement for a Frame is the ability to serve HTML content from a server, making it accessible to a wide range of technologies and programming languages.

Open Graph Standard Compliance

  • Frames leverage the widely-used Open Graph protocol, which utilizes HTML meta tags to convey essential information about web links, including URLs, titles, descriptions, and preview images. Farcaster Frames extend this standard by incorporating additional meta tags for interactive elements such as buttons and endpoint URLs for POST requests. These requests can carry user information and signature data, essential for identity verification and interactive functionalities.

Endless Possibilities for Interactivity

  • The adaptability of Frames has unlocked a myriad of interactive possibilities. Examples of applications range from ordering services (e.g., cookies) and emoji-based chatting to playing iconic games like DOOM - all within the Farcaster feed. This versatility showcases the potential for creating a diverse array of engaging experiences.

​
Frame Analytics

If you are using the FDK and you have linked your Pinata account to your Farcaster account using the Farcaster Integration, then you will be able to take advantage of Frame Analytics.

When using the FDK make sure to use fdk.sendAnalytics method with your own made up frame_id and the frame_data sent from the frame.

You can also include an optional custom_id param to track and segment specific requests within the specified frame.

// This should be the raw payload from the frame action
const frame_data = {
  untrustedData: {
    fid: 2,
    url: "https://fcpolls.com/polls/1",
    messageHash: "0xd2b1ddc6c88e865a33cb1a565e0058d757042974",
    timestamp: 1706243218,
    network: 1,
    buttonIndex: 2,
    inputText: "hello world", // "" if requested and no input, undefined if input not requested
    castId: {
      fid: 226,
      hash: "0xa48dd46161d8e57725f5e26e34ec19c13ff7f3b9",
    },
  },
  trustedData: {
    messageBytes: "d2b1ddc6c88e865a33cb1a565e0058d757042974...",
  },
};
const frame_id = "my-unique-frame-name"
const custom_id = "my_custom_id"


await fdk.sendAnalytics(frame_id, frame_data, custom_id)

After this is deployed you will see the analytics on the Frame Analytics Page.

​
Frame Tutorials

Dive deeper into the world of Farcaster Frames with our comprehensive tutorials, designed to cater to a variety of technical backgrounds.

Image UploadsHubs