I Built an n8n AI Agent That Turns Data Into Beautiful Dashboards

0:00Imagine this, your n8n workflows are scraping website, your voice agents are talking to leads all day, and all that data ends up in a Google Sheet or a CRM. Rows, columns, numbers, useful, but not very intuitive. What if you could actually talk to that data instead? What if you could say, "Show me last week's performance." or "Top objections from prospects." and instantly get a beautiful interactive dashboard that explains everything at a glance. In this video, I'm going to show you exactly how to do that. We're going to build an AI agent inside n8n, connected to thesis.dev, which is a generative UI layer that turns your agents' responses

0:35into interactive components like charts, cards, tables, dashboards, slides, or reports with zero front-end work. I'll walk you through the setup step-by-step using a real data set from an n8n workflow, voice agent performance, lead data, call stats, all of it. By the end of this video, you won't just have numbers in a spreadsheet, you'll have a live visual cockpit for your n8n automations that actually help you make decisions. let's get started. All right, so I'm going to start with a quick demo, and then I'm going to show you how to build this thing step-by-step. By the way, if you just want this JSON file, just comment AI agent, and I'm going to

1:09send you a link to where you can just download or import this AI agent into your workflow. But again, I'm going to show you everything step-by-step. So, for the demo, I'm This is the data file that I have. This is the Google Sheet from a voice AI agent. So, this is what's being connected, or this Google

1:25Sheet is basically responding to that. So, as you can see right here, this is thesis.dev, which again I'm going to explain and show you exactly how to connect to this, but I asked it, "Compare last week's call volume with the previous 2 weeks." So, this is the chart that it showed up. There's really beautiful charts in these visuals uh that you can interact with, and it also provides in the bottom provide your metrics name daily like the next steps

1:46if you want to do something different. But again, all of this, so as you can see, it shows I have uh 4,200 uh appointments, and calls was 4,800. All of this is coming in from our uh Google Sheet here. So, that's what I was talking about as far as making sense of the data, right? This is a lot easier to absorb compared to like uh you know, just looking at raw numbers. And that's why you can just kind of hover over each section, and you know, we can change how the look and feel is, and I'm going to show you how to do that. But essentially, the way that this works is

2:20it takes the data, your live data that's sitting on your CRM, and it presents this in in this really nice interactive user interface, which again, uh if you guys are like me, I hate looking at numbers and uh and data tables like this. It's just a lot easier for me to take a look at it visually, and then uh whether it's through charts or lines and everything else. So, that's exactly what we're going to build. All right, so now let's go ahead and get this started and do this step-by-step. Okay, so this is my blank n8n workflow. We're going to start building the AI agent and connect

2:51it to the front end with thesis, but the first step is creating account. So, for those of you who are new to n8n, you can go ahead and sign up for a free account. Link is going to be in the description. Once you bring in Once you create your account, you can create a workflow, and

3:03this is what it's going to look like. Every n8n uh workflow starts with a trigger. In our case, we're just going to add our AI agent with a chat trigger, because we're going to be interacting with this with the thesis front end. So, let's go ahead and click on add first step. I'm just going to look for AI agent. And as soon as I click on AI agent, this is going to bring in my AI agent automatically with that chat trigger, right? So, let me zoom in a

3:26little bit. Now, the first thing we need to do is add a chat model, and I'm going to click on the plus button. Make sure you are grabbing Open AI. So, I'm going to click on Open AI. And as far as the credentials, so what we need to do is we need to click on new credentials, because we need to add our API key from our thesis front end. So, this is usually where you would put your API key from your Open AI, but this time what I'm going to do is head over to uh thesis.dev. So, again, if you're new to thesis, I'm going to put the link in the

3:56description. You can click on it, it's going to bring you right here, and this is our front end, or this is our interactive UI builder. So, the C1 by thesis, it's an API middleware, but essentially, it also has a playground as well. So, feel free to check it out. Like uh they have really cool demos here that kind of compares how AI apps without C1 kind of looks like bland and just uh you know, these text, but with uh C1, as you can see on the right-hand side, uh it gives you all the visuals and uh the color scheme, everything is really beautiful. So, make sure you check out the demos that they

