Partners / Fan 360 x Komo

Fan 360 x Komo

f360.partners.komo.tech

Deployed

Hub Sections

Each section starts with template content from the universal partner hub. Toggle sections on/off, and customise the content for Fan 360 x Komo where needed. Sections using the template will automatically get updates when the template is improved.

15 of 15 enabled

3 customised for Fan 360 x Komo

12 using template

Homepage

Hero

Partner name, tagline, and Komo logo at the top of the hub homepage.

/hub/f360/

Getting Started

Active

Intro video and welcome message shown at the top of the hub homepage.

/hub/f360/

Fundamentals

1 section

Platform Fundamentals

Template

Core concepts, glossary, and platform overview. The foundation every partner needs.

/hub/f360/fundamentals

Using universal template -- updates automatically with template changes

## Platform Overview

A high-level introduction to the Komo platform -- what it is, what it does, and how the pieces fit together.

### Komo is an Engagement Engine

Komo is a **no-code platform for creating interactive digital experiences**. Brands use it to turn passive audiences into active participants -- capturing zero-party data, driving engagement, and proving ROI across every channel.

It's not a CMS, not an event app, not a survey tool. It's the engagement layer that sits on top of (or alongside) a client's existing tech stack. One platform, one data model, one analytics dashboard -- used across every touchpoint, every event, every campaign.

### Core Capabilities

- **55+ Interactive Card Types** -- Games, polls, quizzes, trivia, surveys, spin-to-win, scratch cards, scavenger hunts, instant-win, and more -- all no-code.
- **Branded Hubs & Sites** -- Fully branded web destinations with custom themes, pages, navigation, and domain support. Campaign-specific or always-on.
- **CRM & Zero-Party Data** -- Built-in contact management with profiles enriched by engagement data -- preferences, quiz answers, form responses, and behavioral signals.
- **Competitions & Prizes** -- Prize management with instant wins, random draws, leaderboards, entry tracking, coupon distribution, and winner management.
- **Loyalty Programs** -- Points-based loyalty systems with earning rules, redemption tiers, and engagement rewards -- all tied to the same data model.
- **Workflow Automation** -- Event-driven automations triggered by form submissions, prize awards, and gameplay. Send HTTP requests, sync to CRMs, send emails and SMS.
- **Embed SDK, API & Webhooks** -- JavaScript embed SDK for web and React Native, REST API for programmatic access, and webhook events for real-time external integrations.
- **Analytics & Reporting** -- Built-in dashboards with engagement rates, data capture volumes, completion rates, time-on-site, and per-sponsor attribution.

### How It Works

The end-to-end flow from creation to results:

1. **Create a Hub** -- Set up a branded Site with custom theme, domain, pages, and navigation. Campaign-specific or always-on.
2. **Add Cards** -- Choose from 55+ interactive card types -- quizzes, polls, games, surveys, competitions -- and configure them with no code.
3. **Distribute** -- Share via direct URL, QR codes, email, social media, or embed directly into websites and apps using the SDK.
4. **Capture Data** -- Every interaction captures zero-party data -- preferences, opinions, contact details -- voluntarily provided by users in exchange for value.
5. **Automate Actions** -- Use workflows to sync data to CRMs, trigger emails and SMS, send webhook notifications, and update external systems in real time.
6. **Analyze Results** -- Review engagement metrics, data capture volumes, completion rates, and ROI attribution in the built-in analytics dashboard.

### Key Differentiators

- **No-code** -- Marketing teams can create, launch, and manage experiences without engineering resources.
- **Enterprise-scale** -- Built for high-traffic events, large audiences, and concurrent usage without performance degradation.
- **SOC 2 Type 1 certified** -- Enterprise-grade security and data handling that passes procurement reviews.
- **Web-based, no app download** -- Users engage directly in the browser. No friction, no app store, no installation. Works instantly.
- **Works on 4G/5G** -- Optimized for mobile networks. Critical for live events, stadiums, and venues where Wi-Fi is unreliable.

---

## Platform Concepts

The mental model you need before reading a single line of API docs. Understand how Komo's pieces fit together, what the terminology means, and how data flows through the system.

### Data Hierarchy

Everything in Komo lives inside a strict hierarchy. Understanding this structure is the key to knowing where data lives and how permissions work.

```
Workspace (org-level container)
├── Site / Hub (branded web destination)
│   ├── Pages (layout sections within the hub)
│   │   └── Cards (interactive content units)
│   ├── Theme & Branding (colors, logos, fonts)
│   └── URL (e.g., brand.komo.site or custom domain)
├── Contacts (user profiles built from engagement)
├── Competitions (prize pools, draws, instant wins)
└── Workflows (event-driven automations)
```

### Workspaces

A **Workspace** is the top-level organizational unit. It represents an account -- typically one per client or one per business unit. All Sites, Contacts, Competitions, and Workflows belong to a Workspace. Team members are invited at the Workspace level and can be assigned roles to control access.

### Sites (Hubs)

A **Site** -- also called a **Hub** -- is a branded web destination where engagement happens. Think of it as a microsite purpose-built for interactive content.

**What a Site has:**

- A URL (subdomain on komo.site or custom domain)
- Pages -- layout containers that hold cards
- Theme -- colors, fonts, logos, background images
- Cards -- the interactive content units
- Navigation and footer configuration

**How Sites are used:**

- Standalone engagement destinations (linked from email, social, QR codes)
- Embedded into existing websites or apps via the Embed SDK
- Event-specific microsites with sponsor branding
- Always-on loyalty or community hubs

### Cards

**Cards** are the building blocks of engagement in Komo. Each card is a self-contained interactive content unit with its own gameplay, data capture, and visual presentation. There are **55+ card types**.

**Card Type Examples:**

- **Gamification:** Trivia, Spin-to-Win, Scratch Cards, Instant Win, Memory Match
- **Data Capture:** Polls & Surveys, Quizzes, Personality Tests, Pick & Compare, Swipe Cards
- **Engagement:** Scavenger Hunts, Countdown Timers, Video Players, Content Reveals, Photo Galleries

Each card can include a **data capture form** (pre or post gameplay) that collects contact details, preferences, and custom fields. Cards can also be linked to Competitions for prize management.

### Contacts

A **Contact** is a user profile automatically built from engagement. When someone fills out a form on a card, their data is captured and stored as a Contact within the Workspace.

**What a Contact contains:**

- **Identity** -- email, name, phone, custom fields
- **Engagement history** -- which cards they interacted with, scores, answers
- **Zero-party data** -- preferences, opinions, and selections willingly given
- **Tags & segments** -- applied manually, by workflows, or by card configuration
- **Competition entries** -- prize draws they're eligible for, prizes won

This is **zero-party data** -- data users voluntarily provide in exchange for the value of the experience. No cookies, no tracking pixels, no third-party inference.

### Competitions

**Competitions** manage everything related to prizes and winning. They're a separate entity from Cards -- a card can be linked to a Competition, but the prize logic lives independently.

**Competition features:**

- Prize pool definition (multiple prizes, quantities)
- Draw logic (random, leaderboard, first-come)
- Instant win configuration
- Scheduled draws with automated winner selection
- Leaderboard tracking with point systems

**Coupon distribution:**

- Upload coupon pools (CSV of unique codes)
- Auto-distribute on win or form submission
- Track redemption status
- Limit per-user distribution

### Workflows

**Workflows** are event-driven automation flows. They follow a **Trigger -> Action** pattern: when something happens in Komo, the workflow executes a sequence of actions.

**Triggers (events):**

- Gameplay.DataCaptured
- Gameplay.Ended
- Prize.Won
- Form.Submitted
- Contact.Created
- Receipt validation events

**Actions:**

- HTTP Request (call any API)
- Send Email / SMS
- Update Contact properties
- Salesforce Get/Update/Create
- Mailchimp Upsert/Tag
- Braze Track User

Workflows also support **conditional logic** (Decision nodes), **delays** (Wait nodes), and **data mapping** to transform payloads between steps.

### Embedding

Komo content doesn't have to live on komo.site. The **Embed SDK** lets you place cards or full hubs into any website or mobile app.

**Embedding capabilities:**

- **Full Hub embed** -- render the entire Site as an iframe in your page
- **Card Cover embed** -- show a card's promotional image/button that opens the card modal
- **Card Trigger embed** -- attach card-open behavior to any HTML element
- **SSO via JWT** -- pass auth tokens so users don't re-authenticate
- **Form prefilling** -- pre-populate form fields from your existing user data
- **Event listening** -- receive events (gameplay, form, prize) in your parent page
- **Extension data** -- pass custom key-value data that flows through to webhooks/workflows

### How Data Flows

This is the core loop. Every Komo deployment follows this same pattern -- only the specifics of the cards, data fields, and downstream systems change.

```
User visits Hub -> Engages with Card -> Data Captured
(web / embed)     (trivia, poll,        (form fields,
                   spin-to-win...)       answers, scores)
                                              |
                                              v
                                      Contact Enriched
                                      (profile updated,
                                       tags applied)
                                              |
                                              v
                                    Workflow Triggered
                                    (automation fires)
                                              |
                              +---------------+----------+
                              v               v          v
                         HTTP Request    CRM Updated   Email
                         (your API)     (Salesforce,   Sent
                                        Mailchimp,
                              v          Braze)
                        Webhook Event
                        (real-time POST
                         to your endpoint)
```

