Create Your First Bot

​

Step 1: Create a New Bot

1. Log in to your QuickBot Dashboard
2. Click “Create New Bot”
3. Choose “Start from Scratch” or select a template
4. Name your bot “Customer Support Bot”
5. Click “Create Bot”

​

Step 2: Design the Welcome Flow

​

Add a Welcome Message

1. In the editor, you’ll see a starting block
2. Click on it to edit
3. Change it to an Agent Text Block
4. Add this welcome message:

👋 Hello! I'm your virtual assistant.
How can I help you today?

​

Add Menu Options

1. Connect a User Buttons Block after the welcome message
2. Add these button options:
   • “Product Information” → product_info
   • “Technical Support” → tech_support
   • “Billing Questions” → billing
   • “Speak to Human” → human_agent

​

Step 3: Create Response Paths

​

Product Information Path

1. Add a Logic Condition Block
2. Set condition: {{button_response}} === "product_info"
3. If True, connect an Agent Text Block:

Here's information about our products:

🚀 **QuickBot Pro** - Advanced features for enterprises
💼 **QuickBot Business** - Perfect for growing companies
🌟 **QuickBot Starter** - Great for small businesses

Would you like detailed pricing information?

4. Add User Buttons: “Yes, show pricing” and “No, thanks”

​

Technical Support Path

1. Add another Logic Condition Block
2. Set condition: {{button_response}} === "tech_support"
3. If True, connect a User Text Block:
   • Question: “Please describe the technical issue you’re experiencing”
   • Variable: tech_issue_description
4. Then add an Agent Text Block:

Thank you for describing your issue. I've noted:
"{{tech_issue_description}}"

Our technical team will review this and respond within 24 hours.
In the meantime, have you tried restarting the application?

​

Step 4: Add Data Collection

​

Contact Information Form

1. User Text Block - Name
   • Question: “What’s your name?”
   • Variable: user_name
2. User Email Block - Email
   • Question: “What’s your email address?”
   • Variable: user_email
3. User Text Block - Message
   • Question: “Please describe how we can help you”
   • Variable: user_message

​

Confirmation Message

Perfect! I've collected your information:

👤 Name: {{user_name}}
📧 Email: {{user_email}}
💬 Message: {{user_message}}

A human agent will contact you within 2 hours during business hours.
Is there anything else I can help you with?

​

Step 5: Test Your Bot

​

Use the Preview Feature

1. Click the “Preview” button in the top right
2. Test each conversation path:
   • Try all button combinations
   • Fill out the contact form
   • Verify variables are captured correctly
   • Check that messages display properly

​

Common Issues to Check

​

Step 6: Customize the Appearance

​

Theme Settings

1. Go to the Theme tab
2. Customize colors to match your brand:
   • Primary color: Your brand color
   • Background: Light or dark theme
   • Chat bubble colors
3. Upload your logo/avatar image
4. Adjust font settings

​

Custom CSS (Optional)

/* Make buttons more rounded */
.quickbot-button {
  border-radius: 25px;
  transition: all 0.3s ease;
}

.quickbot-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

​

Step 7: Advanced Features

​

Add Integrations

• Email Integration: Send notifications when users contact support
• Google Sheets: Log all conversations for analysis
• Webhook: Send data to your CRM or support system

​

Logic Improvements

• Business Hours Check: Route to different responses based on time
• User Type Detection: Customize responses for different user segments
• Follow-up Questions: Create branching conversations based on user responses

​

Next Steps