OpenAI GPT3 x Airtable x Make: Low Code Smart Contact Form

Previously, we create a simple web contact form using Airtable. Today, let us try to make the contact form smarter by introducing OpenAI GPT-3, the AI will help us to rank the comments from visitor, and generate a possible response text to us.

This will help to reduce the man-hours spent on analyzing the comments, and draft the response back to the visitor.

For the smart contact form solution, we going to use 3 tools to built it, which required minimum coding, within 5 minutes!

Here are the breakdown for the tools’ purpose, in sequence where the actions occurred

  1. Airtable
  2. Make
  3. OpenAI GPT-3

Quick run-through

Pre-requisite check

  • Initial requirement

    Let’s look at how it started, as well as the initial design

  • Backend

    • OpenAI GPT-3: Served as AI brain which handling the response
    • Airtable: Served as front end to accept comments, and the database to store the final result
    • Make: Served as integrator which “glue” different system together
  • Platform

    • OpenAI GPT-3: SAAS Model
    • Airtable: SAAS Model
    • Make: SAAS Model
  • Account

    • OpenAI GPT-3: Required a paid account
    • Airtable: Required a basic free account
    • Make: Required a basic free account
  • Cost

    • OpenAI GPT-3: Required a paid account, you may check the pricing info here.
    • Airtable: Required a basic free account, you may check the pricing info here.
    • Make: Required a basic free account, you may check the pricing info here.
  • Programming Required

    You need to know some basic REST API concept for OpenAI.

Applications Flow

  • null

    Airtable

    Served as frontend contact form, as well as backend database

  • null

    Make

    It is platform that connect different applications, without coding! Other than connect different application using connector, it also provide a webhook for other application send in the data

  • null

    OpenAI GPT-3

    Identify the tone of the feedback, and suggest a response based on the feedback

Limitation

At the time when this article being published, Make’s 1 connector are under beta stage, which are OpenAI connector. As far as I tested, the connector works great.

Let's get started

OpenAI GPT-3

1. To get the OpenAI to work, let’s start by creating an account. Once you done that, create an API keys within your account.

2. Next, record down the Origanization ID

 

3. You are done with OpenAI here for now, let’s move on to next step.

Airtable

1. We cover the building contact form with Airtable before, to refresh your memory, you may refer to here. For now, let’s just create a base for contact form.

2. Let’s create the fields similar as contact form we created just now using Contact Form 7, with additional 2 fields

  • Type: The type of the feedback from visitors which categorized into Spam, Angry or Happy.
  • Suggestion: Suggested response text from AI
  • Timestamp: We will pull the data from Airtable by scheduled job, hence a timestamp field is important for data comparison.

 

3. Now, let’s create a form with Airtable, and remove the unwanted fields from the form: type and suggestion, as it will fill up by AI.

 

 

3. The final step with Airtable is, to get the API key for integration. Please take note the API Key going to deprecated by Jan 2024.

Make

1. Create a “Scenario” in Make, let’s start with a first step by creating a connector for Airtable.

 

2. The action we required are to watch any records being created in Airtable. Again, I would like to remind that, for this use case, we will need to create a schedule job to pull the data, hence the timestamp is crucial. For make.com, the minimum scheduled time interval is 15 minutes.

 

 

3. Once you setup the connector’s connection, here is the place you enter Airtable API Token.

 

4. Let’s configure the Airtable connector

  • Base: The database you created in Airtable
  • Table: The table you created within the database for contact form
  • Triggered field: The timestamp field, to compare the records’ creation time vs. last pulling date/time
  • Label field: The “re-presentative” field

 

5. Next, let’s create a OpenAI GPT-3 connector. You will need to provide the API Key, and the Organization ID here.

 

6. For the connector OpenAI GPT-3, let’s select the actions “Create a Completion”

 

7. Let’s setup some default parameters

  • Model: The engine we will be using, in this case is “text-davinci-003”. Please take note the charges of each engine is vary
  • Prompt: The question we wish to “ask” OpenAI
  • Max Tokens: The number of characters to send, and to receive. To understand more, please see here.
  • Temperature: Let’s set as default, 0.7
  • Top P: Let’s set as default, 1

In order to let OpenAI GPT-3 work with other application, we have to “guide” it and ask the right question, else it will response with long winded answer which you need read between the words.

Below is how I enter the question in the prompt, mixed with the variable from Contact Form 7:

