How to Build a Custom App with JotForm AI (No Code) (Full Transcript)

[00:00:00] Speaker 1: Today, I'll show you how to use the JotForm AI App Builder step-by-step to create custom apps using AI. I partnered with JotForm on this video. We'll build an app from a simple prompt, customize it with AI, and then publish it and share it all without writing any code. I'm Kevin and let's dive in. First, head to the following website to get started. You'll find a link right here at the bottom of the screen. On this page, you'll see a prompt box. Everything starts with a prompt. Simply describe the type of app you want to build and JotForm AI App Builder will generate it for you. If you already have existing content, you could also upload files like PDFs, provide a website URL, add images, or even use your voice as the starting point. Now, for this video, I'm going to build an inventory management app for my small business, The Kevin Cookie Company. We seem to always lose track of which cookies are available in our stores and when it's time to restock them. Now, this is just one example to give you ideas of what's possible. You can use these same steps to create just about any type of app for your own business or maybe even for your own personal needs. Right here, I'll enter my prompt describing the inventory app I want to build. I've also included the prompt in the description if you want a closer look. Alright, let's send that and see what the AI App Builder comes back with. Over on the left-hand side, we can now follow along with the progress. To build the app, JotForm AI App Builder is generating forms, tables, widgets, navigation, branding, and the other resources needed behind the scenes. Alright, the app is all ready. Let's see what the JotForm AI App Builder created from that single prompt. Now, right away, you can see that it didn't just create a single page. It built an entire application with multiple pages and all the supporting resources behind the scenes. Let's preview the app. In the top right-hand corner, let's toggle this switch to turn on the preview. In the top left-hand corner, I can preview the app either as a public user or as a signed-in user. Later on, we'll look at how you can manage all of your users. For the preview, let's switch over to the admin view. I'll click here. In the center of the screen, you'll notice that the JotForm AI App Builder has optimized this app for different form factors, including mobile, tablet, and desktop. We'll go with desktop. Now, right here, we have the in-app navigation. Let's click on this dropdown, and you'll notice that it created a dashboard and also an inventory page. Let's start with the dashboard view. Here, I get a high-level overview of any inventory issues. And whoa, it looks like I've taken my eye off the business. It looks like we're running low on oatmeal raisin cookies, and we're completely out of sugar cookies. Now, luckily, we just baked a fresh batch of sugar cookies. Right up on top, let's switch over to the inventory view and update the inventory levels. I'll click here. Here, I can see all of the different cookies that we offer here. Let's click into sugar cookie. Let's scroll down to the bottom, and let's update the inventory. Here, I'll type in my name, and we just baked a batch of 50 cookies, and let's save the adjustment. Beautiful. Crisis averted. The app looks good, but let's make a few changes using AI. In the top right-hand corner, let's now exit out of the preview. I'll click here. To continue making changes using AI, let's launch the Podo AI Assistant. In the bottom left-hand corner, let's click on this adorable icon. First, I'd like the app to match the Kevin Cookie Company brand colors. So right down here in the prompt field, I'll tell it to update the app to use our brand colors of yellow and blue. Then over here, let's send that. Here, it asks me a clarifying question of the shade of yellow. Let's go with a gold-yellow color. Over on the right-hand side, you'll now notice that it's updated the background. It's very subtle, but it did make a change. Right up here, you'll notice the yellow accent color for all buttons. This is a lot more consistent with our business. If I decide that I don't like a change that AI makes, right over here, I can click on undo, and I can go back to a previous version. Now, let's make a functional improvement. Right here on the dashboard, I'd like a quick way to visualize my inventory instead of just looking at all these different alerts. So right over here, let's ask the AI assistant to add a bar chart showing the current inventory for each type of cookie. Then over here, let's send that. Over here, JotForm has added a new inventory chart page. Now, I can see the inventory levels for all my cookies at a glance. Now, right down here, if I jump back to the dashboard view, right here towards the bottom of the dashboard, you'll notice that there's a quick link that takes me directly to the inventory chart that we have here. AI is a great way to make larger changes, but you're not limited to just using prompts. If you want more precise control, you can always edit the app manually. I'd like to add a heading above this chart to make it a little easier to understand. Over on the left-hand side, let's start by closing out the AI assistant. And right over here, let's click on the plus icon. Here, you'll see all sorts of different app elements that you can add. For example, you could add a form, a heading, rich text, scroll down a little bit more, document, an image, and the list goes on. Now, right up on top, I want to add a heading. So here, I'll press and hold on that, and now I can drag it onto the inventory chart page. I'll place it right there, and let's call this the current cookie inventory. And just like that, I've made a quick manual update. Of course, adding a heading is just one example. You can manually customize just about every aspect of your app. Here, as an example, I'll open up the app designer. Here, you could change the theme, the corner style, the background. Here, we even have different app layouts. Now, whether you prefer using AI or making changes yourself, you have the flexibility to customize your app how you'd like. Here, I'll close out of this view. Now, everything we've seen so far is powered by data. To see where it's stored, right up on top, let's switch to the data view. Here, I can see all the information behind my app, including the inventory for each cookie. If I ever need to make a change, I could simply click into the cell, and here, let's update the inventory to 20. Now, I could also import existing data, or I could even add new records. Let's say, for example, that we start offering new cookies. Right here, for sugar cookie, we currently have 50 in stock, so let's change the status over here. I'll set it to healthy. Now, since the dashboard and inventory pages are connected to this data, any updates that I make here are automatically reflected throughout the entire app. Let's now switch over to the settings tab up on top. I'll click here. Here, you can update the app name and icon. You can also enable push notifications, and down below, you can even add an AI chatbot to your app. Now, there are many additional settings available, so be sure to explore them. Once you're happy with your app, right up on top, let's click on the publish tab. Here, you can generate a shareable link that anyone with permission can use to access your app. You can also control whether the app is public or private, and right down below, you can even invite specific people by email. If you'd like to embed your app on a website, right over here, I'll click on embed, and you can generate the embed code with just a few clicks, and if you're building the app for a team, I'll click here. You could manage all the different users who have access to your app, and you could also define user roles, and with that, your app is ready to use. Let's open it up and take one final look. Here's the finished app running just like your users would see it. From here, employees can update inventory, managers can monitor stock levels, and everyone has access to the same up-to-date information. And that's how easy it is to build a custom app with the JotForm AI App Builder. Again, this was just one example. You can use the same workflow to build apps for customer support, project management, employee onboarding, event registration, or just about any other use case you can imagine. If you'd like to build your own app, check out the JotForm AI App Builder using the link right down below in the description. Thanks so much for watching, and I'll see you in the next one.