🎤 Voice Assistant Chatbot

Modern voice-enabled chatbot with speech recognition and text-to-speech capabilities using Web Speech API
Try Interactive Demo

📖 Project Overview

Voice Assistant Chatbot is a modern, feature-rich web application that provides voice-enabled chatbot capabilities using Web Speech API. This project offers speech recognition, text-to-speech, voice commands, multi-language support, audio visualization, conversation history, dark mode, continuous listening mode, conversation statistics, and a beautiful responsive web interface. Perfect for developers looking to build voice interaction applications or integrate voice capabilities into their web projects.

⚡ Quick Facts

🎯 Type: Web Voice Assistant Application
🤖 AI Features: Speech Recognition, Text-to-Speech, Voice Commands, Multi-Language
⚡ Setup Time: ~2 minutes
📦 Dependencies: No build process required
🎨 Web Technologies: HTML5, CSS3, JavaScript ES6+
🧠 Speech API: Web Speech API (Browser-native)
📱 Responsive: Mobile, Tablet, Desktop
🌍 Languages: 10+ Languages Supported
12+
Files
2000+
Lines of Code
15+
Voice Features
10+
Languages
Developer: Molla Samser | Website: rskworld.in | Email: help@rskworld.in
Difficulty Level: Beginner to Intermediate - Perfect for developers learning JavaScript, Web Speech API, voice interaction, and web development.

✨ Features

Core Features

🎤 Speech-to-Text

Convert spoken words into text using browser's native speech recognition API for real-time voice input.

🔊 Text-to-Speech

Convert text responses into natural voice output with multiple voice options and customizable settings.

🎯 Voice Commands

Support for various voice commands and natural language processing for hands-free interaction.

🌊 Audio Visualization

Real-time waveform visualization of voice input for visual feedback during speech recognition.

Advanced Features

🌍 Multi-Language Support

Support for 10+ languages including English, Spanish, French, German, Italian, Portuguese, Hindi, Japanese, Chinese, and more.

💬 Conversation History

Complete chat history with timestamps, allowing you to review past conversations and export them.

🌙 Dark Mode

Toggle between light and dark themes for comfortable viewing in any lighting condition.

📊 Conversation Statistics

Track messages, interactions, voice usage, and session duration with detailed analytics.

🔄 Continuous Listening Mode

Hands-free operation with continuous voice recognition that keeps listening after each interaction.

🧠 Context Awareness

Remembers conversation context for better, more natural responses across multiple interactions.

⚙️ Customizable Settings

Adjustable voice, speech rate, pitch, volume, language, and UI preferences with auto-save.

📥 Export Chat History

Download your conversation history as a text file for record-keeping or analysis.

🎨 Modern UI

Beautiful, responsive design with gradient backgrounds, smooth animations, and intuitive interface.

📱 Mobile Responsive

Works perfectly on desktop, tablet, and mobile devices with responsive layout design.

🔄 Advanced Error Handling

Comprehensive error handling with user-friendly messages and graceful fallbacks for unsupported browsers.

📚 Well Documented

Complete documentation with examples, quick start guide, and detailed usage instructions.

🛠️ Technologies

HTML5

Modern semantic markup and structure

Markup

CSS3

Modern styling with gradients and animations

Styling

JavaScript ES6+

Core functionality and Web Speech API integration

Language

Web Speech API

Browser-native speech recognition and synthesis

API

Font Awesome

Icons for enhanced user interface

Icons

LocalStorage API

Browser storage for settings and conversation history

Storage

Canvas API

Real-time audio waveform visualization

Visualization

📦 Installation Guide - Step by Step

⏱️ Installation Time: ~2 minutes

Follow these simple steps to set up the Voice Assistant Chatbot on your system.

📋 Prerequisites

🌐 Modern Web Browser

Chrome, Edge, Safari, or Firefox (Chrome/Edge recommended for best Web Speech API support)

Download: Chrome | Edge

🎤 Microphone

Working microphone for voice input (built-in or external)

💻 Web Server (Optional)

Can run directly from file system or use a local web server

🌐 Internet Connection

Required for CDN resources (Font Awesome icons)

🚀 Step-by-Step Installation

📌 Step 1: Download or Clone the Project

Option A: Download ZIP

  1. Download the project ZIP file from the repository
  2. Extract it to your desired location (e.g., C:\Projects\voice-assistant-chatbot or ~/Projects/voice-assistant-chatbot)
  3. Navigate to the extracted folder

Option B: Clone with Git