Tell me if this comment is a Spam, or Angry, Good, or Unknown? Please recommend a professional response, please response your answer in JSON format, which having 2 nodes, type and suggestion. Here is the comment: [THE-CONTACT-FORM-7-MESSAGE]

 

It basically tell the OpenAI to

  • Is the feedback is Spam, Angry or Happy, I call it as “type of the message”
  • Suggest a response to the feedback
  • Return the answer in JSON, so other application able to read it with ease.

 

 

8. Once we done with the setup of OpenAI GPT-3, we will need to run it for the first time to get the response.

As the Airtable required to pull, so the steps will be

  1. Go back to Airtable, open the form, and start key in the feedback via contact form, let’s be a nice person this time shall we?
  2. Run the scenario in make.com, it will pull data immediately – don’t need to wait for 15 minutes.

 

9. If the contact form setup properly, the webhook should be triggered and data should received at Make. You will see the “1” on each circle below.

 

10. Click on the “1” at the top right of the OpenAI GPT-3 bubble, you shall see the pop which having input and output. You can troubleshoot the data from Airtable, and the response from OpenAI GPT-3.

With the response sample from OpenAI GPT-3, you will be able to move to next step, which is to form into a valid JSON from the string.

 

11. The response from OpenAI GPT-3 is a text, hence we need to form into a valid JSON object, to do this, we have to use “Parse JSON”

 

12. To parse the JSON, we need to create a similar JSON object structure. Please take note, the JSON structure  that OpenAI return as a text, need to be the same as JSON object structure we going to parse.

Hence, it is always good to keep it simple and stupid.

In this case, the JSON structure we are having is

{
  "type": "FEEDBACK-MOOD-RETURN-FROM-OPENAI",
  "suggestion": "SUGGESTION-TEXT-RETURN-FROM-OPENAI"
}

 

13. Once you define the JSON object structure, under the “JSON string”, click the response from pop up, which indicate response from OpenAI GPT-3 connector.

In this case, it is

Choices[].text

 

 

14. Final connector! Let’s create the connector for Airtable, as we will update the response from OpenAI GPT-3 back to Airtable.

 

15. You may use back the same Airtable connection you created in previous step 3

16. We shall select the data from Airtable, and JSON object from OpenAI GPT-3, and map to the Airtable table – we created previously.

 

17. We shall done for the entire setup, let’s give it a try.

Let's try it out

1. The entire setup in Make should look like below

 

2. Let’s go back to Airtable to submit some feedback, you can use the sample response text I provide here. Sometime, the OpenAI GPT-3 may run into below issue, in this case, just increase the Max Token may solve the issue – that could be due to send out words and response words are exceed the Max Token.

We start with good feedback

Then, an angry customer’s feedback

Then, a spam

 

3. Once you done with the form submission, go back to make.com and click on the Run Once at the bottom left, as we submitted 3 feedback, hence you shall see the bubble with 3 for OpenAI GPT-3 connector, JSON connector, and Airtable (updating) connector.

It indicate run successfully.

 

4. We shall check the Airtable now, and you can see the data are in, including the suggestion from OpenAI GPT-3, amazing! Isn’t it?

 

5. Lastly, just turn on the scenarios, so that it can switch into Live mode, and wait for every 15min to pull data from Airtable . You basically have an AI powered smart contact form, which able to help the admin speed up the customers response work!

Although the suggestion from OpenAI GPT-3 can be handy, but it shouldn’t send out directly to the visitors, as I notice sometime the suggestion that OpenAI response are for the admin, not the visitors. In this case, I would suggest that admin should at least check thru the suggestion before sending out to visitor.

For spam, if the message is too vague, OpenAI GPT-3 also can’t determine clearly.

Please take note, at this moment (when this article being published), the Make connector for OpenAI GPT-3
Leave a Reply

Your email address will not be published. Required fields are marked *

Prev
OpenAI GPT3 x CF7 x Make x NocoDB: Low Code Smart Contact Form

OpenAI GPT3 x CF7 x Make x NocoDB: Low Code Smart Contact Form

AI no longer a rocket science, with the help of Make, we are now able to make

Next
Building Smart Customer Service using AI with Low Code

Building Smart Customer Service using AI with Low Code

Each company having different policy, or approach, or SOP when come to customer

You May Also Like
Total
0
Share