Collections are reusable in-app UI channels to launch Flows without code. Once embedded and styled, Collections can house and display new Flows without code updates. This is especially useful for product teams who want to templatize Flows and enable non-technical teammates to launch them (e.g. product announcements).

Collections also provide governance and orchestration through air traffic control functionality. This includes controls like limits, cool-offs, and priorities. For example, Collections can determine the frequency and timing of a group of Flows to avoid overwhelming users e.g. only show one announcement per day, space out an in-app upsell campaign.

​

Launch with Collections

​

Announcements, Surveys, and Dialogs

Frigade comes with a default Collection called Dialogs. The Dialogs Collection is built-in to the Frigade SDK and can be used to launch Frigade Announcements, Surveys, and other Dialog-based components without updating your product codebase.

import * as Frigade from "@frigade/react";

const FRIGADE_API_KEY = "api_public_abcd1234";

export const App = () => {
  const userId = "...";

  return (
    <Frigade.Provider
        apiKey={FRIGADE_API_KEY}
        userId={userId}
        css={{
        '.fr-announcement': ANNOUNCEMENT_CSS,
        }}>
        {/* ... */}
    </Frigade.Provider>
  );
};

​

Inline UI Components

You can also use Collections to launch new Flows that are embedded directly into your product UI with no-code.

import * as Frigade from '@frigade/react';

const App = () => {
  return (
    <Frigade.Collection collectionId="collection_4jDCTYUm" css={NAV_CARD_CSS}/>
  );
};

​

Creating a Collection

To create a Collection, visit the Collections page in the Frigade dashboard and click on the New Collection button. You will be prompted to enter a name and description for the Collection. Once created, you can access the embed snippet, set the display logic, and add Flows to the Collection.

​

Ordering Flows

You can specify the priority of Flows within the Collection by dragging and dropping them in Flow priority section of the Collection detail page. This is useful for prioritizing content types (e.g. onboarding > upsells > research) or sequences (welcome > getting started > go deeper).

​

Ordering Collections

Collections themselves can also be ordered via drag and drop on the Collections overview page. Because Flows can belong to multiple Collections, this priority informs the order in which Frigade processes each Collection.

​

Combining Collections and Targeting

Collections can and should be combined with Flow targeting to ensure the right Flows are shown to the right users at the right time.

You can think of Collections as content pools. By giving each individual Flow its own targeting, Collections can then personalize the product experience to each user by choosing the highest priority eligible Flow for them.

​

Usecases

​

Feature adoption

Let’s say we have a few different educational in-app sequences to encourage further feature adoption and that a user may be eligible for multiple sequences. For each sequence, we can use Flow targeting to define

1. the eligible audience (e.g. enterprise, free trial, etc.) and
2. the exact order of the sequence (e.g. Flow 1 must be completed to see Flow 2).

If we have defined multiple sequences, we can create a Collection and add all the Flows to ensure that only a single Flow from any campaign can be shown within a desired time frame. This helps ensure that users are not overwhelmed and increases the likelihood that users will engage with the content.

​

Product communications

SaaS products often use dialogs and floating UI to communicate and collect important information. For example, an announcement or a survey. Oftentimes, product teams may accidentally show multiple competing experiences to the same user at the same time.

This can easily be avoided with Frigade. The default Collection called “Dialogs” can house all of our announcements and surveys to spread these experiences out with cool-offs. We can rank these Flows so that onboarding announcements take priority over product updates and user research (or whichever order makes sense for your product).

​

Product Upsells

Let’s say our product has a free trial experience and we want to nudge users toward upgrading to a paid plan. We can create a Collection called “Upsells” and add our entire catalog of upsell Flows to this Collection (announcements, cards, banners, etc.). We can then set a limit of one per day to ensure we’re not overwhelming users with too many upsell messages.

We can define the audience for each Flow to ensure that only users who are actively in a free trial are eligible to be shown the messages. Once a user upgrades, the Flow audiences will prevent them from receiving any further promos in the sequence.

​

Frequently Asked Questions