Skip to content

Getting Started โ€‹

๐Ÿšง CLOSED BETA

Sibilance is currently in closed beta. This documentation is provided as a reference to showcase how the implementation will work upon release.

The @sibilance.is/client package is not yet publicly available. If you're interested in early access, please visit sibilance.is to join the waitlist.

Welcome to Sibilance! This guide will help you add AI voice surveys to your web application in minutes.

What is Sibilance? โ€‹

Sibilance is a SaaS platform that enables websites to collect survey data, specifications, and other information through interactive AI voice workflows. The client library (@sibilance.is/client) provides:

  • ๐ŸŽค AI Voice Surveys - Natural, conversational voice interactions
  • ๐Ÿ“Š Survey Builder - Visual flowchart editor for creating surveys
  • ๐Ÿ“ Markdown Workflows - Define surveys using simple markdown syntax
  • ๐Ÿงช Interactive Testing - Test surveys with real-time YAML output
  • ๐Ÿ” Secure - Domain validation and encrypted API key storage

Prerequisites โ€‹

Before you begin, ensure you have:

  • Node.js 18+ or Bun
  • A modern browser with microphone support
  • HTTPS (required for microphone access)
  • A Sibilance account (sign up at sibilance.is)
  • A Survey Key from the Sibilance platform

Installation โ€‹

Install the package using your preferred package manager:

bash
# npm
npm install @sibilance.is/client

# yarn
yarn add @sibilance.is/client

# pnpm
pnpm add @sibilance.is/client

# bun
bun add @sibilance.is/client

Quick Start โ€‹

Here's a minimal example to get you started:

React Example โ€‹

tsx
import { useSibilance, FloatingMicButton } from '@sibilance.is/client/react';

function VoiceSurvey() {
  const { voiceState, surveyState, toggleSession } = useSibilance({
    surveyKey: "sibilance_your_key_here",
  }, {
    onComplete: (yaml) => {
      console.log('Survey completed!', yaml);
      // Submit to your backend
    }
  });

  return (
    <FloatingMicButton
      isConnected={voiceState.isConnected}
      onClick={toggleSession}
    />
  );
}

Vanilla JavaScript Example โ€‹

typescript
import { SibilanceClient } from '@sibilance.is/client';

const client = new SibilanceClient({
  surveyKey: "sibilance_your_key_here",
}, {
  onComplete: (yaml) => {
    console.log('Survey completed!', yaml);
  }
});

// Start voice session
await client.connect();

Getting Your Survey Key โ€‹

  1. Visit sibilance.is
  2. Sign up for an account
  3. Create a new survey using the Survey Builder
  4. Generate a Survey Key for your survey
  5. Copy the key (starts with sibilance_)

How It Works โ€‹

  1. Create Survey - Use the Sibilance platform to create a voice survey with markdown and Mermaid diagrams
  2. Get Survey Key - Generate a survey key from the platform
  3. Embed Widget - Add the Sibilance client library to your website
  4. Collect Data - Users interact with your survey via voice, and results are collected as YAML

Next Steps โ€‹

Now that you have Sibilance installed, explore these topics:

Need Help? โ€‹