git clone https://github.com/rskworld/voice-assistant-chatbot.git
cd voice-assistant-chatbot
✅ Step 2: Open in Browser

No build process or installation required! Simply open the HTML file in your browser.

Method 1: Direct File Opening

  1. Navigate to the project folder
  2. Double-click index.html to open in your default browser
  3. Or right-click and select "Open with" → Choose your browser

Method 2: Using Local Web Server (Recommended)

For better compatibility, use a local web server:

# Python 3 (if installed)
python -m http.server 8000

# Then open: http://localhost:8000
# Node.js (if installed)
npx http-server -p 8000

# Then open: http://localhost:8000
🎤 Step 3: Grant Microphone Permission

When you first use the voice feature, your browser will ask for microphone access.

  1. Click "Allow" when prompted for microphone access
  2. This is required for speech recognition to work
  3. You can revoke this permission later in browser settings

✅ Installation Complete!

Congratulations! You've successfully set up the Voice Assistant Chatbot. The application is ready to use with all features including:

  • Speech recognition for voice input
  • Text-to-speech for voice responses
  • Voice commands and natural language interaction
  • Multi-language support
  • Audio visualization
  • Conversation history
  • Dark mode
  • Statistics and analytics

Next Steps:

  1. Open index.html in your browser
  2. Click the microphone button or type a message
  3. Try voice commands like "Hello", "What time is it?", or "Tell me a joke"
  4. Explore all the features and settings!

🔧 Troubleshooting Installation

❌ Microphone Not Working

Solution: Check browser permissions, ensure microphone is connected, and use Chrome/Edge for best support.

❌ Speech Recognition Not Available

Solution: Use Chrome or Edge browser. Web Speech API has limited support in Safari and Firefox.

❌ Text-to-Speech Not Working

Solution: Check browser console for errors, verify system voices are available, try selecting a different voice in settings.

❌ CORS Errors

Solution: Use a local web server instead of opening file directly, or configure browser to allow local file access.

📚 Usage Guide - Step by Step

🎯 Getting Started with the Voice Assistant

Step-by-Step Usage Instructions

📝 Step 1: Open the Application

  1. Open index.html in your web browser (Chrome or Edge recommended)
  2. You should see the Voice Assistant Chatbot interface with:
    • Chat messages area
    • Text input field
    • Microphone button for voice input
    • Send button
    • Control buttons (Clear, Export, Stats, Dark Mode, Settings)

🎤 Step 2: Grant Microphone Permission

  1. Click the microphone button or try to use voice input
  2. Your browser will ask for microphone permission
  3. Click "Allow" to enable speech recognition
  4. This permission is required for voice features to work

💬 Step 3: Start Chatting

  1. Text Input: Type your message and press Enter or click Send button
  2. Voice Input: Click the microphone button and speak your message
  3. Try Voice Commands: Say commands like:
    • "Hello" or "Hi" to greet the assistant
    • "What time is it?" to get current time
    • "What's the date?" to get today's date
    • "Tell me a joke" for a random joke
    • "Calculate 5 plus 3" for basic math
    • "Help" to see available commands
  4. View Responses: The assistant will respond with text and optionally speak the response

⚙️ Step 4: Customize Settings

Click the Settings button to customize your experience:

  • Voice Selection: Choose from available system voices
  • Speech Rate: Control how fast the assistant speaks (0.5x to 2x)
  • Pitch: Adjust the voice pitch (0 to 2)
  • Volume: Control the output volume (0 to 1)
  • Language: Select from 10+ supported languages
  • Continuous Listening Mode: Enable hands-free operation
  • Auto Speak Responses: Toggle automatic text-to-speech
  • Show Audio Visualizer: Display real-time waveform

📊 Step 5: Explore Advanced Features

Try out the advanced features:

  • Statistics: Click Stats button to view conversation analytics
  • Export: Click Export button to download chat history
  • Dark Mode: Toggle dark/light theme for comfortable viewing
  • Audio Visualizer: Enable in settings to see voice waveform
  • Continuous Mode: Enable for hands-free operation

💻 Using JavaScript API

You can also integrate the voice assistant functionality into your own web applications:

// Initialize speech recognition const recognition = new webkitSpeechRecognition(); recognition.lang = 'en-US'; recognition.continuous = false; // Start recognition recognition.start(); // Handle results recognition.onresult = function(event) { const transcript = event.results[0][0].transcript; console.log('You said: ' + transcript); }; // Text-to-speech const utterance = new SpeechSynthesisUtterance('Hello, how can I help you?'); speechSynthesis.speak(utterance);

