Adventures in AI Coding: our in-house human-powered two-way chatbot

Most people's first thoughts of chatbots are of off-the-shelf solutions with monthly subscriptions that pile up.

For us, investing in another proprietary, one-size-fits-all platform, ??.

Instead, we approached building something especially ours hands-on. In this article, we'll explore the in-house custom chatbot we developed driven by our code + Cursor AI.

Why We Created an In-House Chatbot

No-Cost Solution

Continuous usage fees combined with additional feature charges, typical chatbot services can be costly and out of your control.

For a small business like 3tone Digital , these type of expenses can rapidly mount up. And, by offloading data to a third-party provider, you can have restricted customization and even ownership of your chat data.

Customization

We wanted a chatbot to represent us, something with local humor, lightweight, worked with our current processes, and offered unique user interactions.

Building it ourselves helped us to match the vision and tone of 3tone Digital, pun intended. Apart from giving us complete control over the features, this homemade method practically eliminates running expenses. Sweet!

The Tech Stack: Hand-Coded Meets Cursor AI

Rapid Iteration with Cursor AI (< 10 hours)

Our development method revolved around Cursor, an AI-powered coding tool that let us experiment and iterate versions quickly and locally.

From how messages are shown to how user inputs are handled to admin notifications.

Fine-Grained Control with Custom Code

Although AI might spur on innovation, we nevertheless hand-coded some parts to guarantee freedom and flexibility (and to stop Cursor from hallucinating multiple times).

There's a notification system, it manages off-hour answers, and record leads for next follow-up. Creating these elements ensures that they behave exactly as we want, with no alarms and no surprises.

Some Characteristics of the 3tone Digital Chatbot

Messages Sent Off-Hours

One feature of our chatbot is its time-based availability. Should someone strike up a conversation outside of business hours, the bot answers, “We're offline right now. We'll return at 9AM EST” This guarantees that guests understand when they should expect a human to pick up the discussion.

Humor + Local Flavor

We wanted the chatbot to feel personal and since a lot of our traffic is local, we used words that speak to our community, local jokes, and other references. Users wouldn't discover the warmth this provides from generic chat systems.

Alerts for Administrators

We get an instant email alert if a fresh chat begins or a lead is noted. This ensures that no chat goes unmet and that there is an unambiguous record of who contacted them, when they did, and what they sought.

Currently waiting for Twilio to accept our application so the messages are handled via SMS

Organizing and Exporting Chats

The WordPress database stores discussions for follow-up, analytics, or training future AI interactions. We also implemented an Export to CSV tool so we could rapidly get a lead and conversation record. Should we ever have to examine user searches in volume, we have the meat.

Integrated via a WordPress Shortcode

Using a shortcode, we can readily embed the chatbot on any page and the shortcode additionally takes arguments for switching between:

• Floating Mode: Users can inflate a tiny bubble on the lower corner to chat.
• Inline Layer: An embedded chat window visible exactly inside a page's content area.

[3tone-chatbot position="floating"]        

Mobile Responsive and Animated Presence

Our chatbot is made to fit mobile, desktop, and tablet. When we're “online,” an animation and a subtle green glow let users know we're ready to chat.

Instant Notes and Lead Capture

For people who want to start a conversation quickly, like “I need a website,” or “I have a general inquiry,” we've provided predefined quick messages.

This helps leads choose their proper conversational path. And, if a guest wants a more thorough contact, the chatbot gathers their email address so that we can follow up.

Phase Two: AI

Since we developed it ourselves, plugging in to the OpenAI API (or another) is easy:

• Natural Language Understanding: Let the bot more intelligibly parse and answer questions.
• Automated FAQs: The chatbot can identify user intent and provide tailored, quick responses for often asked queries.

We have set the foundation such that, without a significant rework, new AI capabilities can easily blend in.

Expanding Functionality

We started to include statistics dashboards showing peak chat periods, user behavior, and query patterns going ahead. Although the CSV outputs are useful, a more robust reporting tool would be nice.

Final + Deep Thoughts

Coding with AI is awesome and stupid, but mostly awesome. It saves a lot of time and allows you to balance creativity with time efficiency.

It's easy to mess everything up, but if you know what you're doing - and/or have enough tokens, the sky and your imagination is the limit.

Creating an internally homebrewed solution is a good choice if your company wants more control over consumer contacts or is experiencing sticker shock.

Want to experiment with something like this?

• Examine your requirements: Choose whether you wish to start with simple or straight into AI-driven features.
• Choose your tools: Cursor, an artificial intelligence coding aid, helps accelerate the first build.
• Give user experience attention: Local flavor, off-hours help, and friendly language count.
• Remember data handling: Decide early on how you want user communications stored and exported.