- **Engagement Layer** -- Cards capture attention and data. Users interact willingly because the experience is fun, rewarding, or interesting.
- **Data Layer** -- Contacts, form entries, gameplay results, and competition entries are all stored and queryable within Komo.
- **Integration Layer** -- Workflows, webhooks, and the API push data outward to the systems that need it -- CRMs, CDPs, analytics, and custom backends.

---

## Glossary

Komo-specific terms you'll encounter across the platform, documentation, and client conversations.

**Workspace** -- The top-level organizational unit in Komo. A Workspace contains Sites, Contacts, and shared settings (team members, integrations, billing). Think of it as the account container -- everything a client does lives within their Workspace.

**Site (Hub)** -- A branded web destination for engagement experiences. Each Site has its own URL, pages, cards, and theme. A Workspace can contain multiple Sites -- for example, one per campaign, one per event, or one always-on hub. Also referred to as an Engagement Hub.

**Card** -- An individual interactive content unit. Examples include trivia games, polls, quizzes, spin-to-win, surveys, scratch cards, and instant-win games. Cards live within Sites. Komo offers 55+ card types, each configurable without code.

**Contact** -- A user profile built from engagement data. Contacts are created when users submit forms or interact with cards. Each Contact contains zero-party data, engagement history, tags, and custom properties. Contacts live at the Workspace level and are shared across all Sites.

**Competition** -- The prize management system within Komo. Competitions include draw logic (random draws, instant wins), leaderboards, entry tracking, coupon distribution, and winner management. Competitions are associated with Cards and can span multiple cards or an entire Site.

**Workflow** -- An automated flow triggered by events within Komo. Workflows use triggers (form submission, prize award, gameplay events) and actions (HTTP requests, CRM updates, emails, SMS). They're the primary mechanism for integrating Komo with external systems.

**Zero-Party Data** -- Data that users voluntarily provide through engagement -- preferences, quiz answers, poll votes, form responses, and survey results. Distinct from first-party behavioral data (page views, clicks). Zero-party data is the core value proposition of Komo: users give it willingly in exchange for interactive experiences.

**Engagement Hub** -- A Komo Site configured as an always-on or campaign-specific destination for interactive content. The term emphasizes the Site's role as a central engagement touchpoint -- where audiences go to interact, play, and share data. Functionally identical to a Site, but framed in terms of the use case.

**Card Cover** -- An image or image-plus-button preview of a Card displayed on the Site. When a user clicks the Card Cover, the full card experience opens in a modal overlay. Card Covers are how cards are presented in a grid or list layout on Hub pages.

**Card Trigger** -- Any HTML element configured to open a Card experience when clicked. Used with the Embed SDK to launch specific cards from buttons, links, images, or any interactive element on an external website or app. Triggers allow card experiences to be opened without displaying the full Hub.

**Embed SDK** -- A JavaScript library for embedding Komo cards or entire Hubs into external websites or apps. Available for web (browser) and mobile (React Native). The SDK handles rendering, authentication, event communication, and responsive sizing.

**User Interaction Events** -- Frontend events pushed to tag managers (Google Tag Manager, Adobe Launch) when users interact with cards. Used for analytics tracking, conversion measurement, and retargeting audiences based on engagement behavior.

**Webhook Events** -- Server-side events pushed to configured URLs when actions occur in Komo. Webhook events fire for prizes awarded, forms submitted, coupons claimed, and other significant actions. They're the real-time integration mechanism for connecting Komo to external systems.

**Extension Data** -- Custom key-value data attached to user interaction events for advanced tracking. Extension data is passed from the host page or app into Komo via the Embed SDK, allowing partners to enrich events with context like user IDs, session tokens, campaign identifiers, or attribution parameters.

**Tracked Data** -- Additional behavioral data attached to events for analytics purposes. Tracked data captures contextual information about how users interact with cards -- timing, completion status, answers given, scores achieved -- and is available in analytics exports and webhook payloads.

**Scoping** -- The level at which a Workflow or configuration applies. Workflows can be scoped to a **Workspace** (fires for all Sites), a **Site** (fires for all Cards in that Site), or an individual **Card** (fires only for that Card). Scoping determines the breadth of automation behavior.

Supports Markdown formatting. Switch to Preview to see how it renders.

Sell Komo

8 sections

What is Komo

Customised

Product positioning, value props, and the Komo pitch. Essential for sales conversations.

/hub/f360/sell

Custom content for Fan 360 x Komo

## What is Komo?

How to position Komo to F360's sports and entertainment clients.

**Komo is an Engagement Engine.** It helps rights holders, teams, and event organisers turn high-impact moments into lasting fan engagement, real-time insight, and personalised growth.

### The Problem You're Solving for F360 Clients

Sports organisations and event promoters are stuck with fragmented fan engagement. They use one tool for pre-event polls, another for in-venue activations, a third for post-event surveys -- and none of them talk to each other. Fan data sits in silos. Sponsors get basic logo placements instead of meaningful brand interactions.

### Why This Matters for Sports & Entertainment

- **Always-On Fan Engagement** -- Engage fans year-round, not just on game day. Prediction leagues, trivia, and loyalty programs keep fans connected between events.
- **Speed to Impact** -- Launch a fully branded fan hub in hours, not weeks. No-code tools and AI-powered content creation let your clients react to live moments.
- **Participation-Powered Insight** -- Every interaction captures zero- and first-party data. Know what fans think, prefer, and want -- directly from them.

### F360's Role

As a Komo partner, F360 can offer Komo as part of your fan engagement solutions. Build hubs for clients, manage activations, and deliver sponsor-branded interactive experiences -- all through a single platform.

Supports Markdown formatting. Switch to Preview to see how it renders.

Objection Handling

Customised

12 common objections with detailed rebuttals. Helps partners close deals confidently.

/hub/f360/sell/objections

Custom content for Fan 360 x Komo

## Objection Handling -- Sports & Events Focus

The most common objections F360 will hear when selling Komo to sports and entertainment clients.

### "We want fans to focus on the live experience, not their phones."

Komo doesn't compete with the live experience -- it amplifies it. Live polls during breaks make fans part of the action. Scavenger hunts drive foot traffic to sponsor zones. Prediction games build anticipation before the event even starts. Fans are already on their phones -- the question is whether they're checking Instagram or engaging with your event content.

### "Our team is already stretched thin on event days."

That's exactly why Komo works. The platform is no-code, so all content can be built and scheduled weeks in advance. Everything goes live automatically based on the schedule. As F360, you can handle the entire setup -- build the hub, create the content, configure the schedule, and hand the client a link. Their team's involvement on the day is zero.

### "Sponsors feel digital activations don't provide enough value."

They're right about banners. But Komo isn't banners. It's interactive, sponsor-branded experiences that fans actively choose to engage with. "The [Sponsor] Half-Time Challenge" where 50K fans compete in a live trivia round for 3 minutes, voluntarily sharing their data, is fundamentally different from a banner ad. Sponsors get engagement time, qualified leads, and real analytics.

### "We already have an event app / fan engagement tool."

Great -- Komo embeds directly into it. The embed SDK (web + React Native) drops Komo experiences right inside an existing app with SSO pass-through. This isn't a replacement; it's the engagement layer that makes their existing app more interactive and data-rich.

Supports Markdown formatting. Switch to Preview to see how it renders.

Pain Points by Persona

Template

Pain points mapped to 4 buyer personas. Helps partners tailor their pitch.

/hub/f360/sell/pain-points

Using universal template -- updates automatically with template changes

# Pain Points by Persona

Different buyers care about different problems. Use this page to quickly find the pain points that resonate with the person you're talking to, and how Komo addresses each one.

## CMO / VP Marketing

### Brand Consistency Across Activations

**The pain:** Every campaign uses a different tool with different branding capabilities. The brand experience is fragmented -- different fonts, colors, layouts, and quality levels depending on which team or vendor built it.

**How Komo helps:** One platform with centralized brand controls. Fonts, colors, logos, and templates are set once and enforced across every experience. Whether it's an event activation, a campaign landing page, or a sponsor game -- it all looks and feels like the brand.

### Engagement Metrics That Matter

**The pain:** Impressions and click-through rates don't tell the story of whether people actually engaged with the brand. The CMO needs metrics that show depth of engagement, not just surface-level reach.

**How Komo helps:** Built-in analytics show completion rates, time-in-experience, interactions per user, return visits, and data capture volumes. These are engagement-depth metrics that prove the audience actually participated -- not just scrolled past.

### Data Capture ROI

**The pain:** The marketing team is spending budget on engagement activities but can't prove what data was captured, how it was used, or what revenue it influenced. CFO asks "what did we get for that spend?" and the answer is vague.

**How Komo helps:** Every interaction captures zero-party data. The analytics dashboard shows exactly how many data points were collected, what was captured, and -- via CRM integration -- how those leads progressed. Clear input/output story for budget conversations.