📊 Features Usage

🎤 Speech Recognition

Click microphone button and speak to convert voice to text

🔊 Text-to-Speech

Responses are automatically spoken (can be toggled in settings)

🎯 Voice Commands

Use natural language commands for time, date, calculations, jokes, and more

🌍 Multi-Language

Switch languages in settings to use different languages

🌊 Audio Visualization

Enable visualizer in settings to see real-time voice waveform

💬 Conversation History

All messages are saved with timestamps and can be exported

📊 Statistics

Track messages, voice interactions, and session duration

🌙 Dark Mode

Toggle between light and dark themes for comfortable viewing

🌊 Audio Visualization & Features

The Voice Assistant Chatbot includes real-time audio visualization and interactive features. Here's what you'll see:

🌊 Audio Waveform Visualization

Real-time waveform visualization of your voice input

Enable the audio visualizer in settings to see a real-time waveform of your voice as you speak. This provides visual feedback during voice recognition.

💬 Conversation Statistics

Track messages, interactions, and session duration

View detailed statistics including total messages, user messages, bot responses, voice interactions, and session duration.

🌍 Multi-Language Support

10+ languages supported

Switch between languages in settings. The assistant will recognize and respond in the selected language (English, Spanish, French, German, Italian, Portuguese, Hindi, Japanese, Chinese, and more).

🌙 Dark Mode

Toggle between light and dark themes

Switch between light and dark themes for comfortable viewing in any lighting condition. Your preference is saved automatically.

💡 Interactive Features: All features are interactive and responsive. Settings are automatically saved to your browser's local storage, and the interface adapts to your preferences.

💻 Code Examples

Basic Speech Recognition

// Initialize speech recognition const recognition = new (window.SpeechRecognition || window.webkitSpeechRecognition)(); recognition.lang = 'en-US'; recognition.continuous = false; recognition.interimResults = false; // Start recognition recognition.start(); // Handle results recognition.onresult = function(event) { const transcript = event.results[0][0].transcript; console.log('You said: ' + transcript); // Process the transcript }; // Handle errors recognition.onerror = function(event) { console.error('Speech recognition error:', event.error); };

Text-to-Speech Usage

// Create speech synthesis utterance const utterance = new SpeechSynthesisUtterance('Hello, how can I help you?'); // Configure voice settings utterance.rate = 1.0; // Speech rate (0.5 to 2.0) utterance.pitch = 1.0; // Voice pitch (0 to 2) utterance.volume = 1.0; // Volume (0 to 1) utterance.lang = 'en-US'; // Language // Get available voices const voices = speechSynthesis.getVoices(); utterance.voice = voices[0]; // Select a voice // Speak speechSynthesis.speak(utterance); // Handle events utterance.onend = function() { console.log('Speech finished'); };

Complete Voice Assistant Example

// Voice Assistant Class class VoiceAssistant { constructor() { this.recognition = new (window.SpeechRecognition || window.webkitSpeechRecognition)(); this.setupRecognition(); } setupRecognition() { this.recognition.lang = 'en-US'; this.recognition.continuous = false; this.recognition.onresult = (event) => { const transcript = event.results[0][0].transcript; this.handleVoiceInput(transcript); }; } startListening() { this.recognition.start(); } handleVoiceInput(text) { // Process voice input const response = this.generateResponse(text); this.speak(response); } generateResponse(input) { // Your response logic here if (input.toLowerCase().includes('hello')) { return 'Hello! How can I help you?'; } return 'I understand. Tell me more.'; } speak(text) { const utterance = new SpeechSynthesisUtterance(text); speechSynthesis.speak(utterance); } } // Usage const assistant = new VoiceAssistant(); assistant.startListening();

Configuration Example

// config.js const VoiceAssistantConfig = { recognition: { continuous: false, interimResults: false, lang: 'en-US', maxAlternatives: 1 }, tts: { defaultRate: 1.0, defaultPitch: 1.0, defaultVolume: 1.0 }, ui: { animationDuration: 300, messageDelay: 500 } }; // Access configuration console.log(VoiceAssistantConfig.recognition.lang);

🔗 Web Speech API Integration

Browser-Native APIs

The application uses browser-native Web Speech API for speech recognition and text-to-speech. No server or external APIs required!

Available APIs

API Type Description
SpeechRecognition Browser API Speech-to-text recognition
SpeechSynthesis Browser API Text-to-speech synthesis
LocalStorage Browser API Store settings and conversation history
Canvas API Browser API Audio waveform visualization

