Lifecycle of a frame app with audio

The audio frame app begins with an initial frame in the same way a standard frame would. It must have at least a single play button specified below for the tagged audio to be playable. If the play button is not included then the audio specified in the tag will be ignored.

frameaudiodiagram_white.png

Properties and Buttons

There are two new additions in this proposal to the existing frame spec to support control of an audio track with frames. Both of these which are optional.

Key Description
fc:frame:audio An externally hosted url to a streamable piece of audio. Clients must implement support for common audio formats supported in the HTML5 spec.
fc:frame:button:$idx:action Adds a new content type to buttons called audio. Adds the audio control button to the specified button index of the frame. This will have a simple “play” and “pause” behavior as illustrated above. If this button is not provided the audio url is ignored.

Listening to frames in a feed

<!-- An example declaring a frame with audio support -->

<meta property="fc:frame" content="vNext" />
<meta property="fc:frame:audio" content="<https://url/to/track.mp3>" />
<meta property="fc:frame:button:1" content="▶⏸" />
<meta property="fc:frame:button:1:action" content="audio" />

Farcaster apps are responsible for streaming the audio to end users. The following rules apply to listening of frames:

  1. If a frame is listened to while another is already playing, the frame most recently clicked on should replace the current track being played.
    1. Activity in the current or another frame that is not related to the audio tags should not interfere with the current playback.
  2. Volume control is left up to the users settings and not controlled through the frame.
  3. If the audio button is present yet the audio frame tag is not or invalid, apps must fall back to the OG audio tag og:audio.

Relevant Links

Farcaster feature proposals: https://github.com/farcasterxyz/protocol/discussions

Frame specification: https://docs.farcaster.xyz/reference/frames/spec

OpenGraph audio: https://ogp.me/#optional