### Campaign Fatigue

**The pain:** The audience is tired of the same email campaigns, banner ads, and social posts. Open rates are declining. Engagement is flat. The marketing team needs a new format that breaks through.

**How Komo helps:** 55+ interactive content types give the team new formats to rotate through -- quizzes, polls, trivia, spin-to-win, predictions, scavenger hunts. Interactive content gets 2-3x the engagement of static content because it asks the audience to do something, not just look at something.

## Head of Events / Event Director

### Attendee Engagement Beyond Sessions

**The pain:** Between keynotes, attendees default to email on their phones. The show floor has pockets of energy but most attendees are passive. Post-event surveys say "it was fine" but nothing stood out.

**How Komo helps:** Gamified challenges, scavenger hunts, and leaderboards give attendees a reason to explore and engage throughout the day. Competition mechanics drive participation. Attendees remember the event because they did something, not just watched something.

### Sponsor Satisfaction & Value

**The pain:** Sponsors pay premium rates but feel like they're getting logo placement and a booth. Renewals are a constant battle. "What did we actually get?" is the question every event director dreads.

**How Komo helps:** Sponsor-branded interactive experiences with individual analytics dashboards. Each sponsor can see exactly how many attendees engaged, how long they spent, what data was captured, and get an export of their leads. Renewal conversations become "here's what you got" instead of "trust us, it worked."

### Operational Complexity

**The pain:** The event team is already managing venue logistics, speakers, catering, A/V, registration, and a dozen other systems. Adding another platform feels like adding another fire to fight.

**How Komo helps:** No-code platform -- the event team (or you, the partner) can build and manage everything without developers. Content can be scheduled in advance and goes live automatically. As a partner, you can offer to handle the entire Komo implementation as a service.

### Hybrid / Virtual Event Challenges

**The pain:** Virtual attendees get a second-class experience -- a stream they watch passively while in-person attendees get the full event. Hybrid events feel like two separate events to manage.

**How Komo helps:** Komo's digital-first approach means the same gamified experiences work for both audiences. Same leaderboard, same competitions, same data capture. Virtual attendees are full participants, not observers.

## Sponsorship Director

### Proving Sponsor ROI

**The pain:** Sponsors want hard numbers -- leads generated, engagement time, data captured. The sponsorship team is stuck with estimates and anecdotal evidence. Renewals rely on relationship, not results.

**How Komo helps:** Per-sponsor analytics dashboards with impressions, interactions, completion rates, data captures, and lead exports. Post-event reports are auto-generated. The ROI story writes itself.

### Limited Sponsorship Inventory

**The pain:** Physical sponsorship inventory is finite -- only so many booths, signage spots, and lanyards to sell. Digital inventory is limited to banner ads and email mentions. The sponsorship team needs new packages to sell.

**How Komo helps:** Creates entirely new digital sponsorship inventory: branded trivia games, sponsor challenges, digital exhibitor hubs, branded leaderboard sections, and sponsored scavenger hunt checkpoints. Each is a sellable package with measurable value.

### Digital-Only Sponsorship Packages

**The pain:** Some sponsors want digital presence only -- they can't or won't invest in a physical booth. Current digital packages (logo on website, email blast) feel low-value.

**How Komo helps:** Digital-only sponsors get their own branded experiences, games, and data capture -- accessible from anywhere. It's a premium digital package that feels valuable because it's interactive and measurable, not just a logo.

### Lead Quality

**The pain:** Badge scans and booth visits produce lead lists, but they're often junk -- people who walked by for swag, not genuine prospects. Sponsors complain that event leads don't convert.

**How Komo helps:** Komo captures intent-rich data. Someone who completes a quiz about a sponsor's product and answers preference questions is a higher-quality lead than a badge scan. The data shows what they know, what they're interested in, and how engaged they were.

## Digital Product Lead

### Integration Complexity

**The pain:** Every new vendor means another integration project. APIs are poorly documented, support is slow, and the integration breaks every time they push an update. The tech team is skeptical of "no-code" platforms.

**How Komo helps:** Well-documented REST API, webhook system, embed SDK (web and React Native), and a workflow builder for non-technical integrations. Multiple integration paths depending on the team's technical capability and timeline.

### SSO & Authentication

**The pain:** Users hate creating another account. The product team requires SSO for any embedded third-party tool. If Komo can't authenticate against their identity provider, it's a non-starter.

**How Komo helps:** Komo supports SSO via JWT token-based authentication. Users authenticate in the host app and pass through to Komo seamlessly -- no separate login, no account creation, no friction.

### Embed Reliability & Performance

**The pain:** Embedded third-party tools that slow down the page, break on mobile, or create janky transitions are a non-starter. The product team owns the user experience and won't tolerate quality regressions.

**How Komo helps:** The embed SDK is lightweight and loads asynchronously. It handles responsive sizing, theme matching, and communication between the host app and Komo content. Built for production embedding, not just a demo iframe.

### Data Compliance

**The pain:** The legal and security teams need to know where data is stored, how it's processed, who has access, and whether the platform meets GDPR / privacy requirements. No compliance review = no deal.

**How Komo helps:** Komo provides data processing agreements, has configurable consent management, and supports data export and deletion. Zero-party data collection is inherently consent-based -- users actively choose to provide their information.

### Fitting Into the Existing Tech Stack

**The pain:** The organization already has a CRM, an event app, an email platform, and analytics tools. They don't want to replace any of them. They need Komo to fit in, not take over.

**How Komo helps:** Komo is designed to be the engagement layer, not the whole stack. CRM integrations push data to Salesforce, HubSpot, etc. Webhooks fire to any endpoint. The embed SDK lets Komo live inside the existing app. It adds capabilities without replacing existing tools.

Supports Markdown formatting. Switch to Preview to see how it renders.

Competitive Positioning

Template

How Komo compares to alternatives. Category-level positioning, not head-to-head.

/hub/f360/sell/competitive

Using universal template -- updates automatically with template changes

# Competitive Positioning

What makes Komo different from the tools prospects will compare it to -- and how to frame those conversations.

## Komo's Three Differentiators

### Richer Content

55+ interactive content card types -- and the library keeps growing. This isn't polls and surveys. It's immersive gameplay: trivia with timed rounds, spin-to-win, scavenger hunts, prediction games, personality quizzes, instant-win mechanics, and more.

> **In conversation:** "How many interactive content types does your current tool offer? Komo has 55+ and adds new ones regularly. That means you never run the same activation twice -- every event, every campaign feels fresh."

### Deeper Engagement

Komo creates **destination hubs**, not disposable microsites. Leaderboards, loyalty points, badges, user profiles, and persistent progress turn a single interaction into an ongoing engagement relationship. Attendees come back because there's always something new and their status carries over.

> **In conversation:** "Does your current solution give attendees a reason to come back after the first interaction? Komo's leaderboards and loyalty mechanics create ongoing competition and engagement -- not just a one-and-done poll."

### Complete Integration

Komo is built to live inside the client's existing ecosystem, not alongside it. CRM integrations (Salesforce, HubSpot, etc.), a visual workflow builder, REST API, JWT-based SSO, embed SDK for web and React Native, webhooks, and omnichannel distribution (web, mobile, QR, email, social).

> **In conversation:** "Can your current tool embed natively in your event app with SSO? Can it push lead data to your CRM in real-time via webhooks? Komo isn't a standalone tool -- it's a platform designed to integrate."

## Common Competitor Categories

You won't usually compete against a single named tool. Instead, prospects compare Komo to a *category* of tools they've used before. Here's how to frame each comparison.

### Basic Poll & Q&A Tools

**Examples:** Slido, Mentimeter, Poll Everywhere, Pigeonhole

**What they do well:** Live session interaction -- polls, Q&A, word clouds. Simple, focused, and often already bundled with video conferencing tools.

**Where Komo is different:**

- Polls and Q&A are 2 of 55+ content types -- Komo does everything they do plus gamification, scavenger hunts, loyalty, and more
- Poll tools are session-scoped; Komo is event-scoped with persistent hubs, leaderboards, and profiles
- No sponsor branding, no per-sponsor analytics, no lead capture in basic poll tools
- Komo doesn't replace the poll tool -- it adds the engagement layer on top

### Event Apps with Built-In Engagement

**Examples:** Swapcard, Grip, Brella, Bizzabo, RainFocus (engagement modules)

**What they do well:** Agenda management, networking, registration, and logistics. Some offer basic engagement features (polls, surveys, simple gamification) as add-on modules.

**Where Komo is different:**

- Event app engagement features are an afterthought -- Komo's entire platform is purpose-built for interactive engagement
- Komo embeds inside event apps via SDK -- it's additive, not competitive. The event app handles logistics; Komo handles engagement
- Depth of content variety is incomparable -- 55+ card types vs. basic polls and a leaderboard
- Sponsor-branded experiences with individual analytics aren't available in event app engagement modules

### Generic Gamification Platforms

**Examples:** Qualifio, Brame, Drimify, BeeLiked

**What they do well:** Campaign-level gamification -- individual games and contests that can be embedded on websites or shared via links.

**Where Komo is different:**