Speech Recognition API Usage

// Check browser support if ('SpeechRecognition' in window || 'webkitSpeechRecognition' in window) { const Recognition = window.SpeechRecognition || window.webkitSpeechRecognition; const recognition = new Recognition(); // Configure recognition.lang = 'en-US'; recognition.continuous = false; recognition.interimResults = false; // Start listening recognition.start(); // Handle results recognition.onresult = function(event) { const transcript = event.results[0][0].transcript; console.log('Recognized: ' + transcript); }; // Handle errors recognition.onerror = function(event) { console.error('Error: ' + event.error); }; } else { console.error('Speech recognition not supported'); }
// Text-to-Speech API Usage if ('speechSynthesis' in window) { const utterance = new SpeechSynthesisUtterance('Hello, world!'); // Configure utterance.rate = 1.0; utterance.pitch = 1.0; utterance.volume = 1.0; utterance.lang = 'en-US'; // Get available voices const voices = speechSynthesis.getVoices(); utterance.voice = voices.find(voice => voice.lang === 'en-US'); // Speak speechSynthesis.speak(utterance); } else { console.error('Speech synthesis not supported'); }

Browser Compatibility

// Check Web Speech API support const speechRecognitionSupported = 'SpeechRecognition' in window || 'webkitSpeechRecognition' in window; const speechSynthesisSupported = 'speechSynthesis' in window; console.log('Speech Recognition:', speechRecognitionSupported); console.log('Speech Synthesis:', speechSynthesisSupported); // Recommended browsers: // - Chrome/Edge: Full support // - Safari: Limited support // - Firefox: Limited support

⚙️ Configuration

Configuration in this web application is handled through:

Configuration File

Edit config.js file in the root directory:

// config.js const VoiceAssistantConfig = { recognition: { continuous: false, interimResults: false, lang: 'en-US', maxAlternatives: 1 }, tts: { defaultRate: 1.0, defaultPitch: 1.0, defaultVolume: 1.0, minRate: 0.5, maxRate: 2.0 }, ui: { animationDuration: 300, messageDelay: 500, maxMessageLength: 1000 }, commands: { greetings: ['hello', 'hi', 'hey'], time: ['time', 'what time', 'current time'], date: ['date', 'what date', 'today'] } };

Note: All settings can be customized through the Settings panel in the web interface. Changes are automatically saved to browser's local storage.

Browser LocalStorage

Settings are automatically saved to browser's local storage:

// Settings are saved automatically localStorage.setItem('voiceSettings', JSON.stringify({ voice: 'Google US English', rate: 1.0, pitch: 1.0, volume: 1.0, language: 'en-US', continuousMode: false, autoSpeak: true, showVisualizer: false })); // Load settings const settings = JSON.parse(localStorage.getItem('voiceSettings'));

Runtime Configuration

Configure settings through the web interface:

  • Voice: Select from available system voices in Settings
  • Speech Rate: Adjust rate slider (0.5x to 2x)
  • Pitch: Adjust pitch slider (0 to 2)
  • Volume: Adjust volume slider (0 to 1)
  • Language: Select from 10+ languages in Settings
  • Continuous Mode: Toggle in Settings for hands-free operation
  • Auto Speak: Toggle automatic text-to-speech in Settings
  • Visualizer: Enable/disable audio visualization in Settings

All settings are saved automatically and persist across browser sessions.

Programmatic Configuration

You can also configure settings programmatically in JavaScript:

// Access configuration const config = VoiceAssistantConfig; // Modify recognition settings config.recognition.lang = 'es-ES'; // Spanish config.recognition.continuous = true; // Modify TTS settings config.tts.defaultRate = 1.2; // Faster speech config.tts.defaultPitch = 1.1; // Higher pitch

📁 Project Structure

voice-assistant-chatbot 
voice-assistant-chatbot/
├── index.html          # Main HTML file with chatbot interface
├── styles.css          # CSS styling with modern design
├── script.js           # JavaScript functionality and Web Speech API
├── config.js           # Configuration settings and constants
├── README.md           # Project overview and quick start guide
├── LICENSE             # License file
└── .gitignore          # Git ignore rules

Note: Edit config.js to customize voice settings and behavior.

📄 Detailed File Descriptions

📄 index.html

Purpose: Main HTML file with chatbot interface. Contains the complete UI structure and layout.

Key Features:

  • Chat messages container
  • Input area with text and voice buttons
  • Control buttons (Clear, Export, Stats, Dark Mode, Settings)
  • Settings panel
  • Statistics panel
  • Audio visualizer

