What is an AI Copilot Mode for Websites?
Imagine walking into a retail store and asking for help, but the clerk has their eyes closed. They don't know what aisle you are in or what product you are holding. That is how traditional chatbots operate. A screen-aware AI copilot changes everything by literally seeing what the user sees on their active viewport.
With Copilot Mode, the AI assistant breaks out of the chat bubble. It becomes a live website assistant that understands the user's DOM context, can inspect the elements they are interacting with, and can visually guide them around the page.
Table of Contents
- What is an AI Copilot Mode for Websites?
- Copilot Mode vs Traditional Chat Comparison
- Key Copilot Features & Capabilities
- Use Cases Across SaaS and E-commerce
- Enabling Copilot Mode in Chirps
- Key Takeaways
Copilot Mode vs Traditional Chat Comparison
| Capability | Standard Chat Bubble | Chirps AI Copilot Mode |
|---|---|---|
| Context Awareness | Limited to user-typed messages | Reads active URL, viewport elements & selection |
| User Interaction | Copy-pasting error messages manually | Click-and-highlight "Pencil Mode" element selection |
| Page Navigation | Pastes textual URLs to click | Visually scrolls page & highlights specific UI buttons |
| Error Resolution | Requires multiple back-and-forth prompts | Diagnoses error codes directly from active DOM state |
Key Copilot Features & Capabilities
- Pencil Mode & Element Selection: Users can click a "Pencil" icon to highlight specific paragraphs, images, or pricing tables they have questions about.
- Contextual Viewport Awareness: The AI automatically knows which URL the user is on and what elements are currently visible in their browser window.
- Visual Navigation: The AI can highlight buttons or scroll the page to guide the user to the right answer, reducing onboarding friction.
Pro Tip: Enable Copilot Pencil Mode on your checkout and onboarding pages. Visitors can click an error toast or disabled form field, and the AI will immediately explain how to unblock themselves.
Use Cases Across SaaS and E-commerce
- SaaS Onboarding: When users get stuck in complex workflows, a live website assistant can highlight the exact toggle or menu they need to click.
- E-commerce Product Comparison: Shoppers frequently compare products side-by-side. Copilot Mode can "look" at two products on screen and instantly highlight differences in specs or warranty terms.
Key Insight: Screen-aware AI eliminates user friction by allowing visitors to point directly at what confuses them instead of typing long explanations.
Enabling Copilot Mode in Chirps
Setting up an AI copilot mode for websites used to require heavy engineering. With Chirps, it is a simple toggle in your widget appearance settings. Once enabled, visitors can activate Copilot Mode from the attach menu (+), the call overlay, or by pressing the Escape key.
Key Takeaways
| Step | Action |
|---|---|
| Activation | Enable "Copilot Screen-Aware Mode" in Widget Settings. |
| Onboarding | Configure Pencil Mode on high-dropoff checkout steps. |
| Privacy | Native GDPR consent filtering ensures user privacy protection. |