- Komo is a hub-based system -- multiple experiences in a single destination with leaderboards, profiles, and loyalty that connect them
- Generic gamification tools create standalone games; Komo creates interconnected engagement ecosystems
- Workflow builder, webhooks, API, and SSO make Komo an integration-grade platform, not just a content creation tool
- Multi-sponsor support with individual analytics and branding isn't available on campaign-focused gamification tools

## The Key Framing

Komo isn't a poll tool, an event app, or a gamification widget. It's an **Engagement Engine** -- a platform-level system that creates interactive experiences, captures zero-party data, and proves ROI across any channel. It works alongside existing tools (embeds into event apps, pushes data to CRMs, authenticates via SSO) rather than replacing them.

The closest comparison isn't another tool in the stack -- it's the **engagement layer** that the stack has been missing.

Supports Markdown formatting. Switch to Preview to see how it renders.

Trust & Security

Template

Compliance certs, security posture, data handling, sub-processors. For procurement conversations.

/hub/f360/sell/trust

Using universal template -- updates automatically with template changes

# Trust & Security

Everything you need to answer security, compliance, and data privacy questions from prospects. Use this page to build confidence during the sales process.

> **Komo Trust Center** -- Share this link with prospects who need security documentation, compliance certificates, and policy details: [komo.trust.site](https://komo.trust.site/)

## Compliance Certifications

- **SOC 2 Type 1** -- Compliant
- **ISO 27001** -- Compliant
- **GDPR** -- Compliant
- **UK GDPR** -- Compliant

## Trusted By

Komo is trusted by enterprise brands across media, insurance, real estate, sport, and entertainment.

Foxtel, QBE, iHeart Media, JLL, ReedPop, NRL

## Security Posture

- Data encrypted in transit (**TLS 1.3**) and at rest
- Hosted on **Google Cloud Platform (GKE)** with Cloudflare CDN/DDoS protection
- **3 availability zones** for redundancy
- Regular **external penetration testing**
- Continuous vulnerability scanning of Docker containers
- Code reviews before all changes
- Security keys automatically rotated
- VPN-protected infrastructure -- only web traffic ports exposed
- **12 Factor Application** principles
- **99.97% uptime** over the last 12 months

## Data Ownership & Privacy

### You Own Your Data

**Komo does not claim rights to customer data.** You own all data collected through the platform. Komo acts as a data processor, not a data controller.

### You Control Data Collection

You decide what data Komo collects via fully customizable forms. Only the fields you configure are captured -- nothing more.

### Access & Sharing

- Komo support staff can access data **only to provide support**
- Data shared only with trusted third parties required for service delivery

### Sub-processors

- **Google** -- Hosting
- **Cloudflare** -- CDN & Security
- **Datadog** -- Monitoring
- **Twilio** -- SMS
- **ActiveCampaign** -- Email
- **Postmark** -- Email

### Regulatory Compliance

- **GDPR** and **CCPA** compliant
- Cookie consent integration (**OneTrust** supported)
- Happy to sign **Data Processing Agreements (DPA)** -- contact [security@komo.tech](mailto:security@komo.tech)

## Policies

- [Privacy Policy (Australia)](https://www.komo.tech/privacy-policy)
- [Privacy Policy (United States)](https://www.komo.tech/us/privacy-policy)
- [Terms of Service (Australia)](https://www.komo.tech/terms-of-service)
- [Terms of Service (United States)](https://www.komo.tech/us/terms-of-service)
- [Trust Center](https://komo.trust.site/) -- Full security documentation, certifications, and compliance details

Supports Markdown formatting. Switch to Preview to see how it renders.

Live Examples

Template

Working demo hubs that partners can show to prospects. Interactive iframe previews.

/hub/f360/sell/examples

Using universal template -- updates automatically with template changes

## Live Examples

Working demo hubs you can show to prospects. Each demonstrates different use cases, card types, and engagement patterns.

### Demo Hubs

- **Nexero Summit 2025** -- A conference engagement hub with trivia, polls, scavenger hunts, and sponsor activations. Shows the full event experience.
- **Sports Fan Zone** -- A sports-themed hub with predictions, leaderboards, and prize draws. Demonstrates always-on engagement.
- **Brand Campaign** -- A CPG-style campaign hub with instant-win, personality quizzes, and data capture. Shows the marketing use case.

### Embed Demos

These demos also showcase Komo's embed SDK -- card covers and card triggers rendered inline, opening full experiences in modals. This is exactly how Komo would appear when embedded in a partner's platform or client's website.

> **Tip:** When showing these to a prospect, focus on the experience first (play through a card), then explain the data capture and analytics that happen behind the scenes.

Supports Markdown formatting. Switch to Preview to see how it renders.

Assets & Templates

Template

Downloadable collateral: one-pagers, decks, proposal templates.

/hub/f360/sell/assets

Using universal template -- updates automatically with template changes

## Assets & Templates

Downloadable collateral for sales conversations, proposals, and client presentations.

### Available Assets

- **Komo One-Pager** -- Single-page overview of the platform. Good for initial introductions and leave-behinds.
- **Core Modules Brochure** -- Detailed breakdown of each Komo module with screenshots and feature lists.
- **Engage Modules Brochure** -- Deep dive into interactive content types, loyalty, and rewards.
- **Technical Overview** -- Architecture, security, and integration documentation for technical stakeholders.
- **Brand Guidelines** -- Komo brand assets, logo usage, color palette for co-branded materials.

### Proposal Templates

- **Standard Proposal Template** -- Customizable proposal structure for common Komo deals.
- **Enterprise RFP Response** -- Pre-filled responses for common enterprise procurement questions.

> **Note:** Additional partner-specific collateral may be available in the Assets section of this hub.

Supports Markdown formatting. Switch to Preview to see how it renders.

Case Studies

Template

Real customer results with stats. Organized by industry vertical.

/hub/f360/sell/case-studies

Using universal template -- updates automatically with template changes

## Case Studies

Real customer results with stats. Use these in proposals, pitch decks, and conversations to demonstrate proven outcomes.

### How to Use Case Studies

- **Match the vertical** -- Lead with case studies from the prospect's industry.
- **Lead with the metric** -- Start with the result ("280K+ engagements"), then explain the context.
- **Connect to their pain** -- Frame each case study in terms of the problem it solved, not just what was built.

### Featured Results

Case studies are organized by industry. Each includes the customer name, the engagement type, key metrics, and a summary of what was built and why it worked.

> **Tip:** When a prospect says "do you have experience in [industry]?", this is where you go. Even if the exact vertical isn't represented, adjacent case studies often resonate -- sports and festivals share similar engagement patterns, for example.

Supports Markdown formatting. Switch to Preview to see how it renders.

Build with Komo

6 sections

Technical Overview

Template

Architecture, infrastructure, monitoring, and security. For technical evaluations.

/hub/f360/build/technical-overview

Using universal template -- updates automatically with template changes

## Technical Overview

A partner-facing summary of Komo's technical architecture, infrastructure, and security posture.

### Technology Stack

| Layer | Technology |
|---|---|
| Backend | .NET Core (C#) APIs |
| Frontend | Next.js / React |
| Databases | PostgreSQL, BigQuery, Redis |
| Infrastructure | Google Cloud Platform (GKE / Kubernetes) |
| CDN & Security | Cloudflare (global CDN, DDoS, WAF, bot protection) |
| Monitoring | Datadog (APM, RUM, logs, security) |
| Containers | Docker on Alpine / Debian Linux |
| CI/CD | GitHub |
| Networking | NGINX, HTTP/2, QUIC (HTTP/3) |

### High Availability Architecture

Komo is architected for zero-downtime operation, even during data center failures.

- **3 availability zones** for redundancy -- can lose an entire data center and remain operational
- **Google Global Load Balancers** with 1M+ queries/sec capacity
- **VPN-protected infrastructure** -- only web traffic ports exposed
- **Google Premium network tier** for highest priority traffic routing
- **Kubernetes** for auto-scaling and fault-tolerant container hosting
- **Region:** Oregon, United States (us-west1) -- Low Carbon

### Built to Scale

- **Burst Capacity** -- Additional capacity is always available for traffic spikes, giving autoscaling time to kick in before any degradation.
- **Autoscaling at All Levels** -- Infrastructure scales dynamically as CPU, memory, and request counts increase.
- **Caching Everywhere** -- HTTP caching + Google CDN (#1 fastest globally) + Redis HA cluster for in-memory caching.
- **Highly Available Database** -- PostgreSQL HA with automatic failover and sufficient RAM for in-memory query serving.

### 24/7 Monitoring

Comprehensive, multi-layered monitoring ensures issues are detected and addressed before they impact users.

- **Service Health Checks** -- Every 10 seconds
- **Application Monitoring** -- Every 2 minutes from multiple locations
- **Synthetic User Tests** -- Every 10 minutes
- **Real User Monitoring (RUM)** -- With session replay
- **Kubernetes Monitoring** -- Servers, nodes, containers
- **Application Performance Monitoring (APM)** -- With latency tracing
- **Database Monitoring** -- Queries, latency, volumes
- **Security & Threat Monitoring** -- Real-time alerts

### Uptime & Performance

- **99.97%** uptime over the last 12 months
- **Real-time** anomaly detection (error rates, throughput, latency, APDEX)

### Enterprise Grade Security

Komo meets the rigorous security standards demanded by enterprise partners.

- External security audits completed by **News Corp, Foxtel, ECU, JLL**
- Adheres to **12 Factor Application** principles
- **Code reviews** before all changes
- Data encrypted **in transit (TLS 1.3)** and **at rest**
- Regular **external penetration testing**
- **Continuous vulnerability scanning**
- Security keys **automatically rotated**
- **Firewall protection** via VPN
- **Automatic SSL provisioning** for white-label domains -- just add a CNAME

For the full security and compliance details, visit the Komo Trust Center at https://komo.trust.site/

Supports Markdown formatting. Switch to Preview to see how it renders.

Quickstart Guide

Template

Get up and running in minutes. Tabbed guide for Web, React Native, and iframe.

/hub/f360/build/quickstart

Using universal template -- updates automatically with template changes

## Quickstart

Get Komo running in your environment. Pick your platform below -- each guide gets you from zero to a working integration.

### Prerequisites (all platforms)

- A Komo Workspace with at least one Site (Hub) created
- Access to portal.komo.digital
- Your Hub URL (e.g. `my-awesome-hub.komo.site`)
- At least one Card ID -- find this in the Komo Portal under card settings

---

### Web (Browser)

#### 1. Add the Embed Script

Paste this bootstrapper into your HTML. Replace `KOMO_HUB_URL` with your Hub domain (e.g. `my-awesome-hub.komo.site`).

```html
<script>
  (function (n, r, t, c, u, e, f) {
    n[u] =
      n[u] ||
      (function (q) {
        return new Proxy(q, {
          get(y, s) {
            return s === 'q'
              ? y[s] || []
              : function (...B) {
                  (n[u].q = n[u].q || []).push([s, ...B]);
                };
          }
        });
      })({});
    e = r.createElement(t);
    f = r.getElementsByTagName(t)[0];
    e.async = 1;
    e.src = c;
    f.parentNode.insertBefore(e, f);
  })(
    window,
    document,
    'script',
    'https://KOMO_HUB_URL/assets/embed/embed.js',
    'komoEmbed'
  );
</script>
```

This creates a `komoEmbed` global. Calls are queued until the script loads, so you can use it immediately.

#### 2. Embed a Card Cover

Renders the card's cover image inline. Clicking opens the full experience in a modal.

```html
<div
  data-komo-embed-card-cover
  data-komo-embed='{"cardId":"CARD_ID","styles":{"embedStyle":"ImageButton","embedWidth":"unset"}}'
></div>
```

#### 3. Or Use a Card Trigger

Turn any element into a card opener -- no visual changes, just behavior.

```html
<button data-komo-embed-card-trigger="CARD_ID">
  Play the Trivia Challenge!
</button>
```

#### 4. Listen for Events

React to user interactions -- form submissions, gameplay, prizes.

```javascript
const unsubscribe = komoEmbed.listenToKomoEvents(
  function(event) {
    // event: { eventName: string, eventData: any }
    console.log(event.eventName, event.eventData);
  }
);
```

#### 5. Prefill Forms (Optional)

If you know the user's details, prefill so they don't re-enter them.

```javascript
komoEmbed.setFormPrefillValues({
  first_name: 'Jane',
  last_name: 'Smith',
  email: 'jane@example.com'
});
```

Full reference: Web Embed SDK docs -- covers programmatic API, query parameters, authentication, extension data, and more.

---

### React Native

#### 1. Install the Package

Add the Komo React Native widgets package and its peer dependency.

```
npm install @komo-tech/react-native-widgets react-native-webview
```

Requires `react-native-webview` v13.x as a peer dependency. Package: @komo-tech/react-native-widgets on npm.

#### 2. Get Your Card Embed Meta URL

In the Komo Portal, open your card's settings, select the **Embed** tab, click **React Native code** in the sidebar, and copy the `Card embed meta URL`. This URL is the only required prop.

#### 3. Embed a Card

The `KomoCardWidget` component handles everything -- metadata fetching, card cover display, and modal for the card experience. One component, one prop.

```jsx
import { KomoCardWidget } from '@komo-tech/react-native-widgets';

function EngagementScreen() {
  return (
    <KomoCardWidget
      embedMetaUrl="YOUR_CARD_EMBED_META_URL"
      containerStyle={{ maxWidth: '80%' }}
    />
  );
}
```

The widget fetches the card cover image, renders it, and opens a modal with the full experience when tapped. Everything below is optional.

#### 4. Prefill Forms and Listen for Events

Pass user data to prefill forms, and listen for events (gameplay, form submissions, prizes) via callback props.

```jsx
<KomoCardWidget
  embedMetaUrl="YOUR_CARD_EMBED_META_URL"
  formPrefillValues={{
    email: 'jane@example.com',
    first_name: 'Jane',
    last_name: 'Smith'
  }}
  onKomoEvent={(event) => {
    // event: { eventName, eventData, extensionData }
    console.log('Komo event:', event.eventName, event.eventData);
  }}
  extensionDataValues={{
    custom_user_id: 'usr_12345',
    source: 'mobile-app'
  }}
/>
```

#### 5. Authentication (Optional)

For Auth0 SSO, pass a fresh session transfer token. The user authenticates via Auth0 before seeing the Komo experience. The token has a 60-second lifespan -- generate it immediately before opening.

```jsx
<KomoCardWidget
  embedMetaUrl="YOUR_CARD_EMBED_META_URL"
  authPassthroughParams={new URLSearchParams({
    session_transfer_token: freshToken
  })}
/>
```

#### Advanced: Individual Components

`KomoCardWidget` is the all-in-one solution. For more control, use the individual building blocks:

- **useFetchCardMetadata** -- Hook to fetch card metadata (cover image URL, embed URL, button style). Use your own data-fetching if needed.
- **CardCover** -- Renders the card's cover image with loading/error states and a CTA button. Requires onClick and isLoading props.
- **ExperienceModal** -- Full-screen modal that loads the card experience. Requires isOpen, onClose, and embedUrl. Supports auth, events, prefill.

**Capabilities:**

- Card cover + experience modal (KomoCardWidget)
- Individual components (CardCover, ExperienceModal)
- Auth0 session transfer (SSO)
- Form prefilling
- Event listening (onKomoEvent)
- Extension data
- Query parameters (UTM tracking)

**Not using React Native?** For native iOS/Android apps without React Native, embed Komo inside a native WebView and use the browser embed SDK. The same setup script and data attributes work identically inside a WebView context.

Full reference: React Native Embed docs -- npm: @komo-tech/react-native-widgets -- developer docs: developers.komo.tech/embedding/react-native

---

### Hub iframe

#### 1. Get Your Hub URL

Every Komo Site has a hosted URL. Find it in the Komo Portal under your Site settings.

```
https://my-awesome-hub.komo.site
```

#### 2. Embed with an iframe

The simplest integration -- drop an iframe into any page. The user gets the full hub experience (all pages, cards, navigation, branding) without leaving your site.

```html
<iframe
  src="https://my-awesome-hub.komo.site"
  width="100%"
  height="800"
  frameborder="0"
  allow="clipboard-write"
  style="border: none; border-radius: 8px;"
></iframe>
```

#### 3. That's It

No SDK, no scripts, no configuration. The iframe loads the full Komo hub as-is. Branding, navigation, cards, competitions -- everything is managed in the Komo Portal.

**Best for:**

- Standalone engagement destinations
- Event apps embedding a full engagement hub
- Quick launches -- zero dev work
- When Komo manages the entire UI

**When to use the SDK instead:**

- You want individual cards in your existing page
- You need event listening or form prefilling
- You need SSO/authentication
- You want programmatic control

---

### Next Steps

You've got a working integration. Go deeper:

- **Embedding Options** -- Covers, triggers, programmatic API -- all the ways to embed Komo content.
- **SSO Setup** -- Authenticate users so they don't see a Komo login screen.
- **CRM & API Integration** -- Push data to Salesforce, Mailchimp, Braze, or any REST API via workflows.
- **Workflow Patterns** -- Automate follow-ups, lead routing, loyalty points, and more.

Supports Markdown formatting. Switch to Preview to see how it renders.

Embed SDK Docs

Template

Full reference for embedding Komo via web SDK and React Native SDK.

/hub/f360/build/embed

Using universal template -- updates automatically with template changes

## Embedding Komo

Komo content can live on its own domain or be embedded directly into your website or app. Choose the embedding approach that fits your use case.

### Embedding Options

#### Full Hub Embed

Renders the entire Komo Site (all pages, cards, navigation, and branding) as an embedded iframe within your page. The user gets the full hub experience without leaving your site.

**How it works:** Link directly to your hub URL or embed it in an iframe. The hub is a fully hosted web destination -- no SDK needed.

```html
<iframe
  src="https://your-hub.komo.site"
  width="100%"
  height="800"
  frameborder="0"
  allow="clipboard-write"
></iframe>
```

**When to use:**

- Standalone engagement destination within your app
- Branded microsite embedded in an event platform
- Full-page engagement experiences
- When you want Komo to manage the entire UI

**Considerations:**

- Takes up significant page real estate
- Branding is controlled in the Komo Portal
- Navigation is Komo's, not yours

#### Card Cover Embed

Renders a card's cover image and play button inline in your page. When clicked, the full card experience opens in a modal overlay. The cover image is configured in the Komo Portal.

**How it works:** Add a `<div>` with two data attributes: a marker attribute and a JSON config. The SDK replaces it with the card's cover image.

```html
<div
  data-komo-embed-card-cover
  data-komo-embed='{
    "cardId": "CARD_ID",
    "styles": {
      "embedStyle": "ImageButton",
      "embedWidth": "unset"
    }
  }'
></div>
```

**When to use:**

- Promotional placements in hero sections or sidebars
- Showing a visual preview of the experience
- Email-like layouts with clickable content blocks
- When the card's cover image adds value

**Considerations:**

- Requires space for the cover image
- Cover design is managed in Komo Portal
- Best when visuals drive engagement

#### Card Trigger Embed

Attaches card-opening behavior to any existing HTML element. No visual changes -- when the element is clicked, the card opens in a modal. You control the look; Komo provides the behavior.

**How it works:** Add `data-komo-embed-card-trigger` with the card ID to any HTML element. The SDK adds a click handler automatically.

```html
<button data-komo-embed-card-trigger="CARD_ID">
  Play the Trivia Challenge!
</button>

<!-- Works on any element -->
<a href="#" data-komo-embed-card-trigger="CARD_ID">
  Take the Quiz
</a>

<div data-komo-embed-card-trigger="CARD_ID">
  <img src="my-promo.jpg" alt="Play to win" />
</div>
```

**When to use:**

- Inline CTAs in your existing content
- Buttons in navigation or menus
- Custom-designed card previews
- When you want full control over the visual presentation

**Considerations:**

- No visual preview of the card unless you build one
- Users need clear indication something will happen on click

#### Programmatic API

Use JavaScript calls to open, close, and manage card experiences dynamically. Ideal for SPA frameworks (React, Vue, Angular) and dynamic content where you need full programmatic control.

**How it works:** Call methods on the `komoEmbed` global. You can register triggers by CSS selector, open/close experiences, and control visibility.

```javascript
// Register any element as a trigger via CSS selector
komoEmbed.registerCardTrigger('CARD_ID', '#my-button');

// Open a card experience directly
komoEmbed.openExperience({ type: 'card', id: 'CARD_ID' });

// Close, hide, or unhide the modal
komoEmbed.closeExperience();
komoEmbed.hideExperience();    // hides but preserves state
komoEmbed.unhideExperience();  // shows it again
```

**When to use:**

- Single Page Applications (React, Vue, Angular)
- Dynamic content where cards are loaded conditionally
- Complex interactions (open card after form submit, etc.)
- When data attributes don't fit your framework

**Considerations:**

- Requires JavaScript -- won't work with JS disabled
- More code to write and maintain

---

## Web (Browser) Embed

Complete reference for embedding Komo into any website. Covers the setup script, data attributes, programmatic API, event listening, form prefilling, extension data, query parameters, and authentication.

### Setup Script

Add this script to every page where you want Komo embeds. It creates the `komoEmbed` global with a proxy-based command queue, then asynchronously loads the full SDK.

```html
<script>
  (function (n, r, t, c, u, e, f) {
    n[u] =
      n[u] ||
      (function (q) {
        return new Proxy(q, {
          get(y, s) {
            return s === 'q'
              ? y[s] || []
              : function (...B) {
                  (n[u].q = n[u].q || []).push([s, ...B]);
                };
          }
        });
      })({});
    e = r.createElement(t);
    f = r.getElementsByTagName(t)[0];
    e.async = 1;
    e.src = c;
    f.parentNode.insertBefore(e, f);
  })(
    window,
    document,
    'script',
    'https://KOMO_HUB_URL/assets/embed/embed.js',
    'komoEmbed'
  );
</script>
```

Replace `KOMO_HUB_URL` with your Hub URL (e.g., `https://yourbrand.komo.site`). The script is loaded asynchronously and won't block page rendering. Thanks to the proxy-based queue, you can call `komoEmbed` methods immediately -- they'll be replayed once the SDK finishes loading.

**Important:** All `komoEmbed` calls must appear **below** the setup script in your HTML. The setup script creates the global proxy that queues commands -- calling `komoEmbed` before it runs will result in a `ReferenceError`.

### Card Covers

Render a card's cover image inline. Clicking it opens the full card experience in a modal. Uses two data attributes: `data-komo-embed-card-cover` (marker, no value) and `data-komo-embed` (JSON configuration).

```html
<div
  data-komo-embed-card-cover
  data-komo-embed='{"cardId":"CARD_ID","styles":{"embedStyle":"ImageButton","embedWidth":"unset"}}'
></div>
```

The `data-komo-embed-card-cover` attribute is a boolean marker (no value). The `data-komo-embed` attribute takes a JSON string with the card ID and optional style overrides. The SDK fetches the card's cover image and renders it within the `<div>`.

**Style Options:**

- `embedStyle` -- e.g., `"ImageButton"`
- `embedWidth` -- e.g., `"unset"`, `"500px"`, `"100%"`

### Card Triggers

Turn any HTML element into a card trigger. Clicking the element opens the card in a modal.

```html
<button data-komo-embed-card-trigger="CARD_ID">Show me Komo!</button>

<a data-komo-embed-card-trigger="CARD_ID" href="#">
  Take the Quiz
</a>

<div data-komo-embed-card-trigger="CARD_ID" class="my-custom-card">
  <img src="my-promo.jpg" alt="Play to win" />
</div>
```

The trigger doesn't change the element's appearance -- it only adds click behavior. You have full control over the visual design.

### Programmatic API

For dynamic scenarios where data attributes aren't practical (SPAs, conditional rendering), use the JavaScript API directly.

**registerCardTrigger(cardId, selector)** -- Programmatically register a DOM element as a card trigger. The first argument is the card ID, the second is a CSS selector string (not an element reference).

```javascript
komoEmbed.registerCardTrigger('CARD_ID', '#my-button');
```

**openExperience(config)** -- Open a card experience modal programmatically. Takes a configuration object, not a string.

```javascript
komoEmbed.openExperience({ type: 'card', id: 'CARD_ID' });
```

**closeExperience()** -- Close the currently open card experience.

```javascript
komoEmbed.closeExperience();
```

**hideExperience()** -- Hide the modal without closing it. The experience state is preserved -- the user can resume where they left off.

```javascript
komoEmbed.hideExperience();
```

**unhideExperience()** -- Show a previously hidden experience modal.

```javascript
komoEmbed.unhideExperience();
```

### Event Listening

Receive events from the embedded Komo experience. Use these to trigger actions in your parent page -- analytics, UI updates, navigation, etc. All `listenTo*` methods return an **unsubscribe function** you can call to stop listening.

**listenToKomoEvents(callback)** (Recommended) -- Listen to structured Komo events. The callback receives an object with `eventName` and `eventData` properties.

```javascript
const unsubscribe = komoEmbed.listenToKomoEvents((event) => {
  console.log('Komo event received:', event);
  // event has structure: { eventName: string, eventData: any }
});

// To stop listening:
unsubscribe();
```

**listenToAuthTokenProcessed(callback)** -- Listen for authentication token processing results.

```javascript
const unsubscribe = komoEmbed.listenToAuthTokenProcessed(
  ({ success, errorMessage }) => {
    if (success) {
      console.log('Authentication completed');
    } else {
      console.error('Authentication failed', errorMessage);
    }
  }
);

// To stop listening:
unsubscribe();
```

**listenToWindowMessageEvents(callback)** -- Listen to raw window postMessage events from the Komo iframe. Lower-level than Komo events -- use when you need access to the raw message payload.

```javascript
const unsubscribe = komoEmbed.listenToWindowMessageEvents((payload) => {
  console.log('Window message received:', payload);
});

// To stop listening:
unsubscribe();
```

### Form Prefilling

Pre-populate form fields so users don't re-enter data you already have. You can call these methods at any time -- they also work via URL query parameters on the host page.

**setFormPrefillValue(key, value)** -- Set a single form field value.

```javascript
komoEmbed.setFormPrefillValue('email', 'user@example.com');
```

**setFormPrefillValues(values)** -- Set multiple form field values at once.

```javascript
komoEmbed.setFormPrefillValues({
  first_name: 'John',
  last_name: 'Doe',
  email: 'john.doe@example.com'
});
```

**Important:** Field keys must match the form field identifiers configured in the Komo Portal. Check the card's form settings to find the correct keys. Form prefill values can also be passed via URL query parameters on the host page.

### Extension Data

Attach custom key-value data to the embed session. Extension data flows through to webhooks and workflow payloads, letting you correlate Komo events with your own system data (user IDs, session tokens, campaign codes, etc.). Values can be strings or objects. Also works via URL query parameters.

**setExtensionDataValue(key, value)**

```javascript
komoEmbed.setExtensionDataValue('custom_unique_id', 'ABC123');

// Values can also be objects
komoEmbed.setExtensionDataValue('custom_object', {
  some_id: 'ABC123',
  some_measure: 123456
});
```

**setExtensionDataValues(values)**

```javascript
komoEmbed.setExtensionDataValues({
  custom_unique_id: 'ABC123',
  custom_object: { some_id: 'ABC123', some_measure: 123456 }
});
```

**Tip:** Extension data is included in webhook payloads and workflow context. Use it to tag entries with your own identifiers so you can join data across systems.

### Query Parameters

Pass query parameters to the Komo embed using three methods. Parameters follow this precedence: **Forwarded params < Global params < Card-specific params**.

#### 1. Inline Configuration

Add a `queryParams` object to the `data-komo-embed` JSON attribute on card covers or triggers:

```html
<!-- On a card cover -->
<div
  data-komo-embed-card-cover
  data-komo-embed='{"cardId":"CARD_ID","styles":{"embedStyle":"ImageButton","embedWidth":"500px"},"queryParams":{"utm_source":"website","utm_medium":"embed"}}'
></div>

<!-- On a card trigger -->
<button
  data-komo-embed-card-trigger="CARD_ID"
  data-komo-embed='{"queryParams":{"utm_source":"newsletter"}}'
>Click</button>
```

#### 2. Programmatic API

Set parameters via JavaScript. You can set global parameters or card-specific ones:

```javascript
// Global (applies to all embeds)
komoEmbed.setQueryParam('utm_source', 'homepage');
komoEmbed.setQueryParams({ utm_medium: 'banner', utm_campaign: 'summer-2024' });

// Card-specific (third argument is the card ID)
komoEmbed.setQueryParam('utm_content', 'variant-a', 'your-card-id');
komoEmbed.setQueryParams({ utm_term: 'keyword' }, 'your-card-id');

// With registerCardTrigger
komoEmbed.registerCardTrigger('your-card-id', '.my-trigger', {
  queryParams: { utm_source: 'sidebar' }
});

// With openExperience
komoEmbed.openExperience({
  type: 'card',
  id: 'your-card-id',
  options: { queryParams: { utm_source: 'modal' } }
});
```

#### 3. Query Parameter Forwarding

Automatically forward the host page's query parameters to the Komo embed by setting `forwardQueryParams` to `true`:

```html
<div
  data-komo-embed-card-cover
  data-komo-embed='{"cardId":"CARD_ID","styles":{"embedStyle":"ImageButton"},"forwardQueryParams":true}'
></div>
```

This is useful for passing UTM parameters, campaign tracking codes, or referrer information from your page URL through to Komo analytics and webhook payloads.

**Precedence:** Forwarded params are overridden by global params, which are overridden by card-specific params. This lets you set defaults via forwarding and override specific values per card.

### Authentication

Authenticate users in the embedded experience so they don't see a Komo login screen. Uses JWT-based SSO.

**setAuthToken(config)** -- Set a JWT auth token proactively. Takes an object with `token` and `type` properties.

```javascript
komoEmbed.setAuthToken({
  token: 'your-jwt-token-here',
  type: 'jwt'
});
```

**listenToAuthTokenProcessed(callback)** -- Listen for the result of auth token processing. Returns an unsubscribe function.

```javascript
const unsubscribe = komoEmbed.listenToAuthTokenProcessed(
  ({ success, errorMessage }) => {
    if (success) console.log('Auth completed');
    else console.error('Auth failed', errorMessage);
  }
);
```

**forgetUser()** -- Clear the current user's authentication state. Call this on logout.

```javascript
komoEmbed.forgetUser();
```

**setAuthRequestHandler(handler)** -- Set a callback for on-demand authentication. Called when Komo needs the user to be authenticated. Use `hideExperience()` and `unhideExperience()` to manage the modal while your auth UI is shown.

```javascript
komoEmbed.setAuthRequestHandler(async () => {
  try {
    komoEmbed.hideExperience();
    const token = await showAuthModal();
    komoEmbed.setAuthToken({ token: token, type: 'jwt' });
    closeAuthModal();
    komoEmbed.unhideExperience();
  } catch (error) {
    komoEmbed.unhideExperience();
    throw error;
  }
});
```

For the full SSO setup guide including JWT generation and configuration, see the SSO Setup recipe.

For the complete and up-to-date embed SDK reference, see developers.komo.tech/embedding/browser.

---

## Mobile (React Native) Embed

Embed Komo cards and hubs natively in React Native apps. The same concepts from the web embed apply -- card embedding, event listening, authentication, form prefilling -- but delivered via a native component.

### Overview

Komo provides a React Native SDK that wraps the embed experience in a native component. This gives you the same card embedding, SSO, event listening, and form prefilling capabilities as the web SDK, but within a mobile app context.

**Capabilities:**

- **Card embedding** -- render card covers and open card experiences within your React Native app
- **Full Hub embedding** -- render an entire Komo Site within your app
- **Event listening** -- receive gameplay, form, and prize events in your React Native code
- **SSO / Authentication** -- pass JWT tokens for seamless user authentication
- **Form prefilling** -- pre-populate form fields from your app's user data
- **Extension data** -- pass custom key-value data through to webhooks and workflows

### When to Use Mobile Embed

**Good fit:**

- React Native event apps adding engagement features
- Mobile loyalty apps with gamification
- Apps that need Komo embedded inline (not a web redirect)
- When you need native event handling and navigation

**Consider web embed instead:**

- WebView-based apps (use the browser embed SDK directly)
- Non-React-Native mobile apps (use WebView + browser SDK)
- Quick prototypes where a link to the Hub URL is sufficient

### Getting Started

Install the package from npm:

```
npm install @komo-tech/react-native-widgets
```

The React Native SDK documentation covers component usage, props, event handling, and authentication setup.

Full setup instructions, API reference, and code examples are available in the Komo Developer Docs:

- NPM Package: https://www.npmjs.com/package/@komo-tech/react-native-widgets
- Integration Docs: https://developers.komo.tech/embedding/react-native

Supports Markdown formatting. Switch to Preview to see how it renders.

Integration Recipes

Customised

Step-by-step guides for SSO, CRM sync, event app embed, and sponsor lead export.

/hub/f360/build/integrate

Custom content for Fan 360 x Komo

## Integration Recipes -- F360 Focus

Step-by-step guides for the integrations most relevant to F360's implementations.

### SSO Setup (Medium complexity)

For event app integrations, authenticate fans seamlessly. JWT-based Single Sign-On via the embed SDK. The event app generates a signed JWT, passes it to Komo, and Komo creates or matches a Contact record automatically. Fans never see a login screen.

### Event App Embed (Key recipe for F360)

This is the primary integration pattern for F360. Add Komo's engagement layer into existing event platforms via WebView or iframe. Configure SSO pass-through so attendees authenticate once in the event app and are automatically signed into Komo.

**F360-specific notes:**
- For native iOS/Android apps, use the React Native SDK with WebView
- For web-based platforms, use the JavaScript embed SDK
- Always configure SSO to avoid double-authentication
- Test with the client's staging environment before go-live

### Sponsor Lead Export (Critical for F360 clients)

Generate per-sponsor lead reports from branded activations. This is often the most important deliverable for F360's sports clients -- sponsors need proof of engagement and qualified leads. Segment leads by sponsor using card-scoped data, tags, and workflow filters.

### CRM & API Integration

Push fan data to the client's CRM. Built-in connectors for Salesforce, Mailchimp, and Braze. Use the visual workflow builder for no-code setup.

Supports Markdown formatting. Switch to Preview to see how it renders.

Workflows

Template

Automation patterns for common partner implementation scenarios.

/hub/f360/build/workflows

Using universal template -- updates automatically with template changes

## Workflow Patterns

Common automation patterns built with Komo Workflows. Each pattern shows the trigger, actions, and how to set it up in the Komo Portal.

### Pattern 1: Post-Event Follow-Up

After a user engages with a card at an event, send a follow-up email and add them to an "attended" list for future segmentation.

- **Trigger:** Gameplay.DataCaptured -- Fires when a user submits a form within a card. Scope to specific event cards.
- **Action:** ContactEmailSend -- Send a follow-up email with a post-event survey link and any prizes/content they unlocked.
- **Action:** ContactAddToList -> "Event Attended" -- Add the contact to a list for future segmentation and reporting.
- **Action:** ContactUpdate -> Add tag "event-attended" -- Tag the contact for cross-workflow filtering.

### Pattern 2: Sponsor Lead Routing

When a qualified lead engages with a sponsor's card, check which sponsor it belongs to and route the lead data to that sponsor's webhook.

- **Trigger:** Gameplay.DataCapturedQualified -- Fires when a qualified submission occurs (user meets entry criteria).
- **Decision:** Check card name contains "Sponsor A" -- Branch based on which sponsor's card was played.
- **Action (Yes):** HttpRequest -> POST to Sponsor A's webhook -- Send contact data, form fields, and gameplay results to the sponsor's endpoint.
- **Action:** CompetitionEntryAddTags -> "sponsor-a" -- Tag the competition entry for per-sponsor reporting and export.
- **Action (No):** HttpRequest -> POST to default/Sponsor B webhook -- Route to the next sponsor check or a default handler.

### Pattern 3: Loyalty Points on Engagement

Award loyalty points when users complete a card, then check if they've crossed a tier threshold and upgrade their tier.

- **Trigger:** Gameplay.Ended -- Fires when a user completes any card experience.
- **Action:** LoyaltyAwardPoints -- Award loyalty points to the contact for completing the engagement.
- **Decision:** Check if total points exceed tier threshold -- Evaluate whether the user has earned enough points for a tier upgrade.
- **Action (Yes):** LoyaltyAddToTier + ContactEmailSend -- Upgrade the contact's loyalty tier and send a congratulations email.

### Pattern 4: Receipt Validation Flow

When a receipt is successfully validated (purchase verification), issue a coupon and send a confirmation SMS.

- **Trigger:** Gameplay.ReceiptValidationSuccess -- Fires when a user's uploaded receipt passes validation.
- **Action:** ContactCouponIssue -- Issue a digital coupon or voucher to the validated contact.
- **Action:** AssignBonusCompetitionEntries -- Grant bonus entries into the prize draw for the validated purchase.
- **Action:** ContactSmsSend -- Send a confirmation SMS with coupon details and redemption instructions.

---

## Available Triggers

Events that can start a workflow. Each can be scoped to a Workspace, Site, or individual Card.

### Contact Triggers

- **Contact.Identified** -- Contact identified
- **Contact.PropertyUpdated** -- Contact property updated
- **Contact.Verified.Sso** -- Contact verified by SSO
- **Contact.ListAdded** -- Contact added to list

### Gameplay Triggers

- **Gameplay.Started** -- Gameplay started
- **Gameplay.Action** -- Gameplay action occurred
- **Gameplay.Ended** -- Gameplay ended
- **Gameplay.DataCaptured** -- Data captured (incl. disqualified)
- **Gameplay.DataCapturedQualified** -- Data captured (qualified only)
- **Gameplay.ReceiptValidationSuccess** -- Receipt validated
- **Gameplay.ReceiptValidationRejected** -- Receipt rejected
- **Gameplay.TreasureHuntCheckpointCompleted** -- Treasure hunt checkpoint done
- **Gameplay.UploadApproved** -- Upload file approved
- **Gameplay.UploadRejected** -- Upload file rejected
- **Gameplay.LiveSurveyQuestionAsked** -- Q&A question asked
- **Gameplay.LiveSurveyQuestionApproved** -- Q&A question approved
- **Gameplay.LiveSurveyQuestionRejected** -- Q&A question rejected

### Prize Triggers

- **Prize.Awarded** -- Prize awarded
- **Prize.ExtraDataCaptured** -- Extra data form captured

### Card Triggers

- **Card.CoverClicked** -- Card cover clicked

### Loyalty Triggers

- **Loyalty.PointsAwarded** -- Points awarded
- **Loyalty.PointsRedeemed** -- Points redeemed
- **Loyalty.TierAdded** -- Tier added
- **Loyalty.TierRemoved** -- Tier removed

---

## Available Actions

Steps that a workflow can execute:

### API, Utility & Flow

- **HttpRequest** -- Call any external REST API
- **Decision** -- Branch based on conditions
- **Split** -- Split into multiple parallel branches

### Contact

- **ContactFilter** -- Filter contacts by properties
- **ContactUpdate** -- Update contact properties
- **ContactAddToList** -- Add contact to a list
- **ContactRemoveFromList** -- Remove from list
- **ContactEmailSend** -- Send email
- **ContactSmsSend** -- Send SMS
- **ContactCouponIssue** -- Issue a coupon
- **ContactVaultCardIssue** -- Issue a vault card
- **AssignContactAchievement** -- Award achievement

### Competition & Gameplay

- **AssignBonusCompetitionEntries** -- Grant bonus entries
- **CompetitionEntryAddTags** -- Tag entries
- **CompetitionEntryRemoveTags** -- Remove entry tags
- **GameplayFilter** -- Filter gameplay events
- **AssignGameplayScore** -- Assign a score

### Loyalty

- **LoyaltyAwardPoints** -- Award loyalty points
- **LoyaltyRedeemPoints** -- Redeem points
- **LoyaltyAddToTier** -- Add to loyalty tier
- **LoyaltyRemoveFromTier** -- Remove from tier

### Salesforce

- **SalesforceGetObject** -- Query records
- **SalesforceCreateObject** -- Create records
- **SalesforceUpdateObject** -- Update records

### Mailchimp

- **MailchimpUpsert** -- Add or update subscriber
- **MailchimpUnsubscribe** -- Unsubscribe
- **MailchimpDelete** -- Delete subscriber
- **MailchimpAddTags** -- Add tags
- **MailchimpRemoveTags** -- Remove tags
- **MailchimpArchive** -- Archive subscriber

### Braze

- **BrazeTrackUser** -- Track user event

### Other

- **ContactThuziCheckIn** -- Thuzi check-in

---

## Building Workflows

Workflows are built visually in the Komo Portal under **Automation > Workflows** -- available at the Workspace, Site, or Card level. The drag-and-drop builder lets you:

- Select a trigger event and scope it to specific cards, a site, or the entire workspace
- Chain multiple actions in sequence
- Add conditional branches with Decision nodes
- Split into parallel execution paths
- Map data between steps using dynamic field references
- Test workflows before activating them

Full workflow reference: developers.komo.tech/workflows

Supports Markdown formatting. Switch to Preview to see how it renders.

FAQ

Template

Frequently asked questions about the platform, privacy, and data handling.

/hub/f360/build/faq

Using universal template -- updates automatically with template changes

## FAQ

Frequently asked questions about the Komo platform, privacy, security, and integrations.

### Getting Help

**Where can I find tutorials and guides?**
Visit the Komo Knowledge Base at knowledge.komo.tech for product guides, how-tos, and feature documentation.

**How can I contact support?**
Email support@komo.tech and the team will get back to you promptly.

**Can I request features or report issues?**
Yes. Contact your Customer Success Manager directly, or email support@komo.tech.

### Tech Stack

**What languages and frameworks does Komo use?**
.NET (C#) for APIs and backend services, and Next.js / React for the frontend.

**What databases does Komo use?**
PostgreSQL for relational data, BigQuery for analytics, and Redis for caching. Google Cloud Storage is used for files and images.

**What cloud and hosting does Komo use?**
Cloudflare for global CDN and DDoS protection. Hosted on Google Cloud Platform (GCP) via Google Kubernetes Engine (GKE).

**How does Komo handle scaling?**
Databases and infrastructure auto-scale via GCP. Kubernetes handles container orchestration and horizontal scaling based on CPU, memory, and request metrics.

### Web Embeds

**Can I embed Komo content in my website?**
Yes. Any Card can be published and embedded on a webpage. See the embed content guide at knowledge.komo.tech/embed-content for details.

**What if I need more control over the embed?**
Load the SDK manually for full programmatic control. See the Browser SDK documentation at developers.komo.tech/embedding/browser.

### Native App Embeds

**Can I embed Komo in iOS or Android apps?**
Yes. Use the React Native SDK for first-class native support, or embed via a native WebView component.

**Where is the React Native package?**
Available on NPM: @komo-tech/react-native-widgets. Documentation: developers.komo.tech/embedding/react-native.

### Data Ownership & Access

**Who owns the data collected through Komo?**
You do. Komo does not claim any rights to the data you capture through the platform.

**What data does Komo collect?**
Only what you configure. Data capture is driven by customizable forms that you control.

**Can Komo staff access my data?**
Only to provide support when needed. Access is controlled and audited.

**Does Komo share data with third parties?**
Only with trusted sub-processors that are required for service delivery. No data is sold or shared for advertising purposes.

### Security & Compliance

**Is Komo GDPR compliant?**
Yes. Komo is fully GDPR compliant.

**Is Komo CCPA compliant?**
Yes. Komo is fully CCPA compliant.

**Is Komo SOC 2 Type 1 compliant?**
Yes. Komo has achieved SOC 2 Type 1 certification. Type 2 is in progress.

**Is Komo ISO 27001 certified?**
Yes. Komo holds ISO 27001 certification.

**Will Komo sign a Data Processing Agreement (DPA)?**
Yes. Send your DPA to security@komo.tech.

### Cookies & Consent

**Does Komo use cookies?**
Yes. Komo uses cookies for: remembering users, tracking game progress, and consent form status.

**What cookie consent providers are supported?**
Komo has a direct integration with OneTrust and is open to supporting other cookie consent providers.

**Can I show a consent form on a Komo hub?**
Yes. A consent form can be enabled on Komo-generated pages.

### Policies

- **Privacy Policy:** Australia -- https://www.komo.tech/privacy-policy | United States -- https://www.komo.tech/us/privacy-policy
- **Terms of Service:** Australia -- https://www.komo.tech/terms-of-service | United States -- https://www.komo.tech/us/terms-of-service

Security contact: security@komo.tech

Supports Markdown formatting. Switch to Preview to see how it renders.

15 of 15 sections enabled

3 customised