4:32have, and you can click on try uh playground, and it's going to open up uh the C1 here. You can click on new playground, or if you want to look at the existing uh sample playgrounds, you can check that out. But we're going to be interacting directly via the API to connect our n8n. So, once you come here, you're going to head over and click on

4:51your account. You can create an account. They give you a free account. So, I already have an account, so I'm just going to log in. So, afterwards, once you log in here, uh you're going to come on the left-hand side and click on API keys, and here you're going to click on new API key. Okay? So, here I'm just going to name it. So, I'm just going to do n8n test, and I'm going to click on generate API key. This is going to generate your API

5:12key. You're going to copy this API key. You're going to come back to your n8n, and now you're going to add this to your uh or paste this in the API key section. Don't worry about the organization. One important thing is make sure you're changing the base URL. Right now, the base URL says api.openai.com/v1. So, what we need to do is we need to get rid of this and add http as colon slash

5:35slash api.thesis.dev/v1/embed. Okay? So, make sure you type the base URL there, and you're going to click on save. Once you click on save, this is going to make the connection. It's going to say connection successful. Let's go ahead and change the name here, too, so that we don't get confused here. I'm just going to say thesis.dev. There you

5:52go. Or you can, you know, uh add whatever you want, up to you. Okay? So, just save that. And now we have our APIs connected. Okay? So, now if you click on from the list, now all of the models that are available on thesis, it's going to show up here. And see, as you can see right here, the name that says C1 EXP Open AI. So, what we're going to do is select the GPT-5 in the bottom here, the latest one. So, now we are good to go here. Make sure you turn off this use response mode API, so that way things

6:20are flexible. That's all you need to do. So, now you can get out of that. Uh make sure you add a memory. We're just going to click on the plus button here. We're going to click on simple memory, so that way uh your agent in the when you're interacting with things, it'll it remembers the past uh interactions there. Okay? So, afterwards, what we need to do is we need to add uh on the tool, we need to click on the tool here, and we're going to add our Google Sheet, because again, all of this data that you see right here, this is all sitting on my Google Sheet. So, whatever CRM you

6:50have, let's say you have, you know, Airtable or whatever it is, make sure you add that in the tool. Since I have mine on Google Sheet, I'm going to click on the plus button here, and then I'm going to search for Google Sheet. There you go, that's the first one that shows up. Perfect. All right. So, here, the way to add, if you don't have a credentials for Google Sheet, it's very simple. You're going to click on that, and you're literally going to click on sign in with Google, and this is going to pop up. It's going to say, "Allow n8n to access your Google account." Just

7:15allow all of the um all of the permissions, and you're good to go. Since I already have a bunch of accounts, I'm just going to leave it as it is. All right, so set automatically tool description, that's totally fine. Resource is going to be sheet within a document. Operation is going to be get rows. And then from here from the document here, make sure you're selecting whatever the name of your CRM

7:35is. Mine is called AI Phone Agent Data. So, make sure um as you can see on my CRM here or my Google Sheet, it says AI Phone Data. So, make sure you're selecting whatever document you have there. And then afterwards, just choose the sheet. So, since I didn't name my sheet, I just said sheet one. Okay? So, that's all we need. Now, we're done with the Google Sheet here. So, we are um as far as tools, that's the only thing we need to add. Now, another important thing is you want to click on the chat message here. So, you're going to double click on this and click on make chat

8:04publicly available, and this is going to basically give you this URL. But before we do anything there, click on the properties as you see in the bottom, it says um add field. You want to make sure that you scroll to the bottom and select response mode. And then from here, you want to select streaming. Again, the reason why we're allowing or selecting this is so that way the information can flow back and forth between our front end and thesis and here without any issues. So, we're going to enable that, and then afterwards, you're also going to go inside your AI agent. You're also going to click on add option, and you're

