SaaS Platform Introduction
Overview of the CallVIQ multi-tenant conversational AI calling SaaS, architectural components, integrations, and operator management tiers.
CallVIQ is a complete, enterprise-grade Voice AI Agent platform designed to build, deploy, manage, and scale outbound conversational calling services. Running on a multi-tenant software architecture, the platform separates workspace data logically, enabling tenants to manage accounts independently while letting operators supervise the system through a global management panel.
Tenant Workspace Features
Tenants use CallVIQ to construct conversational pipelines, connect custom carrier accounts, and execute dialing campaigns. The key features available to each tenant include:
Super Admin Platform Features
Super administrators supervise global multi-tenant boundaries, monetization logic, white-label configs, and host infrastructure diagnostic metrics. The key features include:
Platform Requirements
System dependencies, host hardware resources, network ports configuration, database structures, and third-party API credentials needed to deploy CallVIQ.
CallVIQ runs on a containerized, self-hosted deployment architecture, utilizing Docker and Docker Compose to link API processes, real-time media WebSockets, queue workers, database triggers, and frontend client views. Ensure your deployment host meets the resource limits and connectivity conditions listed below.
System & Service Specifications
The following table lists the physical resources, database software configurations, and provider API credentials required to launch the CallVIQ application containers stack:
| Component | Description | Minimum Specification | Recommended Specification |
|---|---|---|---|
|
Server CPU
|
Processor capacity required to run REST API nodes and WebSocket media stream routing gateways. | 2 vCPUs | 4 vCPUs |
|
System RAM
|
Memory capacity required to handle concurrency queue workers and task schedulers. | 4GB RAM | 8GB RAM |
|
Disk Storage
|
Host storage space for log indices, exports, caching pools, and call recording files. | 20GB SSD | SSD + AWS S3 |
|
Database & Cache
|
Relational database schemas and cache stores for multi-tenancy limits checks. | MySQL 8 / Redis 7 | RDS MySQL / Managed Redis |
|
Stripe Billing
|
Commercial subscription gateway configuration required to synchronize tenant pricing plans. | Stripe Test Mode API Keys | Stripe Live Webhook Signatures |
|
Mail Delivery
|
Dynamic outbound dispatch mailing. Configure custom SMTP server details or Resend API key directly. | Custom SMTP server details | Resend API key integration |
Platform Branding
Configure your platform logo, custom title, dynamically style login screens, and set brand identity variables.
CallVIQ contains a built-in Branding Engine accessible via the Super Admin Dashboard. These settings dynamically apply brand styling across your tenant panels, login pages, navigation bars, and transactional emails. You can configure your branding automatically through the admin panel or manually by modifying the source files.
Branding Configuration Matrix
The following table lists the core branding assets, their descriptions, file paths, and recommended specifications:
| Branding Asset | Description | File Path / Code Location |
|---|---|---|
|
Platform Logo
|
Vector SVG or transparent PNG file displayed on sidebar headers, sign-in screens, and onboarding layouts. | frontend/public/logo.svg |
|
Favicon Icon
|
Small browser tab identity icon. Replacing this changes the shortcut thumbnail displayed by web browsers. | frontend/public/globe.svg |
|
Brand Name Config
|
Metadata variables representing primary platform title names, copyright strings, and SEO description parameters. | frontend/src/config/branding.ts |
|
Color Theme CSS
|
Tailwind CSS variables controlling active buttons, navigation state highlights, border outlines, and focus rings. | frontend/src/app/globals.css |
Option 1: Dashboard Configuration
Follow these steps to configure your custom branding dynamically via the web user interface without touching any source code files:
Step 1: Log in to the Super Admin Dashboard
Open your browser and navigate to the admin portal at
http://localhost:3000/superadmin/login (or your
live production domain). Enter your Super Admin operator
credentials (default is admin@callviq.com /
Admin@123456) and authenticate.
Step 2: Navigate to System Settings
In the admin sidebar menu, navigate to the Command Center and select the System Settings or Branding Configuration tab.
Step 3: Upload Brand Logo
Under the Logo section, upload your custom SVG or PNG image. The
dashboard automatically base64 encodes and sends this file to
the backend API via
/api/v1/superadmin/settings/logo, saving it to
backend/uploads/ and updating the
system_settings database record.
Step 4: Set Platform Names and Copyright Texts
Type in your desired Platform Name and Copyright Text in the designated text inputs. These overwrite default configurations across all client views instantly.
Step 5: Save and Apply Settings
Click the Save Branding Settings button at the bottom of the page. The changes are immediately populated and applied dynamically across all tenant accounts and workspaces.
Option 2: Manual Code Configuration
If you prefer updating the files directly inside your repository source code, follow these detailed code replacement guidelines:
Step 1: Replace Default Logo and Identity Files
To change the default logos statically, replace the vector files inside the public asset folder of the frontend project directory:
.svg formats for
crisp rendering at any screen resolution. The logo SVG
should have a wide aspect ratio (recommended 160px by 40px)
to fit in the sidebar header cleanly.
frontend/public/logo.svg
frontend/public/globe.svg
You can copy your brand images directly over these files using your file manager or standard terminal commands:
# Copy your custom logo SVG over the default logo asset
cp /path/to/your/custom-logo.svg frontend/public/logo.svg
# Copy your custom shortcut icon over the default globe asset
cp /path/to/your/custom-favicon.svg frontend/public/globe.svg
Step 2: Change Default Brand Name and Metadata
Open the branding configuration script in your editor and modify the key metadata values:
frontend/src/config/branding.ts
Update the metadata properties inside the exported
BRANDING configuration object:
export const BRANDING = {
platformName: "CallVIQ", // Change this to your custom SaaS name
companyName: "CallVIQ Inc.", // Change this to your registered corporate name
defaultTitle: "CallVIQ", // Change this to your primary page tab heading
defaultTitleSuffix: " | CallVIQ", // Suffix displayed at the end of browser tabs
metaDescription: "AI Calling Agent SaaS platform", // SEO search meta description
testimonialQuote: "CallVIQ replaced our manual customer outreach operations and reduced call handling costs by 80% within the first month.",
defaultLogoUrl: "/logo.svg", // Target link pointing to your main logo asset
copyright: "© 2026 CallVIQ Inc.", // Text displayed in the footer of login screens
byokNotice: "CallVIQ operates on a Bring Your Own Key (BYOK) model. Connect your API keys to support dynamic bot dialogs.",
};
Step 3: Change Color Palette Variables (Tailwind CSS v4)
CallVIQ is styled using Tailwind CSS v4, which defines core configuration parameters inside the root CSS file. Open the global stylesheet to edit variables:
frontend/src/app/globals.css
Locate the :root element and customize the CSS
properties to update your application brand colors:
:root {
/* ... background and layout variables ... */
/* Change your primary brand color variable here (Hex or HSL color codes) */
--primary: #0F172A; /* Default charcoal black color for buttons and badges */
--primary-hover: #1E293B; /* Slightly lighter shade for active hover states */
--primary-foreground: #FFFFFF; /* Foreground text color inside action buttons */
/* Change semantic accent status variables if necessary */
--success: #16A34A; /* Emerald green theme for successful actions */
--warning: #D97706; /* Warm amber theme for pending notifications */
--destructive: #DC2626; /* Crimson red theme for deletion processes */
--ring: #0F172A; /* Keyboard navigation focus outline rings */
--radius: 0.5rem; /* Corner roundness for cards, borders, and input fields */
}
Premium Brand Color Presets
To simplify color selection, you can copy one of our
pre-configured color palettes and paste it directly into your
globals.css file:
| Preset Name | Hex Colors Configuration | CSS Stylesheet Snippet |
|---|---|---|
| Royal Blue / Indigo |
Primary: #4F46E5Hover: #4338CA
|
|
| Teal Oasis |
Primary: #0D9488Hover: #0F766E
|
|
| Ocean Breeze |
Primary: #0284C7Hover: #0369A1
|
|
| Emerald Forest |
Primary: #059669Hover: #047857
|
|
1. Download & Unzip the Package
Extract the CallVIQ platform ZIP file from CodeCanyon onto your machine.
The CallVIQ codebase comes in a single ZIP file containing the entire application (both frontend client dashboard and backend api servers). Follow the steps below to extract it:
What the ZIP contains
Once you extract the package, you will see the following files and folders at the root level:
- frontend/ — The client dashboard dashboard. It is built with Next.js (React framework) and communicates with the backend via API endpoints.
- backend/ — The backend server and API gateway. Built with Express, it handles database connections, Twilio integrations, queues, and user authentication.
- database.sql — The raw database setup file containing the structure of the MySQL database tables, indices, and default testing configurations.
- documentation/ — The developer manual containing setup guides (the guide you are reading now).
How to Unzip
You can extract the ZIP file by right-clicking it and choosing "Extract Here" (or double-clicking on macOS Finder). If you prefer using your terminal, navigate to the folder where you downloaded the file and run:
unzip callviq-codecanyon.zip -d callviq-saas
cd callviq-saas
2. Setup MySQL Database
Create your local MySQL database and import the default tables structure.
CallVIQ uses MySQL to save accounts, billing details, settings,
and campaigns. You need to create a new database on your
computer and load the schema from the
database.sql file.
Step 1: Create the Database
Open your MySQL client or terminal and create a new database.
You can name it whatever you like, for example:
callviq_db.
mysql -u root -p -e "CREATE DATABASE callviq_db;"
Step 2: Import the SQL File
Import the tables into your database. Run the command below from
the root of your unzipped project folder (replace
root with your MySQL username):
mysql -u root -p callviq_db < database.sql
Using Database Managers (GUI Tools)
If you don't want to use the terminal, you can easily use graphical database clients instead:
-
TablePlus: Open a connection to your MySQL
server, right-click, select New Database.
Name it. Then go to File ➔ Import ➔ SQL Dump,
select
database.sqland click Import. -
phpMyAdmin: Select your MySQL server, click
the Databases tab, type database name, and
click create. Select the database on the left, click the
Import tab, browse to choose
database.sql, and click Go. -
DBeaver: Right-click your connection, select
Create ➔ Database. Right-click the new
database, choose Tools ➔ Restore Database,
select
database.sql, and run.
3. Install Required Packages
Download and install the dependencies for frontend client and backend server directories.
CallVIQ is a full-stack project utilizing a workspace configuration. This means you can install dependencies for both components concurrently with a single command from the project root directory.
Step 1: Check Node.js Version
Ensure that you have Node.js version 18 or newer installed on your computer. You can check by running:
node -v
Step 2: Run Installations
Open your terminal inside the root project directory and execute the commands below. The first command installs general monorepo scripts, and the second command installs the exact NPM libraries needed by both frontend and backend directories:
npm install
npm run install:all
What packages are being installed?
- Frontend libraries: Next.js framework, React components, Tailwind CSS styling, Socket.io-client connections, and Lucide icons dashboard utilities.
- Backend libraries: Express server, Sequelize ORM database engine, BullMQ queues scheduler, Redis client drivers, MySQL2 connectors, and Twilio SDK packages.
4. Set Up Configuration Files
Create your local environment settings (.env files) to connect database and API services.
Both frontend and backend applications require environmental variables to connect to database tables, redis servers, payment gateways, and third-party APIs. We provide template examples to copy and edit easily.
Step 1: Copy Configuration Templates
Run these terminal commands from the root directory to generate active settings files:
cp frontend/.env.example frontend/.env
cp backend/.env.example backend/.env
Step 2: Understand the Settings
Open the new .env files in your code editor (like
VS Code or Cursor). Here is exactly what to place in each field:
1. Frontend Configuration (frontend/.env)
| Variable Name | Example Value | What it does & What to add |
|---|---|---|
| NEXT_PUBLIC_API_URL | http://localhost:5000/api/v1 |
Points the frontend user interface to the backend API server. If running locally, keep this as default. |
| NEXT_PUBLIC_SOCKET_URL | http://localhost:5000 |
Points the frontend to the backend server for real-time WebSocket audio connections. |
2. Backend Configuration (backend/.env)
| Variable Name | Example Value | What it does & What to add |
|---|---|---|
| PORT | 5000 |
The port number where the backend server runs. Keep as 5000 for local testing. |
| NODE_ENV | development |
The current running environment. Set to
development for local testing, or
production on live servers.
|
| DB_HOST | 127.0.0.1 |
The database server IP. Use 127.0.0.1 or
localhost for local MySQL.
|
| DB_PORT | 3306 |
The port number of your MySQL service. Default is 3306. |
| DB_USER | root |
Your MySQL database username (usually
root locally).
|
| DB_PASSWORD | (leave blank or enter your password) | Your MySQL database password. Leave empty if you did not set a password. |
| DB_NAME | callviq |
The name of the database you created in Step 2. |
| REDIS_HOST | 127.0.0.1 |
The Redis server IP address. Redis manages background phone call jobs. |
| REDIS_PORT | 6379 |
The port number of your Redis service. Default is 6379. |
| REDIS_PASSWORD | (leave blank if none) | Your Redis password. Leave blank if your local Redis has no password. |
| JWT_SECRET | your_jwt_access_secret_change_me |
A random secure key used to verify user logins. Type any long random text. |
| JWT_REFRESH_SECRET | your_jwt_refresh_secret_change_me |
A random secure key used to renew login sessions. Type any long random text. |
| ENCRYPTION_KEY |
your_encryption_key_here_32_bytes_hex
|
A 32-character hexadecimal key (e.g.
a1b2c3d4...) used to encrypt users' API
keys safely in the database.
|
| ENCRYPTION_SALT | your_encryption_salt_here |
A random secure key used to add extra security during database encryption. |
| STRIPE_SECRET_KEY | your_stripe_secret_key_here |
Your Stripe Secret API Key (found in Stripe Developer Dashboard) for credit wallets and subscriptions. |
| STRIPE_WEBHOOK_SECRET | your_stripe_webhook_secret_here |
Stripe Webhook signing secret. It verifies that payment events really came from Stripe. |
| PUBLIC_BACKEND_URL | http://localhost:5000 |
The main public URL of your backend. Used by external services to reach your server. |
| FRONTEND_URL | http://localhost:3000 |
The main web URL of your user interface dashboard. Used to allow correct cross-origin login requests. |
5. Concurrently Start Local Servers
Launch both the Next.js frontend and Express backend concurrently.
Now that package modules have completed downloading and environmental variables have been initialized, you can boot the servers to start running CallVIQ locally.
Step 1: Launch Servers
Run the developer script command from the root of the project folder. This will automatically execute the dev environments inside both `frontend/` and `backend/` directories at the same time:
npm run dev
Step 2: Accessing Local Ports
Once compilation is complete and logs begin printing to your terminal:
- User Interface: Open your web browser and go to http://localhost:3000 to view the dashboard portal.
- API Server: The REST API backend routes and WebSocket connections will run on http://localhost:5000.
Step 3: Verification Sandbox
To verify the local installation is working completely:
- Go to the login page: http://localhost:3000/login
- Click the outline button labeled "Quick Login (Demo)".
- The form fields will immediately auto-populate, log you in, and redirect you to the main merchant portal dashboard dashboard.
- Test navigating across sidebar tabs (Campaigns, Dialers, Logs) to ensure everything database related runs successfully.
6. Live Production Deployment
Deploy CallVIQ to a live Ubuntu Linux VPS server for public access.
For a public release, you need to compile the Next.js frontend into static production bundles and run the backend API server 24/7 using PM2 process management behind an Nginx reverse proxy.
Step 1: Install Node.js and PM2
Connect to your server via SSH and install the latest Node.js release, along with PM2 globally to monitor your backend logs:
curl -fsSL https://deb.nodesource.com/setup_20.x | sudo -E bash -
sudo apt-get install -y nodejs
sudo npm install -g pm2
Step 2: Build & Run the Frontend
Navigate to the frontend/ directory, install
production packages, compile the Next.js optimization bundle,
and launch it using PM2:
cd frontend
npm install --production
npm run build
pm2 start npm --name "callviq-frontend" -- start
Step 3: Run the Backend API
Navigate to the backend/ directory, install
production packages, and launch the API server under PM2
supervision:
cd ../backend
npm install --production
pm2 start src/server.js --name "callviq-backend"
Save the PM2 process list so it automatically restarts if the host server reboots:
pm2 save
pm2 startup
Step 4: Nginx Reverse Proxy Setup
Nginx directs public web traffic on ports 80/443 to your active Node.js processes. Install Nginx and configure server blocks:
sudo apt install nginx
Create a configuration file at
/etc/nginx/sites-available/callviq to route traffic
to the frontend (port 3000) and backend (port 5000):
server {
listen 80;
server_name dashboard.yourdomain.com;
location / {
proxy_pass http://localhost:3000;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
}
}
server {
listen 80;
server_name api.yourdomain.com;
location / {
proxy_pass http://localhost:5000;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
}
}
Enable the site configuration and restart Nginx:
sudo ln -s /etc/nginx/sites-available/callviq /etc/nginx/sites-enabled/
sudo nginx -t
sudo systemctl restart nginx
Step 5: Setup Let's Encrypt SSL
Secure the public domain endpoints using automatic Let's Encrypt SSL certificates:
sudo apt install certbot python3-certbot-nginx
sudo certbot --nginx -d dashboard.yourdomain.com -d api.yourdomain.com
Stripe Payment Setup
Configure Stripe to process customer billing subscriptions and system wallet balances.
CallVIQ uses Stripe as the primary merchant service gateway. Stripe enables credit card processing for tenant subscription upgrades, manual credits wallet top-ups, and automated wallet recharges. Setting up Stripe requires registering API secrets and configuring live webhook listeners on your API server.
Stripe Configuration Details
Stripe integrations rely on two API keys and a webhook signing secret. Complete the following configuration steps to enable payments:
Step 1: Sign up and Choose Mode
Go to Stripe.com and sign up for a merchant account. Once your dashboard is ready, toggling the Test Mode switch in the top right corner allows you to sandbox credit card operations without processing real money. Keep Test Mode enabled during local workspace development checks.
Step 2: Generate Stripe API Keys
Navigate to the Developers ➔ API Keys tab on the left sidebar menu. Copy the primary authentication tokens from this panel:
-
Publishable Key: Public identifier token
(starts with
pk_test_). This key is safe to expose in client browsers. -
Secret Key: Private operational token (starts
with
sk_test_). Warning: Keep this key highly confidential. Never expose this key in front-end client bundles or repository check-ins.
Step 3: Setup Webhook Endpoint
Navigate to Developers ➔ Webhooks and click Add Endpoint. Set up the webhook targets using these settings:
| Setting | Value / Recommendation |
|---|---|
| Endpoint URL |
https://api.yourdomain.com/api/v1/billing/webhook(or your local proxy address like http://localhost:5000/api/v1/billing/webhook)
|
| Events to Send |
Select the following operational triggers: - checkout.session.completed (processes
initial plan checkout transactions)- invoice.paid (validates monthly recurring
subscription purchases)- invoice.payment_failed (handles card
failure actions and downgrades alerts)- customer.subscription.deleted (processes
user plan cancellation requests)
|
Once you save the endpoint, click on the webhooks page and
reveal the Signing Secret (starts with
whsec_). This key verifies that webhook
notifications sent to your backend server are authentic Stripe
updates.
stripe login, and run
stripe listen --forward-to
localhost:5000/api/v1/billing/webhook. Use the signing secret printed by the CLI listener inside
your local environment configuration.
Step 4: Update Backend Environment Variables
Open your backend settings file and update the Stripe key variables:
backend/.env
Insert your credentials directly into the corresponding variable lines:
# Stripe Integration Credentials
STRIPE_SECRET_KEY=sk_test_51Px...your_stripe_secret_key
STRIPE_WEBHOOK_SECRET=whsec_...your_webhook_signing_secret
Restart your backend server to apply the updated keys. Stripe is now fully connected to handle platform checkouts, monthly billing events, and user credit wallets top-ups.
Google Calendar & OAuth Setup
Configure Google API credentials to synchronize appointment slots, calendar bookings, and agent calendars.
CallVIQ synchronizes agent booking sessions and slot availability indexes directly with Google Calendar via the Google Calendar API. Setting up this sync requires generating an OAuth 2.0 Client credentials profile in the Google Cloud Console, and registering the client keys in the system settings database.
Google Integration Details
Google OAuth integrations require a Client ID, a Client Secret, and an Authorized redirect URL callback. Complete the following configuration steps:
Step 1: Create a Google Cloud Project
Go to the
Google Cloud Console
and log in. Click the project dropdown list in the header bar,
select New Project, type in a project name like
CallVIQ Integration, and click Create.
Step 2: Enable the Google Calendar API
Navigate to the API library and enable Calendar resource access:
- Click the main navigation menu icon and select APIs & Services ➔ Library.
-
Type
Google Calendar APIinto the search box, click on the search result, and click the Enable button.
Step 3: Configure the OAuth Consent Screen
Before generating key credentials, define the platform's OAuth user authorization parameters:
- Navigate to APIs & Services ➔ OAuth Consent Screen.
- Select External User Type and click Create.
-
Fill in mandatory metadata inputs: App Name (e.g.
CallVIQ Calendar Sync), User Support Email, and Developer Contact Information. Click Save and Continue. -
Under the Scopes step, click
Add or Remove Scopes, add the
.../auth/calendarand.../auth/calendar.eventsscopes, and save. - Under Test Users, add the Google/Gmail accounts of users you want to allow calendar sync access during development testing. Click Save and Finish.
Step 4: Create OAuth 2.0 Credentials
Generate Client IDs and secrets to authenticate CallVIQ connection requests:
- Navigate to APIs & Services ➔ Credentials, click Create Credentials, and select OAuth Client ID.
- Set Application Type to Web Application and name the client profile.
-
Under Authorized JavaScript origins, add your
live frontend dashboard URL:
https://dashboard.yourdomain.com(orhttp://localhost:3000for local developer testing). -
Under Authorized redirect URIs, add your
callback redirection endpoint URL:
https://api.yourdomain.com/api/v1/integrations/google/callback(or local testing url:http://localhost:5050/api/v1/integrations/google/callback). - Click Create and copy your new Client ID and Client Secret tokens.
Step 5: Apply Credentials in CallVIQ Dashboard
You can configure the client settings dynamically via the Super Admin Command Center Settings:
- Log in to the Super Admin Dashboard and navigate to Settings ➔ Integrations.
- Locate the Google Calendar integration fields and input your Client ID, Client Secret, and redirect callback URL.
- Click the Save button. The system will save and apply the OAuth credentials across the entire platform.
Google Calendar integrations are now fully enabled. Tenant dashboard users can now navigate to their profile settings, click "Link Google Calendar", authorize via Google Account Consent, and map system workflows to their Google Calendars.
Email Integration Setup
Configure platform transactional mailing services using custom SMTP parameters or the Resend API.
CallVIQ dispatches transactional notifications (such as verification links, password resets, access invitations, and billing invoices) using an administrative mail provider. The system supports email configurations via standard custom SMTP servers or direct integration with the Resend mailing API.
Option 1: Custom SMTP Configurations
To use an external SMTP mailing provider (like SendGrid, Mailgun, Amazon SES, or private corporate mail servers), follow these configuration steps:
Step 1: Obtain SMTP Connection Settings
Log in to your email delivery service and collect the following parameters:
-
Host: The server domain address (e.g.
smtp.sendgrid.netorsmtp.mailgun.org). -
Port: Secure connection port (usually
465for SSL or587for TLS/STARTTLS). -
Username: Mail API account login credential
(e.g.
apikey). - Password: Secure API access password.
-
From Email: The authenticated sender address
(e.g.
noreply@yourdomain.com).
Step 2: Configure in Super Admin Dashboard
Apply the server configuration settings inside the administrator command panel:
- Log in to the Super Admin Dashboard and navigate to Settings ➔ Mail Settings.
- Select SMTP as the active mail delivery provider type.
- Input Host, Port, Username, Password, Sender Name, and authenticated Sender Email. Click Save.
Option 2: Resend API Configuration
If you prefer using the modern Resend API for fast email delivery, complete these setup steps:
Step 1: Generate a Resend API Access Key
Create a verified sender profile and retrieve credentials from the Resend console:
- Go to Resend.com, log in, navigate to Domains, and complete the DNS TXT record authentication for your email domain.
-
Navigate to API Keys, click
Create API Key, grant full sending
permissions, and copy the new token (starts with
re_).
Step 2: Configure in Super Admin Dashboard
Apply the Resend configuration settings inside the administrator command panel:
- Log in to the Super Admin Dashboard and navigate to Settings ➔ Mail Settings.
- Select Resend as the active mail delivery provider type.
- Input your Resend API Key, Sender Name, and verified Sender Email. Click Save.
Step 3: Dispatch Mail Delivery Tests
To verify that email integration operates successfully, you can run a diagnostic delivery test directly from the Command Center Settings:
- Under the active Mail Configuration panel, locate the Test Connection section.
- Type in a valid recipient email address and click the Send Test Email button.
- Verify that the test dispatch finishes with a success notification status, and check the target email inbox folder to review message formatting.
Guided Onboarding Wizard
Learn how the onboarding flow helps new customers configure their workspaces on initial login.
New customers are guided through a multi-step split-screen onboarding assistant upon their first login. This ensures all administrative keys, billing balances, and telephony credentials are provisioned before they access the main workspace commands.
Step 1: Account Creation and Sign In
Go to the platform registration interface and create a customer workspace. Fill in name, email address, password details, and verify your account via the activation link sent to your inbox.
Step 2: Selecting a Subscription Plan
Select the subscription pricing package (Starter, Professional, Enterprise) that aligns with your operational targets. Plan tiers define access privileges, default calling credit rates, and concurrency caps.
Step 3: Top Up Wallet Balance
Input billing card details processed securely by Stripe to fund your initial wallet balance. Balance credits are consumed dynamically to cover real-time telephony connections, processing tokens, and voice synthesis fees during campaigns.
Step 4: Phone Number Provisioning
Search available phone numbers filtered by area code and lease a dedicated calling line. This number is associated with your workspace to place outbound agent calls and receive incoming customer calls.
Step 5: Provider Key Authorization
Authorise your cognitive AI accounts by inputting provider API keys (like Twilio, OpenAI, Gemini, or ElevenLabs). This ensures your workspace operates on a Bring Your Own Key model to manage direct cognitive expenses.
Twilio Carrier Integration
Learn how to link Twilio telephony accounts and assign calling phone lines.
CallVIQ communicates with your leased Twilio carrier numbers using low-latency WebSockets. Placing calls via your direct carrier account guarantees full control over calling numbers and outbound Caller IDs.
Step 1: Retrieve Twilio API Credentials
Log in to your Twilio Console. Locate the Project Info section and copy your **Account SID** and **Auth Token** credentials.
Step 2: Configure Workspace Telephony Settings
In your tenant dashboard, navigate to Settings ➔ Telephony Integration. Enter the copied Account SID and Auth Token, and click Save to link credentials.
Step 3: Link Phone Numbers
Once linked, navigate to the Numbers panel. Click **Buy a Number** or link existing numbers from your Twilio account to make them active outbound call sources in your workspace.
Step 4: Validate Media WebSockets
Test calling a sandbox number to verify that outbound media connections establish WebSockets with backend gateways successfully. This ensures bi-directional audio flows latency remains below 150ms.
AI Agent Builder & Playground
Configure voice agents, prompt guidelines, and test them in-browser.
The Agent Builder helps merchants customize their AI caller identities. Here you define prompt guidelines, operational boundaries, text-to-speech models, and test conversations in real-time before launch.
Step 1: Create a Custom Agent Profile
Navigate to Agents ➔ Create Agent. Name your caller profile and select an industry vertical (e.g. Sales, Appointment Booking, Support Routing) to populate default system guidelines.
Step 2: Write System Prompt Instructions
Enter the behavioral instructions the agent must follow. Detail product scripts, dynamic lead variable injections (e.g., customer name), slot options, fallback actions, and call objectives.
Step 3: Configure TTS Voice Models
Select your speech generation model (such as ElevenLabs, Cartesia, or OpenAI Voices). Adjust stability, speed, and similarity sliders to ensure vocal flows match the desired personality.
Step 4: Simulate Dialogs in the Playground
Click **Launch Playground** to run browser tests. Grant microphone permissions, select VAD (Voice Activity Detection) thresholds, and talk to your AI agent directly in the browser to refine latencies and prompt instructions.
No-Code Conversational Flow Builder
Map conversational flows with dynamic greetings, branches, and slot bookings.
The Flow Builder lets you map conversational structures visually using a drag-and-drop node graph canvas. Connect question nodes, evaluate user intent answers, schedule calendar slots, and transfer calls to support lines.
Step 1: Open the Flow Editor Canvas
Go to the Agent section and click **Edit Conversational Flow**. You will enter the visual node editor showing standard entry hooks.
Step 2: Define Greeting Triggers
Establish welcoming nodes (e.g. `Greeting Node`). Enter the greeting text the agent says when a customer answers the phone (e.g., "Hi, is this custom name?").
Step 3: Add Conditional Intent Nodes
Drag in intent nodes to branch dialogues based on user answers. Define parameters to check (e.g., if user response confirms appointment availability, route to calendar bookings, otherwise route to call exit).
Step 4: Add Calendar Reservation Nodes
Link slot reservation cards. The node calls connected calendar APIs (like Google Calendar) dynamically, reads open availability slots, suggests dates to the client, and records slot selections.
Step 5: Save and Publish Flow
Click **Save Flow** to compile and publish the dialog map. The dialer will run this configuration on all active dialing lists.
CRM & Lead Management
Import lead datasets, map custom variables, and manage list exclusions.
The Lead Management suite helps compile contact databases, map dynamic prompt variables, and filter out do-not-call numbers before campaigns launch.
Step 1: Upload Contact Lists
Navigate to Contacts ➔ Import Contacts. Select your CSV spreadsheet file from your local machine and start upload.
Step 2: Map Custom Field Columns
Associate your CSV header columns with platform variables. Map phone numbers, names, scheduled slots, and variables to insert inside AI prompts during calls.
Step 3: Define Excluded Contacts
Navigate to the Do Not Call (DNC) list. Enter specific contact numbers manually or upload exclusion lists to block numbers from dialing campaigns automatically.
Step 4: Group Leads into Playlists
Organize contacts into lists (e.g. Q3 Cold Leads, Inbound Inquiries). Link lists to campaign dialers to manage calls targeting target lists.
Campaigns & Dialer Pacing
Start calling campaigns and tune queue workers pacing rates.
Outbound campaigns execute automatic calls utilizing background queues. Tune calling speeds, concurrency limits, and retry intervals to match operational limits.
Step 1: Create a Call Campaign
Go to Campaigns ➔ Create Campaign. Name the campaign, select a target lead list, and associate an AI voice agent.
Step 2: Select Outbound Call Lines
Choose the phone numbers leased in Step 2 to use for outbound dialing. The system will rotate through select caller IDs during queue tasks.
Step 3: Adjust Concurrent calling Limits
Configure concurrency limits (e.g. max 10 concurrent lines). Pacing limits define call frequency to ensure server resources and API connection limits remain stable.
Step 4: Set Retries and Dialing Schedules
Configure call retry counts (e.g. try 3 times if client is busy) and scheduling intervals. Set allowed calling hours (e.g. 9:00 AM to 5:00 PM) to avoid placing calls outside local legal windows.
Step 5: Start and Track Dialing Queues
Click **Launch Campaign**. The background dialer queues calling jobs immediately. Watch dial statuses in real-time, reviewing active, busy, connected, and completed logs.
Audio, Transcripts & Ledgers
Audit call histories, listen to stereos, read transcripts, and inspect cost ledgers.
Every call placed by CallVIQ records dialogue details, audio files, turn-by-turn text dialogs, sentiment outcome tags, and custom transaction costs.
Step 1: Navigate to Call History Log
Go to the **Call Logs** tab in your dashboard. You will see a chronological table listing dialed contacts, durations, and sentiment classifications.
Step 2: Review Dialogue Transcripts
Click on a call record log. The view displays a detailed turn-by-turn transcript (e.g. Caller vs Agent), highlighting customer sentiment changes and intent outcomes.
Step 3: Play Call Audio Recordings
Use the media controls widget on the call log view to stream stereo recordings saved to secure S3 storage. Play, pause, or download audio recordings.
Step 4: Inspect Pricing Ledgers
Check the cost breakdown summary for each call. Inspect the direct carrier connection charge, LLM query token processing fees, and speech generation fees to monitor exact operational expenses.
Stripe Billing & Wallet Management
Configure wallet credits top-ups, transaction logs, and auto-recharge settings.
CallVIQ workspace budgets utilize a virtual wallet system. Manage calling budgets using manual transactions or automated funding rules configured via Stripe.
Step 1: Access Billing Settings
Go to the **Billing** tab in your sidebar. The dashboard shows active plans, current wallet balances, and recent payment lists.
Step 2: Fund Wallet Balance
Click **Add Funds** in the Wallet box. Input the desired funding amount (e.g. $100). The dashboard initiates Stripe Checkout to process the transaction and increment calling credits instantly.
Step 3: Set Auto-Recharge Thresholds
Toggle the **Auto-Recharge** switch. Set a threshold limit (e.g., if wallet drops below $10) and target reload amounts (e.g., purchase $50 automatically). This guarantees dialing campaigns do not pause due to low balances.
Step 4: Download Billing Invoices
Review the transaction history table at the bottom of the page. Click download to fetch PDFs of recent Stripe payments and invoices.
Tenant Directory & Impersonation
Manage tenant workspaces, configure statuses, and impersonate workspaces to troubleshoot setups.
The Tenant Directory is the core admin control panel for supervising active workspaces on your platform. Operators can configure accounts, review limits, and access individual dashboards dynamically.
Step 1: Access Tenant Directory
Go to the Tenants tab in the Super Admin sidebar. The UI dashboard displays a paginated list of all active, suspended, and deleted workspaces.
Step 2: Suspend, Reset, or Modify Tenant Accounts
Select any tenant row to manage active configurations. Click **Suspend Account** to pause calling services instantly, or **Soft Delete** to queue data deletion after 30 days.
Step 3: Secure Impersonation Bridge
Click the **Impersonate** button on a tenant card. The platform securely opens the workspace console as the select merchant. This lets you debug agent builders, test phone connections, and check pricing ledgers without exposing user passwords.
Step 4: Top Up Wallet Balance Manually
Click **Adjust Wallet** in the tenant settings sheet. Enter a credit amount (such as $50.00) to top up their dialer funds manually for testing or customer support balance refunds.
Subscription & Plan Builder
Create custom pricing plan packages, set resource restrictions, and bind Stripe IDs.
Construct subscription pricing packages that control tenant workspace allowances. The plan limits automatically throttle campaigns, contact lists, and API access keys.
Step 1: Create a Pricing Plan
Navigate to Plans ➔ Create Plan in the Super Admin console. Input a plan package name (e.g. Professional Plan) and standard package descriptions.
Step 2: Bind Stripe Pricing Identifiers
Input matching Stripe Price IDs (monthly and annual) in the pricing settings. This links customer subscription checkout pages to automatic Stripe billing webhooks.
Step 3: Define Resource Limits
Set resource caps to constrain operational footprints: adjust max concurrent call channels, total contact list uploads, daily dialing queues, and call recording storage gigabytes.
Step 4: Set Feature Flags and Overage Billing
Toggle premium features (like custom outbound Webhooks or Google Workspace integrations). Define credit overage fees (e.g. $0.05 per call minute) for tenants who exceed included call credit bundles.
White-Labeling & Branding Settings
Configure dynamically white-labeled logos, color themes, titles, and legal pages.
CallVIQ is built for complete white-label branding. Super Admins can customize the visual footprint dynamically across the login screens, email templates, and dashboards.
Step 1: Access Branding Panel
Go to the Settings ➔ Branding Settings tab in the Super Admin dashboard to access the visual white-label console.
Step 2: Upload Visual Assets
Upload brand SVG logo files, square navbar logos, and browser favicon icons. The theme asset engine updates all public login routes, tenant headers, and transactional emails instantly.
Step 3: Define Custom Color Theme
Select brand color themes using the hex input panels. Define primary focus values, secondary text hover styles, and sidebar dark accents to modify styles across the UI.
Step 4: Update Provider Service Keys
Set platform-wide default API keys (like OpenAI or Cartesia) to offer out-of-the-box system engines. Tenants on default subscription tiers will consume these shared keys until they select a BYOK option.
System Health & Queue Monitoring
Track platform performance metrics, check CPU/RAM usage, and manage background tasks.
Supervise backend server loads and task worker queues to guarantee maximum platform stability during heavy outbound dialer campaigns.
Step 1: Check KPI Dashboards
Access the main Super Admin screen to monitor overall performance indices. Track monthly recurring revenue metrics, customer count curves, and system call durations.
Step 2: Monitor Server Resource Dials
Review real-time circular charts listing CPU, memory allocation, and storage capacities to monitor server infrastructure metrics.
Step 3: Audit BullMQ Task Queues
Go to the Queue Monitor panel. The interface displays active, paused, delayed, and failed dialer jobs executing in the background Redis database.
Step 4: Administer Queue Failures
If queues stall due to network exceptions or credential failures, use the control dashboard: select failed tasks and click **Retry Jobs**, or click **Purge Queue** to prevent system locks.