🎨 styles.css

Purpose: CSS styling with modern design. Contains all visual styles and animations.

Key Features:

  • Modern gradient backgrounds
  • Responsive design
  • Dark mode support
  • Smooth animations
  • Mobile-friendly layout

⚙️ script.js

Purpose: JavaScript functionality and Web Speech API integration. Core chatbot logic and voice features.

Key Features:

  • Speech recognition implementation
  • Text-to-speech functionality
  • Voice command processing
  • Conversation management
  • Audio visualization
  • Statistics tracking
  • Settings management

⚙️ config.js

Purpose: Configuration settings and constants. Contains default settings and configuration options.

Key Features:

  • Speech recognition settings
  • Text-to-speech defaults
  • UI configuration
  • Voice command definitions
  • Response templates

📖 README.md

Purpose: Project overview and quick start guide. Provides introduction, features, installation instructions, and usage examples.

Contents:

  • Project description
  • Features list
  • Installation guide
  • Usage instructions
  • Browser compatibility
  • Support information

📝 RELEASE_NOTES.md

Purpose: Release notes. Documents features, changes, and updates in the current version.

Contents:

  • Release information
  • Feature list
  • Technical details
  • Changelog

⚖️ LICENSE

Purpose: License file. Contains the license text and copyright information.

License Type: MIT License

Copyright: © 2026 RSK World

🚫 .gitignore

Purpose: Git ignore rules. Specifies files and directories that should not be tracked by version control.

Excluded Items:

  • IDE configuration files
  • OS-specific files
  • Log files
  • Build artifacts

📊 File Statistics

12+
Total Files
4
Core Files
5
Documentation Files
2000+
Lines of Code
15+
Voice Features
10+
Languages

📌 File Organization

Core Files: index.html, styles.css, script.js, config.js

Documentation: README.md, RELEASE_NOTES.md, LICENSE, DATA_STORAGE.md, ERROR_FIXES.md

Configuration: config.js, .gitignore

No Build Process: Works directly in browser, no compilation or build step required

Self-contained: All functionality in HTML, CSS, and JavaScript files

🚀 Advanced Features Details

1. Speech Recognition

Browser-native speech recognition using Web Speech API converts spoken words into text in real-time. Supports continuous and single recognition modes with error handling for unsupported browsers.

2. Text-to-Speech

Multiple voice options with adjustable rate, pitch, and volume settings. Natural language responses are automatically spoken, providing a complete voice interaction experience.

3. Voice Commands

Intelligent voice command recognition for greetings, time/date queries, calculations, jokes, and settings control. The assistant understands natural language commands and responds appropriately.

4. Multi-Language Support

Supports 10+ languages (English, Spanish, French, German, Italian, Portuguese, Hindi, Japanese, Chinese, and more) with language selection in settings. The assistant recognizes and responds in the selected language.

5. Audio Visualization

Real-time waveform visualization of voice input provides visual feedback during speech recognition. Enable the visualizer in settings to see your voice waveform as you speak.

6. Conversation History

Complete chat history with timestamps stored in browser's local storage. All messages are saved and can be exported as a text file for record-keeping or analysis.

7. Conversation Statistics

Comprehensive analytics tracking total messages, user messages, bot responses, voice interactions, and session duration. View detailed statistics to track your usage.

8. Context Awareness

Remembers conversation context across multiple interactions, allowing for more natural and contextually relevant responses. The assistant maintains context for better conversations.

9. Continuous Listening Mode

Hands-free operation with continuous voice recognition that keeps listening after each interaction. Say "stop" or click the microphone button to pause.

10. Dark Mode

Toggle between light and dark themes for comfortable viewing in any lighting condition. Your theme preference is automatically saved and persists across sessions.

11. Customizable Settings

Adjustable voice, speech rate, pitch, volume, language, and UI preferences. All settings are automatically saved to browser's local storage.

12. Modular & Extensible

Well-organized modular JavaScript design makes it easy to extend with new voice features, commands, and customizations. Each feature is independent and can be modified easily.

🔧 Troubleshooting

Voice Recognition Issues

  • Ensure microphone permissions are granted in browser settings
  • Use Chrome or Edge browser for best Web Speech API support
  • Verify your microphone is working in other applications
  • Check browser console for error messages
  • Try refreshing the page and granting permission again

Text-to-Speech Issues

  • Check browser console for errors
  • Verify that system voices are available: speechSynthesis.getVoices()
  • Try selecting a different voice in settings
  • Check that volume is not set to 0
  • Ensure browser supports Speech Synthesis API