8:36going to say allow uh enable streaming. So, that way again, all of the information goes back and forth without any issues. So, that's pretty much it as far as what you need to do uh on the settings. Now, what we need to do is go inside your chat message, and now we need to copy uh this chat URL. Okay? I'm going to click on copy here. So, once you copy your URL there, one another important thing is make sure you click on publish. So, if you are on version two of n8n, you have to click on publish. If you are the previous version, you're just going to activate

9:04your workflow. So, here, since I'm on version two, I'm just going to do version one of this particular workflow, uh and describe changes. Unless this is multiple versions, then don't worry, that's just an optional. So, I'm going to click on publish, and now this is this workflow is live, right? So, now we're good to go to basically interact with this. So, now what we need to do is

9:25we need to head over to thesis.dev/n8n. [music] So, I'm going to go to thesis.dev slash n8n. As soon as you do that, this is going to bring into bring you to this particular page right here. So, now you need to click on this says try it now right here. This is where we need to enter our chat URL that we just copied, right? So, I'm just going to click here and paste the same exact URL. So, if I click on continue, now this is going to open up this box where now I have this user interface that I can chat with or

9:58directly to our N8N AI agent there. Okay, so before now interact with this, I'm going to go back to to my N8N. I'm going to click on execution so that way you can see exactly that this is going to be activated here. As you can see on the left-hand side right now it says no execution found. So now if I go to the front end there, right? So if I go to my thesis here, now what I'm going to type is So I just said something like which metrics improved the most over the last 3 weeks. So this is based on the data that I have. You can ask it whatever you

10:26want depending on what data you have, right? So I'm just going to go ahead and press enter and now this is going to reach out to my N8N AI agent which then is going to grab all of that information and now I'm going to be able to see this in this really beautiful user interface, right? So I'm going to go ahead back and you can see that this should

10:45automatically send that data here. There you go, perfect. As you can see it says running right now, which means that our AI agent is being activated and it said succeeded. So now you see that the AI agent will show up here on the front end this is where now I can see these beautiful user interface that gives me data that actually makes sense. I can actually take a look at this and make sense for me to see this beautiful summary with the charts and trend overview, right? So this is kind of the beauty of this platform that it gives you access, it shows you exactly the changes here like you can

11:20see the number of calls, the sentiment score, the appointment book direction detection accuracy. By the way, these are coming directly from my N8N or from my CRM here. See detection accuracy, appointments book, sentiment score, resolution rate, escalations. So that's why like I said you want to make sure that you see these columns that are matching and that's how you know that it's interacting directly with your data and it's showing the trend overview here in this nice little chart that you can see how many resolution what was the resolution rate for week one, the detection accuracy week two, week three. So all of this data that's beautifully presented to me

11:57with that I can interact with rather than looking at, you know, boring [music] columns and rows. So that's kind of the beauty of it. So let's go to our N8N here so that way we can see our execution here. So let me click on this. Now it's loading. There you go, right? So it looks like our AI agent got activated and it reached out to our Google Sheet here and then it grabbed all of that data and it presented to me in the front end with this really nice user [music] interface. All right, let's go ahead and ask it something else. So this time I'm going to say show the

12:30detection accuracy over time. So if I press this, now same thing it should reach out to my N8N AI agent to grab all of the data that we need and then we'll map out the detection accuracy over time in this beautiful line chart. There you go, perfect, right? I mean honestly this is a lot nicer compared to just looking at numbers and stuff. So since it says value values are daily average across agents, weekend dips, right? That gives you the weekend dips. It says suggest lower volume and variability. So this is what it shows and if you can just hover if you hover over it, it'll show you exactly all of

13:04the data here, very well presented. Again, all of this information available on the all the resources available in the link below. So I'm going to put the resources so that way you can have access to it. And of course if you have any other questions, I'll try to get to all of them. If you just put them in the comment, I'll get to them as soon as I can. All right, well thanks for

13:20watching. Hopefully you like the video. Like and subscribe and I'll see you on the next one.