# Build an AI Service Request Form for Your HVAC Company: video walkthrough > Watch the 8:59 video walkthrough of Build an AI Service Request Form for Your HVAC Company in Lovable and n8n: 15 chapters, the full transcript, and a… Source: https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video · Updated 2026-10-02 · Free from Stepthrough (https://learn.ynteractive.com) Updated October 2, 2026 Build a service request form in Lovable for Cedar Ridge Heating & Air and connect it to n8n — the AI agent sorts each job into repair, maintenance, install or emergency, saves the lead to Google Sheets and emails a confirmation. The whole lesson in 8:59, narrated step by step. **Simulated practice environment.** Recorded in Stepthrough’s simulated practice environment, not the live tool. Practice it yourself free at learn.ynteractive.com. 8:59 · 15 chapters · 87 steps · narrated with the lesson’s own voice-over ## How do you want to learn? - [Practice it step by step: Interactive, in a practice copy of Lovable and n8n, about 15 min](https://learn.ynteractive.com/modules/lovable-n8n-hvac) - [Watch the video: 8:59, narrated, with chapters](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video) - [Read the guide: 87 steps with screenshots](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/guide) Lesson overview: [Build an AI Service Request Form for Your HVAC Company](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n) ## Chapters Click a chapter to jump the video there. 1. [0:00 Intro: what you'll build](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=0) 2. [0:12 Sign up](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=12) 3. [0:26 Build the form](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=26) 4. [0:59 New workflow](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=59) 5. [1:11 Webhook trigger](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=71) 6. [1:55 AI Agent](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=115) 7. [3:12 Chat model](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=192) 8. [3:51 Sheets tool](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=231) 9. [4:05 Create the spreadsheet](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=245) 10. [4:44 Sheets tool](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=284) 11. [5:51 Gmail tool](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=351) 12. [6:44 Respond node](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=404) 13. [7:09 Publish](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=429) 14. [7:21 Add the secret](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=441) 15. [8:21 Test the form](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=501) ## Now do it yourself, free Watching is the warm-up. The interactive lesson puts you in a practice copy of Lovable and n8n: you do every step yourself, it checks your work, and “Do it for me” finishes any step you get stuck on. Nothing touches your real accounts. [Practice “Build an AI Service Request Form for Your HVAC Company” step by step](https://learn.ynteractive.com/modules/lovable-n8n-hvac) ## Full transcript ### Intro: what you'll build [0:00](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=0) It all comes together. A service request, form, in Lovable, proceed to ridge heating in air. Then an AI agent sorts each job, saves it to Google Sheets, and emails a confirmation. Let's build it. ### Sign up [0:11](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=11) In the first module you built a Custom GPT. In the second, you built an AI agent inside n8n. Now you are going to combine a real web app with an AI-powered backend. Lovable is a tool that builds web apps from a text description. Click get started for free. ### Build the form [0:26](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=26) This is your Lovable dashboard. Every project you build shows up here. Click start with a prompt to create a new one. [0:33](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=33) This prompt tells Lovable what to build: a clean service request form with name, email, what the customer needs, and phone, sending each request to an n8n webhook URL pulled from a secret config — not hardcoded. Click paste prompt. [0:47](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=47) Click build. Lovable reads your prompt, generates the code, and deploys a live web app. In a few seconds you have a working service request form. Now we build the AI workflow that handles each request. ### New workflow [0:59](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=59) Now you are in n8n. This is the workflow automation tool you used in the last module. This time, instead of a chat trigger, we are going to use a webhook — so the form can send data directly to n8n. Click create workflow. ### Webhook trigger [1:10](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=70) Every workflow starts with a trigger. Last time we used a chat trigger. This time we want a webhook — an HTTP endpoint the form can POST to. Click add first step. [1:20](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=80) On webhook call. A webhook is just a URL that waits for incoming data. When a homeowner submits the form, it sends their name, email, request, and phone as JSON to this webhook. [1:30](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=90) One important setting. By default, the webhook responds immediately, before the AI agent even runs. We need it to wait until the agent is done, so the form knows the submission succeeded. Click the respond dropdown. [1:41](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=101) Using respond to webhook node. This tells n8n: do not send a response yet. Wait until you hit a dedicated respond node further down the chain. That way the form gets a real confirmation after the AI agent has processed everything. [1:52](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=112) That is the webhook set up. Close the node. ### AI Agent [1:55](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=115) Now we decide what happens when the form data arrives. Click the plus on the right edge of the webhook. [2:01](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=121) AI Agent. Same node as last time, but now it handles form submissions instead of chat messages. It will read the form data, save it to Google Sheets, and send a personalized reply via Gmail. [2:11](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=131) This time the prompt does not come from a chat trigger — it comes from the webhook. We need to change the source so we can write our own prompt template. Click the source dropdown. [2:20](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=140) Define below. This lets us write a prompt that pulls the form fields directly from the webhook data. [2:26](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=146) Here is the prompt template. Those double curly braces are n8n expressions that pull the name, email, request, and phone from the webhook body, so the agent gets the real details every time. Click paste prompt template. [2:39](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=159) Now we need a system message — the standing instruction that tells the agent what to do with every submission. Click add option. [2:46](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=166) System message. This is where we tell the agent to save the lead to Google Sheets and send a reply email via Gmail. [2:53](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=173) Here is the system message. It tells the agent to sort each request into repair, maintenance, install, or emergency, save the lead with the Google Sheets tool, and email a confirmation that names the job type. Click paste system message. [3:06](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=186) The agent is configured. It knows to save to Sheets and reply via Gmail. Close the node. ### Chat model [3:11](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=191) The agent needs a model to think with. Click the plus under chat model. [3:15](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=195) OpenAI Chat Model. If you did the last module, this part will feel familiar. [3:19](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=199) Click the credential dropdown to connect your OpenAI API key. [3:23](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=203) Create new credential. If you already made one in the last module, you could pick it from the list. We will create a fresh one here. [3:28](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=208) Paste your OpenAI API key. If you followed the previous module, you already have one. If not, go to platform dot openai dot com, add credit, and create a key. [3:39](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=219) Hit save. n8n tests the connection and stores the key. [3:42](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=222) Now the model dropdown. [3:43](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=223) GPT five mini. Fast, cheap, and plenty smart for processing form submissions. [3:48](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=228) Model is wired up. Close it. ### Sheets tool [3:50](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=230) Now the tools. The system message told the agent to use Google Sheets and Gmail — but it cannot do either until we give it the actual tools. Click the plus under tool. [4:00](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=240) Google Sheets Tool. This lets the agent save form submissions as rows in a spreadsheet. ### Create the spreadsheet [4:05](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=245) Before we configure this node, we need to create the actual spreadsheet. Close this for now — we will come right back. [4:11](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=251) Switch to the Google Sheets tab. You need to create the spreadsheet that the Sheets node will write to. [4:16](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=256) Name it Leads — this is where every service request will go. [4:20](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=260) Now set up the column headers. These need to match the form fields. In A1, type Name. [4:24](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=264) B1 — Email. [4:26](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=266) C1 — Request. [4:27](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=267) And D1 — Phone. Four columns, matching exactly what the form sends: name, email, request, phone. [4:33](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=273) The spreadsheet is ready. Switch back to n8n and connect the Google Sheets node to it. [4:38](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=278) Double click the Google Sheets node to open it up again. Now we can connect it to the Leads spreadsheet. ### Sheets tool [4:43](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=283) Click the credential dropdown to connect your Google account. [4:46](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=286) Create new credential. This one uses Google OAuth, so it opens a credential window. [4:51](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=291) Click sign in with Google. This opens the Google account chooser. [4:54](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=294) Pick the Google account that owns the Leads spreadsheet. [4:58](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=298) Google is asking for permissions. Check the first box — this lets n8n read and write your spreadsheets. [5:03](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=303) Second box — Drive access so n8n can find your spreadsheets by name. [5:08](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=308) Last one — this lets Google connect to n8n as an external service. [5:12](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=312) All three checked. Click continue and Google hands the credential back to n8n. [5:17](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=317) Now pick the spreadsheet. Click the document dropdown. [5:20](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=320) Leads — this is the spreadsheet where every form submission gets saved as a row. [5:25](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=325) Click the sheet dropdown. [5:27](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=327) Sheet one. That is the only tab. [5:29](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=329) Now the column mapping. Each column in the spreadsheet has a purple button. Click it and the AI agent figures out what data goes there. Click the purple button next to Name. [5:38](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=338) Email. [5:39](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=339) Request. [5:41](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=341) And Phone. All four columns are now set to defined automatically by the model. [5:45](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=345) Sheets tool is fully configured — credential, spreadsheet, sheet, and column mapping. Close it. ### Gmail tool [5:51](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=351) The agent can save to Sheets now, but it also needs to send a reply email. Click the plus sign to add another tool. [5:56](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=356) Gmail Tool. This lets the agent send a personalized reply back to whoever submitted the form. [6:01](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=361) Click the credential dropdown. Gmail uses the same Google OAuth as Sheets. [6:06](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=366) Create new credential. Gmail needs its own Google OAuth credential. [6:10](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=370) Click sign in with Google. Same flow as before — Google account chooser then permissions. [6:15](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=375) Pick the Google account you want to send emails from. [6:18](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=378) Google is asking for permissions. Check the first box — this gives n8n full email access. [6:23](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=383) Second box — manage drafts and send emails. [6:26](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=386) Read, compose, and send. [6:28](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=388) View email message metadata. [6:30](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=390) View and modify but not delete. [6:32](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=392) Last one — view your email messages and settings. [6:35](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=395) All six checked. Click continue and Google hands the Gmail credential back to n8n. [6:40](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=400) Gmail is connected. The agent can now send emails. Close the node. ### Respond node [6:44](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=404) One last piece. Remember we told the webhook to wait for a respond node before sending back a reply? We need to add that node now. Click the plus on the right edge of the agent. [6:52](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=412) Respond to Webhook. When the agent finishes processing — saving to Sheets and sending the email — this node sends a success response back to the form, so the user sees a confirmation message instead of an error. [7:04](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=424) Nothing to configure. This node just sends back the response. Close it. ### Publish [7:08](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=428) The workflow is complete. Webhook trigger, AI agent with a model, Google Sheets, Gmail, and a respond node. Click publish to make it live. Once published, the webhook URL is active and ready to receive form submissions. ### Add the secret [7:20](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=440) The workflow is published, but Lovable still needs the webhook URL. Open the webhook node to copy it. [7:26](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=446) Switch to the production URL tab. The test URL only works during testing. The production URL is the one your published workflow uses. [7:34](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=454) Click the URL to copy it to your clipboard. You will paste this into Lovable so the form knows where to send data. [7:40](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=460) Got the URL. Close the node. [7:42](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=462) Switch back to Lovable. We need to paste the webhook URL into a secret so the form can reach the workflow. [7:48](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=468) To add a secret in Lovable, click More in the toolbar. This opens the Cloud settings where you can manage secrets. [7:54](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=474) This is the secrets page. The prompt told Lovable to reference a secret config value called N8N WEBHOOK URL instead of hardcoding it. Click paste secret name. [8:04](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=484) Now paste the production URL you copied from the webhook node. This is the live endpoint your form will POST to. Click paste webhook URL. [8:12](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=492) Click save. The Lovable app now knows where to send form submissions. The webhook URL is stored as a secret, not in the source code — exactly how it should be. ### Test the form [8:20](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=500) Time to test. Click Preview in the toolbar to see the form you built. [8:24](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=504) Fill out the form with sample data. Click the fill button to populate all the fields at once. [8:29](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=509) Click request service. The form posts the request to the n8n webhook. The agent sees a furnace blowing cold air in a cold house and tags it as an emergency, saves a row to Google Sheets, and emails a confirmation through Gmail. The respond node sends back a success message, and the form shows the confirmation. [8:46](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=526) The form submitted successfully. Now check the spreadsheet — click the Google Sheets tab to see the row the agent just wrote. [8:53](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/video?t=533) Simple as that. We show you and you do it. Sign up below to learn AI automation for free. [Read the step-by-step guide with screenshots](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n/guide) · [Build an AI Service Request Form for Your HVAC Company: lesson overview](https://learn.ynteractive.com/content/hvac-service-request-form-ai-lovable-n8n) · [All free videos](https://learn.ynteractive.com/content/videos)