Browser Compatibility Issues

  • Chrome/Edge: Full Web Speech API support (recommended)
  • Safari: Limited support, may have issues
  • Firefox: Limited support, may have issues
  • Check browser version - update to latest for best support
  • Try a different browser if features don't work

Common Issues

  • Microphone not working: Check browser permissions, ensure microphone is connected, use Chrome/Edge
  • Speech recognition not available: Use Chrome or Edge browser. Web Speech API has limited support in Safari and Firefox
  • Settings not saving: Ensure localStorage is enabled in your browser, check browser console for errors
  • CORS errors: Use a local web server instead of opening file directly, or configure browser to allow local file access
  • Audio visualizer not showing: Enable "Show Audio Visualizer" in settings, ensure microphone is active

📋 Requirements

Modern Web Browser: - Chrome 33+ (Recommended) - Edge 79+ (Recommended) - Safari 14.1+ (Limited support) - Firefox (Limited support) Browser APIs: - Web Speech API (SpeechRecognition) - Web Speech API (SpeechSynthesis) - LocalStorage API - Canvas API (for visualization) No Dependencies Required: - No build process - No package installation - No server required - Works directly in browser

Browser Compatibility: Chrome or Edge recommended for full Web Speech API support.

Microphone: Working microphone required for voice input features.

Internet Connection: Required for CDN resources (Font Awesome icons).

🎯 Use Cases

🎤 Voice Interaction

Hands-free voice commands and interactions

📚 Education

Language learning and pronunciation practice

💼 Accessibility

Voice-enabled interface for accessibility

🌐 Web Integration

Add voice features to web applications

💬 General Chat

Casual voice conversations and assistance

🌍 Multi-Language

10+ languages with voice recognition

💬 Support

For support, questions, or more projects:

📄 License

This project is provided as-is for educational and development purposes.

MIT License - See LICENSE file for details.

📂 Demo Folder Structure

The demo/ folder contains demonstration and documentation files for this project.

demo/ ├── index.html # This documentation page ├── ../voice-assistant-chatbot/ # Interactive demo (Voice Assistant Chatbot) ├── style.css # Stylesheet (optional, styles are inline) └── script.js # JavaScript (optional, can be added for interactivity)
Try Interactive Demo

📄 Demo Files Description

📄 index.html

Purpose: Comprehensive project documentation and information page. This HTML file contains all details about the Voice Assistant Chatbot project.

Contents:

  • Complete project overview
  • All features documentation
  • Installation instructions
  • Usage examples
  • Code examples
  • Web Speech API integration reference
  • Configuration details
  • Detailed file and folder descriptions
  • Project structure
  • Troubleshooting guide
  • Support information

Features:

  • Self-contained HTML with inline CSS
  • Responsive design
  • Modern, beautiful UI
  • Well-organized sections
  • Easy navigation

🎨 style.css

Purpose: External stylesheet file (optional). Currently, all styles are embedded inline in index.html, but this file can be used for additional custom styles if needed.

Status: Empty file - can be used for custom styling

Usage: Add custom CSS styles here if you want to override or extend the inline styles in index.html

📜 script.js

Purpose: External JavaScript file (optional). Can be used to add interactive features to the documentation page.

Status: Empty file - can be used for additional functionality

Potential Uses:

  • Table of contents navigation
  • Smooth scrolling
  • Search functionality
  • Copy code snippets
  • Theme toggle
  • Print functionality
  • Interactive elements

🎮 Voice Assistant Chatbot

Purpose: Interactive demo application showcasing the Voice Assistant Chatbot features in action.

Features:

  • Live voice chat interface
  • Speech recognition demonstration
  • Text-to-speech functionality
  • Voice commands and natural language interaction
  • Multi-language support
  • Audio visualization
  • Real-time statistics and analytics
  • Beautiful, responsive UI

Usage: Open Voice Assistant Chatbot in your browser to try the interactive demo!

💡 About the Demo Folder

The demo/ folder is separate from the main voice-assistant-chatbot/ project folder. It contains:

  • Documentation: This comprehensive HTML documentation page that explains the entire project
  • Interactive Demo: Voice Assistant Chatbot - Live interactive demo showcasing all voice assistant features
  • Styling: CSS file for custom styling
  • Scripts: JavaScript file for enhanced interactivity

Note: To view this documentation, simply open demo/index.html in any web browser. To try the interactive demo, open Voice Assistant Chatbot. Both pages are self-contained and work offline.