Skip to content

Getting Started with FanFest

Welcome to the FanFest Platform! This guide is designed for product managers, account success managers, and team leads who are coordinating a FanFest integration.

What is FanFest?

FanFest is a comprehensive engagement and loyalty platform that helps websites and applications:

  • Track user interactions and engagement across your digital properties
  • Reward users automatically for their engagement through a points and badges system
  • Create interactive content like contests, shows, and challenges
  • Integrate seamlessly with your existing authentication system
  • Maintain your brand identity with customizable visual elements

Who Does What?

Implementing FanFest involves different team members with specific responsibilities. Use this guide to understand what resources each person needs.

For Your Development Team

Share: SDK Introduction and SDK Quickstart

What they'll do:

  • Install and configure the FanFest SDK on your website
  • Integrate with your Single Sign-On (SSO) provider
  • Add event tracking to user interactions (clicks, page views, custom events)
  • Test the integration in staging and production environments

Prerequisites they'll need:

  • Admin access to your identity provider (Auth0, Okta, etc.)
  • Ability to add JavaScript to your website
  • A deployed website with HTTPS
  • FanFest API credentials (provided by your account manager)

For Your Design Team

Share: Design Guidelines

What they'll do:

  • Prepare channel logo (square format, optimized for various display sizes)
  • Create channel banner (hero image for your FanFest channel page)
  • Design thumbnails for shows and contests
  • Design images for media shares, offers, and contest prizes
  • Optionally customize theme colors using design tokens

Specifications they'll need:

  • Logo: 256×256 px minimum (square), PNG format
  • Banner: 1640×600 px minimum (~2.73:1 aspect ratio)
  • Show/Contest Thumbnails: 624×400 px minimum (1.56:1 aspect ratio)
  • Media Share Images: Portrait (4:5) or Square (1:1) recommended
  • Offer & Prize Images: 1080×1080 px (square format)
  • All design token references for advanced theming

Implementation Checklist

Use this checklist to track your FanFest integration progress:

Phase 1: Planning & Preparation

  • [ ] Identify your development, design, and content team members
  • [ ] Obtain FanFest API credentials from your account manager
  • [ ] Review technical requirements with your development team
  • [ ] Identify which user interactions you want to track

Phase 2: Technical Integration

Phase 3: Design & Branding

  • [ ] Designer: Create channel logo per specifications
  • [ ] Designer: Create channel banner per specifications
  • [ ] Designer: Prepare show and contest thumbnails per specifications
  • [ ] Designer: Create media share, offer, and prize images as needed
  • [ ] Optional: Configure custom theme tokens

Phase 4: Content Setup

  • [ ] Set up your first show or contest in the FanFest dashboard
  • [ ] Configure reward values for user actions
  • [ ] Test user engagement flow
  • [ ] Prepare launch communications

Phase 5: Launch

  • [ ] Complete end-to-end testing
  • [ ] Deploy to production
  • [ ] Monitor initial user engagement
  • [ ] Iterate based on analytics

Platform Architecture Overview

Understanding how FanFest works helps coordinate your team effectively.

Component Overview

┌─────────────────┐
│   Your Website  │  ← Where users interact
└────────┬────────┘

         ├─── FanFest SDK (JavaScript)
         │    ├─── Tracks user events
         │    └─── Shows reward notifications

         ├─── Your SSO Provider (Auth0, etc.)
         │    └─── Authenticates users

         └─── FanFest API
                              ├─── Processes events
                              ├─── Calculates rewards
                              └─── Manages user data

Data Flow

  1. User visits your website - The FanFest SDK loads automatically
  2. User logs in - SDK authenticates with FanFest using your SSO
  3. User interacts - SDK tracks clicks, views, and custom events
  4. Events processed - FanFest API receives and processes events
  5. Rewards delivered - Users earn points, badges, and notifications
  6. Analytics available - View engagement data in your dashboard

Common Questions

How long does integration take?

  • Technical Integration: 2-4 hours for a standard setup
  • Design Assets: 1-2 days depending on asset creation timeline
  • Content Setup: Ongoing, can start with your first show or contest

Do we need to modify our existing authentication?

No. FanFest works alongside your existing SSO provider. Users continue logging in through your normal authentication flow.

Can we test before going live?

Yes! FanFest provides staging environments. Complete your integration in staging, test thoroughly, then deploy to production.

What if we want to track custom events?

The SDK is flexible. You can track any user interaction using data attributes or imperative API calls. See the SDK Introduction for examples.

How do we customize the look and feel?

You can provide custom visual assets (logo, banner, thumbnails) and optionally configure theme tokens. See Design Guidelines for full details.

For Implementation

For Design

For Understanding

Next Steps

  1. Developers: Start with SDK Integration
  2. Designers: Review Design Specifications
  3. Questions: Contact your FanFest account manager

Need Help?

  • Technical Support: Contact your FanFest onboarding representative
  • Dashboard Support: Use the support chat in your FanFest admin dashboard
  • General Questions: Reach out to your account success manager

Released under the MIT License.