The Adam Sand Report - Thursday, June 11, 2026

Adam Sand converts a roofing proposal PDF into a modern HTML document using Fable 5's Ultra Code mode and the Foundation design system. The workflow extracts the original design, applies new branding, integrates Claude API for dynamic content generation, and deploys to Vercel. The result is a customizable proposal tool that lets sales reps adjust roofing options and financing terms in real time.
Chapters
What's going on, friends? As I understand it, we are live. We're going to double check just to make sure, but if you are here, we're going to be playing around with, um, Claude Fable today. So, um, if you guys are down, we are basically going to be burning some tokens tonight. You guys are going to hang out with me while I work. I do these streams late at night, 9 o'clock, because I expect them to not be very good. And so if it's not very good, well, you can go ahead and tell me in the comments, but I already know. The whole idea is that I'm just getting used to live streaming, getting used to the different flow of live streaming. And so I want to kind of get a grasp on it, and that means I do them late at night. So the consequences of a poor performance are relatively low. And so if you are here, I'd love to hear, like, where are you from? Why are you here? What do you, uh, what brought you And if there is something that you guys want to see or want to know about, or you guys have questions, I encourage you to ask the questions. Because the cool thing about Fable is that at this point, we are really looking at an environment where— and again, I have not done this yet. We are looking at an environment where it's like you can apparently one-shot some pretty incredible stuff. And so my goal today is to actually wander into the new world of generative AI. So what do I mean by that? Well, everybody's kind of designing software right now for where we were, right? Um, it's like we're using today's technology to design software for yesterday. I've looked at, um, I've looked at like so many different, um, kind of new roofing CRMs, as if it were, And most of what you're seeing is— looks exactly the same, right? Like, I was joking around about this today with a buddy of mine who actually is a pretty good Agentic engineer, and we were kind of joking and saying, like, it's basically everything looks the exact same. Claude, you know, and Lovable and all these other things have a similar design philosophy. And design, like, app design today is, you know, it's kind of being muted. And all of these, like, you know, kind of new, amazing, you know, I'm a roofing company owner, now a tech, now I'm a tech startup. Like, all of these things are kind of, you know, the same thing. And what, so what is generative UI? Generative UI is a concept that, you know, I kind of joked around and said that I really realized that Tony Stark just had unlimited Opus tokens, right? And so when you see Tony Stark working on these hologram, you know, things in the Iron Man movies, what you're really looking at is generative UI. Whatever he's working on is the screen. Now, I'm not saying that you're going to have holograms in front of you, but what you are going to have is you're going to have a work environment on your computer, and you're going to have UI— you're going to have a user experience and user interface that adapts to the work that you are doing. So the concept of clicking through, right, and going through different screens, and like, I don't mean to throw any shade at anybody, I'm just doing this to like kind of show you what I mean. I'm not like, no shade towards these guys, most of these guys are friends. But like, when you look at the products that are out there, they're all gonna kind of look more or less like this, right? It's the websites look like this, right? If you look at, um, this other one, and again, no shade towards these guys, I like these guys. And I, you know what, I don't expect everybody to be where my head is, you know what I mean? It's probably easier to make money today by designing what exists today, but it all kind of looks like this, right? Like a menu on the left, you click these buttons, all the like tables look the same, right? The fact that it's proposal sent on two lines, you know, who cares, right? Even the websites usually look the same. I mean, I saw another one today, um, it was really funny because— and again, I'm only identifying the problem because I want you guys to see and understand the solution. Where's the one that we were talking about today? I'm just going to scroll up and find it because it was on today's episode of Claude Design with my, uh, with my buddy. Um, this one, copy link. So we'll go here, same deal, right? And when you look, it's like, these guys, it's amazing, amazing, amazing, but then look at the testimonials, right? So they're out there promoting themselves and they weren't even like, they didn't even take enough time to look at their website to realize that like, we don't have testimonials on our website. So again, I'm not trying to throw shade towards these people, They're marginally different, marginally better, um, probably, right? They're marginally more thought through, but that's all it is. It's a marginal gain over what existed yesterday. And what is really going to happen is what's called this concept of generative UI. And so when you think like— so, and there are open source resources for this, so I'm not selling you anything. This actually came out November 18th of, of 2025 is when Google put this research project out. But it's the concept that like based on what you're working on, the user interface will change. So then you will be able to say, okay, like, and they kind of looked at it as, oh, if you research some like Vincent van Gogh, it would create a little in experience for you. So previously someone would say like, I want to look at a gallery of van Gogh, and you're either looking at Google Images or some guy created a website that was a Vincent van Gogh fan website and it would look something like this. And I was just going to generate it for you on the fly, right? And so they're putting it through the perspective of search, right? They're saying, okay, search is going to look like this, but I'm actually talking about when you're running a software, it's going to look like this. So what do I— what is it? What does that mean for a roofing company? Well, let's say you need to reschedule jobs because of weather. So you're going to open up your CRM as the production manager and you're gonna chat to the window and you're gonna say, hey, I need to re— like, I want to check on the jobs coming up this week and look at the weather. And instead of you having to click around, right, or like, well, I like this software because it has this and this and this, but I really wish it had this software, and you're constantly asking— like, AccuLynx users wish they had more deal pipelines like JobNimbus, and JobNimbus wishes it was a little more smooth and, you know, like, like AccuLynx. And then, you know, you like, say, Zooper because Zooper has a really good configured price quote system and the inspection turns into the quote, and that's really cool. But maybe you like the fact that Proline, you know, has the automatic text messages. So you're like, you're wanting to like pick and choose from these different features, and, and then you end up getting multiple softwares, right? So then you have like GoHighLevel for marketing or HubSpot Marketing Hub Pro, but then you've got Sales Rabbit for, for canvassing, and you're constantly like trying to figure out what's the best CRM. And in many ways, it's because you feel in some way that these CRMs are holding you back, that like, that you don't have what you need at your fingertips, or you don't like the layout, right? And so using another roofing CRM as an example, so I'll put this back up. So if I go, what is the one, this one? No, this one, right? So if I put this back up and I go to that static or whatever it was— again, no shade towards these guys, it's just, it is what it is, right? So you click through your CRM and you're like, okay, I'm going to click on the Estimates button, right? So you would click right here and you go to the Estimates tab, and then like, this is what you have. But then what if you want to know something else about something, right? Like you want to look at the schedule to see how busy you are. Well, then when you're in the schedule, it's going to look like this. And every CRM's kind of got this different layout. It's got a menu on the left. I mean, HubSpot's the same, right? You've got a menu on the left and you could, you know, in HubSpot you can collapse it, you know what I mean? And maybe there's like, you have the ability to customize your views a little bit differently, you know, but you're, you're looking at these things and you kind of like, and now you're in the roof cap, right? And so it's just, it's, it's just, it's all the same. And the point is, is that what I think is, is going to be the future of the soft— we should be using the tools of today to design the software for tomorrow, not use the tools of today to make another version of the software we had yesterday, but just one particular person wants to say, well, I really wish AccuLynx had this, or I really wish Jobber had that, or I really wish, you know, whatever had this thing. And so then you try and like make AccuLynx and JobNimbus combined. I mean, I've heard stuff like this so many times. It's like AccuLynx and JobNimbus had a baby, right? People say stuff like this. And, and the point is, is that You should be able to— your users, right, should be able to birth a baby from any example of work they want done. So that's what we're going to do today as an experiment with the new Fable model. And we're already working on this in a more enterprise-grade way, but I'm just really excited about what Fable can do. And so we're going to give it a whirl. And so if you guys are new here, if you guys never been here before, I'd love to hear where you're from, what you're doing with AI, what you're curious about. I do these live streams more or less just a way to kind of sit down, work, and have you guys work with me. And we'll kind of chat through it. You guys will see how I'm going to approach it. This is 100% an experiment. I don't know if it's going to work. I think it will. And so I think I trust my, my approach, but we're going to kind of, we're going to kind of go through the, uh, we're going to kind of go through it together. And I welcome your guys' feedback. If you guys are smarter than me and you guys have ideas, I want your comments. If you're curious about something that I'm doing, well, don't hesitate to say something. I'm putting you guys down here and then I'm going to go back to sharing my screen and we will go through it. I'm excited to have you guys here and then whatever happens, happens. We're going to go here. Before I jump into using Fable, I'm going to use one of my— and this is actually going to be a Hermes agent that we're going to be talking about. So if you guys want to know like what I do and how you can support me, the biggest thing you do is like give this video a like and a share or a comment or engage with it in some way because it just helps me, you know, get a signal that these live streams are useful. But I'm going to go in here and I'm just going to put, this is my business. We built OpenClaw and Hermes agents on laptops we ship to you to your door. So if this video was sponsored, that would be who sponsored it. It was me. It's been really cool seeing what a lot of our customers have built. But again, I don't care about that. What I wanna show you guys is actually what we're doing with this. So we are gonna talk about, and we're gonna go to Marcus. Okay, so we're gonna go /new model. We're gonna hop over. To Claude because it would make the most sense. We're going to go to Anthropic and we'll go Opus. So again, if you guys have comments, throw them up here. All right, so I want you to help me through a project. It's an experiment that we're doing on a live stream, and the idea is that we are going to build a generative UI concept in Claude code using the new Fable model, and I want you to help me build out the, the goal prompt that we're gonna do it. We need to first use this as a thought exercise so that I can start explaining the problem to Fable before we get going. But you know more about the repo and you know more about what we're doing. So the concept that I'm going for is in the foundation project GitHub repo, we have the new Agentic layer. And the concept of the current app is, um, that, you know, it functions like every other app. It's got a menu on the left, and then that opens up modules in the main, in the main screen. You can kind of work with it. What I would like you to do is to understand the current layout of that and think of a new, a new user interface. So think of a large form canvas where you have a chat bar along the bottom and a wide open canvas. And you can begin a chat with that. And as the roofing employee, the roofing business owner— so production manager, a sales manager, a production coordinator, a, um, an inside sales rep— as they are trying to interact with their day based on the questions they ask, it would generate a unique user interface for the problem they're trying to solve. So an example of something you might see would be if we are, if we are saying, okay, I want to schedule the upcoming jobs, but I need to know what the weather looks like, and I need to be able to see the building in pictures, it would essentially generate a user interface that has the calendar, that it has the weather forecast, as well as the radar pulled from a live weather site., and then it would also have another module that shows the pictures based on whichever job you pick on— pick from the job picklist. So I guess there would be 4 app interfaces that would generate. One is the jobs awaiting to be scheduled, one which is the current calendar, and then every time you click the calendar, the weather would change to that forecast and wouldn't necessarily have the radar, but it would kind of have the weather forecast for that day. And then when you click on that job, it also adapt to a bunch of pictures. Now, because this is going to be a mock example, we can just use a set of assets that maybe Fable generates up front to be like the mock example. Now that is one example of one role and one task that would be done in the system. I think the best way to approach this project is for you to quickly review the Foundation project app repo and actually pull out 5 or 6 examples that would be like this so that I could take that and use it as a thought exercise and Fable as the thought partner in Claude Code. So come back to me with a plan. All right, so we're gonna let— we're gonna let Hermes run with that. John Story, 8357, hey man, it's good to see you here. Um, I love having you here, buddy. And if you have any questions about what we're working on, let me know. I am— if you hopped in late, what we're doing is basically, um, going through a concept of like how every, every roofing, every like roofing company owner is kind of becoming a tech founder. And we're all building using the tools today to build the software of yesterday, so they all look the same, they all feel the same, and they're all built with the same kind of UI elements. And that's okay, I'm not trying to throw shade on it. I'm just trying to say, as an industry, we can and should ask for more. And the more that we should be asking for is like, what is the user interface of tomorrow? And so in doing so, I'm kind of saying, well, what are we going to do? We're probably going to have something more— I'm postulating that we will have something more like a Tony Stark would have, in that whatever he's working on, he gets when he— like, he gets what he's working on to generate a screen as he goes. And so while this is doing its job, I'll kind of show what I mean. Tony Stark hologram. And so this is the uber crazy ultra cool version of what we're talking about, which is that, you know, Tony Stark— oh, this is Pinterest. I don't want to be— whatever. The whole— you can see what I'm talking about. It's like he has that user interface that generates. So whatever he's working on is the screens that he has, right? He doesn't have fixed screens. Now, I'm not saying we're going to have holograms, and— but I just kind of had this like thought the other day that Tony Stark just had unlimited Opus tokens, right? So his Claude Opus, if it were, would be able to generate a dynamic user interface and user experience based on whatever he— whatever problem he was trying to solve, whatever, you know, mystery of the universe he's trying to get down to, or whatever bad guy he was trying to beat, right? He would get a unique interface for that problem. And I think that that is the future, and that's the thing that we're building over here. But I wanted to test out the new Claude Fable, and so that's what we're jumping into. So yeah, so shout out John, thank you for being here, my man. All right, so, and so what I'm starting with here is if I go to— yeah, we— oh, there we go, it's already gone. So if I go into this, the Foundation Platform— I should— it figured it out, it figured out the repo. I said Foundation Project, but it should be Foundation Platform. But essentially, this is the future of roofing right here, and this is basically an agentic layer, um, And, and so this is the back end, essentially. This is something I've been working on for about 2 years, and I've been kind of waiting. Someone told me a long time ago, don't build what AI can do today, because by the time you build it, someone else will have already done it. Because someone else was thinking, what would be possible if AI cost a third of what it did today and it could do 10 times what it can do today, what would you build then? And so we've essentially been building towards that, right? And so if I go here and say, all right, what do we got now? They actually do— let me take a look at this. Yeah, okay, okay. So now full picture before I write anything. Current app, yep, this has got that. I built a thought exercise around that. 6 work scenarios, okay. 2 files delivered, all right. Can you send those to me as downloadable files so I can review them? Oh, it's already doing it. So if, uh, John, if you're still here, what have you been working on with your Roof Claw lately? Anything big you're building or trying— you're trying to do? And anybody else, for everyone else is in the room, I'd love to see where you're from, what you're up to, what you're curious about. Uh, today we're working with Clock Fable. We're gonna try some cool stuff. Alright. So let's see what we got here. It's gonna pop that up over there. Alright. So we got Markdown. I'm gonna go like this. Okay. So current state, what Fable's replacing, existing apps is TextVS. Okay. Real entities available. Got it. The interaction model, the rules of the canvas, module catalog, Lego bricks. So basically the whole concept is like module catalog, Lego bricks, and generative UI. That's how they kind of talk about it because it's kind of like Legos, right? You can, you could essentially have UI construct you— sorry, have AI construct the UI that you need, kind of like you can build your own Legos. So you might have 2x4 Lego and a 4x4 Lego and a 6x3 Lego and a 3x18 Lego, and, and it would change based on whatever it is that you're doing. And so it gave me 6 scenarios. These— let's see if these are real scenarios that the company would actually do. Okay, how's business this month? What needs me? So the module will be KPI tiles, trend chart, pipeline activity brief, sales manager, who and what do I focus on, hit the numbers. So Leaderboard, team members, pipeline board, leads, gauge to target. Okay, crew foreman, field mobile first. What's my job today and what do I need? Okay, it's kind of multiple jobs, selecting one, update all panels, toggle weather hold, pull today's weather forecast, safety note. Production Manager, where are all my jobs and which jobs are at risk? Risk Board, Crew Timeline, Permit Tracker. Okay, mock asset pack. Okay, so it's generating some mock asset packs. Build sequence. So it's 5 supply streams. Thank you, thank you very much. Okay, all right, what to hand Fable, and it's gonna be the goal prompt. Okay, so let's see the goal prompt. All right, so you're building a general UI experiment instead of fixing Next.js app, work in French, okay. So the only thing is I don't want to really mess with the app, so we're gonna have to change that. Well, nah, we'll do it, whatever. My, uh, CTO might be pissed, but he says kill the menu to the left is the left sidebar. Where each link swaps and to do that. Yeah, okay, yeah, let's check with the bottom. User picks the role and the intent, system assembles a bespoke workspace across link modules for the exact task. Non-negotiable architecture. Okay, so let's see. New surface only, add a new route, app portal canvas, do not delete or modify existing. Yep, exactly. What do we got here? Currently working on reimagining and recreating tools that are in existence that will improve our accountability and presence in the home. Along with a layer on top of third-party integration. You know what, that's pretty cool, John. Something, um, I'm working on is I got this thing, Claude, and I got the other one coming, the Pocket, but they like oversold and it wasn't enough. And I'm gonna try and hack each of these things and turn them into basically Rilla deals, but then also allow for like reflecting, right? So like reflecting on how the in-home experience went and this would just go on the back of your phone or in your pocket. So it's kind of like Willa or Zero, but it would be free except for AI API tokens, as opposed to, um, and like, you know, void, like, you know, GPT 3.5, or not GT, um, uh, Gemini Flash 3.5 would be super cheap and be able to, to handle this. But I think another cool thing, um, will actually be the ability to have live assistance while on a call. And I think that's actually an example we should add to this. So I'm actually going to get it building that. And if you have any other cool examples, what are other cool examples that you can think of where if you could have a user interface— so John, I'd love your thoughts on this— if you were working inside your CRM and the user interface could adapt to whatever problem you're working on, whatever challenge you're up to, um, in a roofing business, think of a role and think of a job that they have to do. So I think accounting would be one. I'm gonna try and get it to conceptualize. And I think also inside sales, because if you're live on a call with the customer, and if it was listening to the call and listening to objections, it could pop up objection overcomes, and it could also suggest content from a library like the GAF No Nails video. If you're selling GAF against someone's corning and they said, oh, it's true, you know, the shurnail strip, is better. And we would actually, you know, would like to go with Owens Corning SureNail. Your object— your objection overcome would probably be something about the monolithic bond caused by the, you know, microgranules, the largest nailing strip, and it creates that monolithic bond that gives us the only unlimited wind warranty in the industry. That would probably be your— some version of your objection overcome. But even better, it would be to send the GAF No Nails video and you could say like, hey, look at this, right? So this is some stuff that I'm thinking. So yeah, let me know your thoughts around that. So if you have any other suggestions, I'm gonna go ahead and add these now. So I like your UI brief and I wanna add two more examples that I think would be really essential. So for the customer success manager, which is the inside sales rep, they're responsible for making sure the customer has a great experience, buying the roof. Their 3 main job tasks are going to be the, um, the lead intake call, right? And so they take the call from a customer— either a lead came into the CRM and they make the outbound call, or the customer phones in, they take the call, and their job is to move the customer meaningfully towards solving their problems. So they have to, you know, obviously collect all the contact details, but they also need to have some ideas like diagnosing the leak. Every roofing company owner remembers the time when they first answered a lead when they were just a guy and they were doing everything, and a customer would say, oh, I got a leak. And the owner would actually answer the phone at 7 o'clock at night and he would talk to the customer about the problem. And they would say, oh, I got a, I got a leak on my garage. And, you know, the owner would say, oh, maybe you have a house where it's a two-story and the garage kind of sticks out from the front of the house. And so there's an outside wall above halfway on the garage on this like two-story home. And is it leaking along a beam? And the customer would say, yeah, it is leaking on the beam. And they say, oh, um, do you have a wall, you know, of the outside of the house, maybe a bedroom above the garage? You say, yeah, I do. And then the roofer would say, oh, you know what, it's probably water going behind the siding. The wall flashing probably isn't got a counter flashing of some kind on it, like a sealant tape. And so the water's going behind the flashing, come— coming into the roof that way. And they go, oh, you know what, that's true, that's totally what I'm seeing, I think could be happening. Well, now the owner of this roofing company that took this lead, he built rapport with the customer, built trust with the customer because he diagnosed the problem even without seeing it. The homeowner feels a sense of like trust that this is their guy, that they found their guy. And so then they made time for both the husband and the wife to be home tomorrow, and then he goes out there and sells a job and he gets 70% close rates. So then he thinks he has a real business, so he hires a receptionist and sales guys and the close rate gets cut in half. And the reason for that is because the receptionist becomes a receptionist. She just answers the phone, takes the lead, you know, maybe schedules an appointment or says a sales guy will call you back. The customer didn't move meaningfully towards solving the problem in this example. And then when the time the sales guy comes, there was no rapport built, there was no meet, there was no like pre-diagnosis. And so it would be cool if the customer success manager had a mock example of, you know, a phone call coming in and popping up the phone module. And then as the phone call is happening, the AI is listening to the call, and then if the customer mentions their address, it pulls up the address, adds to the CRM, and then it pulls up like the Google Map of that address. And then as the customer is explaining their problem, it pops up examples of what it could be, maybe like shows like some kind of like house schematic, um, that the customer might have described and potential leak point. So that would be like one mock example. Another mock example for inside sales would be during follow-up. It would be listening to the— like, so after the sales guy has left the house, he's presented them something. If they phone the customer, right, um, so they would say like, hey, who do I need to follow up with today? And it would pull up the, you know, how much the deal was worth, when the customer said they were anticipating to make a decision, the reason that they gave during the sales appointment as to why they weren't buying when the sales guy was at the house, and then what they were think— what we think the next step is, or what the objection overcome is. And it would pop up that objection overcome, and then maybe pop up a resource like a YouTube video or a PDF or some kind of like objection overcome, maybe like a comparison of the long-term value between a metal roof and an asphalt shingle roof and why metal roof actually pays you back. Because, you know, it is worth it. Or maybe you could pop up like the financing payments, and as the sales rep talks about, um, talks about the, like, the, the different pricing options, and it would ask like, hey, what's your budget? Then it would like find the right payment plan for the budget. Uh, so I think that would be two good examples for an inside sales rep. I'm gonna pop that in because I'm probably running up against the limit of Whisperflow there. But the other example that I wanted was for accounting, and I think that if like accounting came in and they said something like, um, you know, what is our commissions for this week, and it would show you commissions, uh, that's payable, set up like a table of commissions payable by sales rep, but then it would maybe pop up some opportunities to say like, you know, these customers, uh, have, um, AR, like they have accounts receivable, and these checks have not been collected. And like, it could live calculate, you know, how much the sales guy would get in commissions if they were paid 10% commission, how much they would get. Actually, scratch that, make it like 7% commission. So calculate how much commission they would get at 7% of the amounts due. So if a house was, you know, a $20,000 roof, customer paid their $10,000 deposit, but the $10,000 final payment was not paid yet. If they, you know, if they were able to collect the final $10,000, then the sales rep would get that extra 7%, and then it could like queue up a list of follow-up emails and follow-up texts and say, do you want me to send these now? And it would send them now, and it would automatically pull like the invoice due date and like have a gradual, more aggressive payment collection message depending on how far it was. So if it was like overdue by 2 days, it would be like a gentle reminder. If it's overdue by 7 days, it'd be like Hey, we're just messaging again to let you know your invoice is 7 days overdue. And like, it's 28 days overdue, say, hey, in 2 days we are filing a, um, a lien, and that's just part of our process. And we will also be filing with thecreditapp.org to say, you know, this could impact your credit. Um, it's all in terms and conditions. We've messaged you a couple of times and we want to make sure that we can avoid any of this, so please get back to us. Um, this would be an example for like an accounting module. So every user starts with their chat and it can maybe have the kind of like, I don't know, maybe it could like say like, what do you want to do today? And it could have a little pop box like before you began the chat, you have a box of like, these are the 5 things you usually work on, and you could click one and it could then generate the UI. Or you could just start from the chat and it would generate the UI live on demand in theory. But that's what I'm looking for. So I guess that's 3 examples. Please add 3 examples and to my generative UI brief and send it back to me. All right, what do you got for comments? Nothing. Okay, well, for those of you who are here, I really appreciate you guys being here and I hope this is cool and that this is something you guys might like. And yeah, we're gonna— I'm gonna go back to our, uh, to our brief. Okay, so module registry, deterministic intent scenario router with quick pick chips per role. Okay, so it already had kind of something like this. Implement the hero scenario fully, make reactivity flawless. Wire the 5 remaining scenarios with Fable generative UI brief. Slash canvas loads with chat bar and roll selector. The Old sidebar app still works with routes. Typing the hero intent assembles the 4-module workspace with working cross-linking. Selecting a calendar by day visibly repaints weather. Selecting a job visibly repaints photos. No new data layer. Everything reads from lib/mockdata.ts. No Live Data API dependency. Yep. All right, cool. I'm excited to work on this. So, um, so our next step will be moving into Claude code and working on this mock example, and it's probably just going to be letting Claude burn some tokens. I'm excited to show you guys. Again, I have no idea if this exactly will work. This is just my hypothesis. That's that, and this is the preview. Let's go through this and read it again while it's updating. Models are self-contained cards. Each declares what slice block data, what shared context reads, Okay. All right, so for those of you who don't know what this is, what, what this is, this is a Hermes agent. So I have a number of these, uh, guys. So this is Marcus, um, you know, this is Vito, he, uh, runs the, he runs the roof cloud apartment. But this is, and this is Claudio, kind of like the chief of staff.. And so I have a number of these things in here. This one down here is Devin Broad. He's like the developer agent. And there's another one down here, Mary Klosky. He is the, uh, he is the, um, accounting agent. And so we are using Hermes to, uh, because it knows about me, it knows about my projects, it knows about my business, it knows about my plans for the future, it knows what I like. I'm getting it to essentially design my project and that's what these things are here. Over here in VS Code is it's essentially giving me this, it's drafting the project so that when I go over into Cloud Code to use the new Fable model, it will essentially understand what we're trying to do. And hopefully we'll get something cool to show you guys tonight. And now again, this is not expected to be the, um, the coolest livestream on the planet. This is why we do it at 9 o'clock at night, is because I fully expect them to suck. So if it sucks, you know, go ahead and let me know in the comments. But if it's good, also let me know. Let me know that this is the thing that you like. I like working through real problems. I don't just excuse me, I've been sick lately. I don't just want to open up the, uh, you know, the Claude, uh, Fable model card and read it off to you and tell you that, you know, this changes everything, right? Um, I want to actually, you know, go through and give you real, real life examples, um, real work, you know, even if it doesn't— even if it doesn't work out as planned, it's like how we actually iterate through working with AI to do stuff. From a guy who's just trying to, uh, vibe his way from being part of the permanent underclass. So let's see, we got both files are clean and fully consistent. Done. I added your 3 examples and threaded them through the whole brief. They're not just appended. Okay, so 7, CSM live intake calls. Scenario 8, okay, UI, Andrew spoken, CRM on fills. Perfect. Um, accounting permissions and AR. Yes, yes, but that I also added the What do you want to do today? Empty slate launcher you described. Every role opens a blank canvas with 5 common tasks, clickable chips, okay, or the free text chat, one honest grounding call. You should know what invoices live in invoices.ts, mock invoices, invoice type is a single amount, no deposit, balance split, no assigned rep, no commission rate. So the accounting scenario needs a small phase 0 mock extension, lib/commissions.ts. I told Phil to build that explicitly rather than hallucinate fields that don't exist. I'm gonna generate the Garage Lico schematic. Yes, please. Okay. And now we have our new Fable Generative UI brief. Okay. And let's take a look. Okay. So Okay, what else do— some everybody can correct. The interaction model, rule of the canvas. There's full bleed canvas in the left rail. Yeah, Lego bricks inside sales. Okay, this has each scenario. Yeah, the rest— I don't even know how we're going to demo this, but we'll figure it out when we get there. Okay, okay. What are we getting back over here? He is generating. So now what is it Cross leak helps connect leak point overlays. Visual scene walking through the asset already in hand or one image makes it very touchable. Okay. All right. Well, I think, and this is the new Fable goal prompt. Let's take a look at that. Okay, I think, I think I'm ready to walk into it, so let's do it. Oh, you guys haven't been seeing my screen. Sorry, I'll show you guys. Yeah, I got my, uh, I got my new response back, and then I was just looking at my new generative brief. New Fable goal prompt. So we are going to hop over to Cloud Code and do that. If you're just hopping in, I am testing out the new Fable today, and so I'm going to get loaded up here and just get into it. Make sure— launch— relaunch Cloud Code because updates 4 times a day for some reason. So for those of you just hopping in, we are using Fable to experiment with generating a— I'm not sure it's going to— I don't think it's going to one-shot but a generative UI concept for the roofing industry and what that might look like. And so if you have an idea, like a mock scenario where a roofing CRM's UI doesn't quite work for you, that would be a good thing to— good thing to recommend. Throw it in the comments, maybe we'll try and build that too. Okay, so start a new chat in here. I'm probably gonna close some stuff down to just lighten up the load here. And yeah, yeah, yeah, yeah, yeah, yeah. Okay. Is there anything crazy on the other screens? You shut down Anti-Gravity, shut down Codex. Gotta go from there. All right, I'm gonna load this back up on the screen, go over here, say we want a new chat in this one. I shut some of this down so I'm not showing too much of what exists. We're gonna go just click on something random. We're gonna get rid of this, get rid of this. All right, and now we have to go back to VS. I'm sure I probably closed it, didn't I? Yes, I did. And we're gonna add this. And we're gonna switch to the new Fable 5, and we're gonna go— oh, do I wanna go UltraCode? Let's do it. Let's just spend some money today. So this is probably going to be a minute, so if you're here and you're watching, it's a good time to comment, see where you're from. Let's have a small conversation because it's probably going to be a, uh a bit of a— what we got here? It's probably going to be a bit of watching and waiting around and seeing what happens. So be a good time to chat with the crowd. All right, what does it got? So we've got— I should have went to auto mode. Enable auto mode. Oh, let's just let it— let's see what happens. Now this thing is probably going to smash my weekly limit. I've actually been holding off for a couple of days in preparation for this night. Okay, so building hero visual now. Let's start with schematic. So, well, I guess since we have the time and we don't have many comments rolling in, let's see. Okay, so this is just it reading the app directory. This is reading We're gonna see what Fable can do tonight. I'm gonna text a buddy of mine, see if he's— see if he's around. Maybe he's already in here. Demo, if you're in the room, say hello. Smashing on Fable tonight if you, uh, are around for the live. Okay, what we got? Okay, so all 4 files read in full. Jobs, crews, this, this, this, notice for modules, mock invoices. Ah, not in mock data. Okay, commission invoice. Yeah, yeah, the phase 0 plan looks good, and you can use the Higgsfield MCP to build out the mock images. Feel free to spend up to 3,000 tokens. If there's any UI elements we don't like, we can do that. We could also generate fake voice conversations perhaps with Suno or ElevenLabs if that's needed. It doesn't look like it. If you need me to pull anything else, I can do that. I can even pull an example EagleView measurements to give you real measurements of a house, whatever you need. All right, well, for those of you here, again, we're kind of gonna be watching a bit. Okay, so, okay, it's kind of a wacky drawing. Maybe we take this, um, okay, so you can give it those images. And take— we're just for fun because we have time to wait anyway. I'm gonna go take this to, uh, take this to Gemini to see what we get. Oh, I've never seen that before. Um, separate views. Yeah, let's go Gemini. See what Gemini could generate from it, from that example. I want you to improve this image to make it more like a Tony Stark hologram style schematic that looks like it was live generated, but it's almost got like a holographic UI work atmosphere that would live inside of a generative UI panel inside of a chatbot. And then we will paste that. Then Okay, I'll copy this image. Let's see what we get. See, in many ways what you're seeing here is actually generative, generative UI, right? Like, it's generating these images with Higgsfield. If you don't know what Higgsfield is, it is just a basically a platform to access other platforms. So you have like all these image generating models. So if you come in here to generate an image, you can pick from all of these different image generation models. You can try all kinds of different things. Um, same thing if you are doing, uh, video, you have access to all of these different video generation models. So you come in here and so yeah, it's just like one API key, multiple video generation models. It's a good creative working scenario, but you can also use this Higgsfield MCP to connect it to your Claude or your OpenCLAUDE or your Hermes. And like an example of like what that looks like in practice is we generate this, we generate this Florida Man video of a guy for a roofing company in Florida we do marketing for. We generate this Florida Man video, which is this funny video about damage-proof roofs. General, this would be it. Hopefully you guys get the sound. I should actually double-check. How do I make sure you guys are getting the sound? Um, audio. Find this settings. Audio automatically adjust. Well, I hope you guys get the audio. We'll see. Anyways, this is a Florida Man video. So yeah, so that's like what I— and Drake, you are absolutely right. Higgsfield has terrible cancellation policy. Luckily, we actually do a lot of really cool stuff with this, and so we probably won't cancel it. So, um, you know, so I, I do imagine it's got a terrible cancellation flow. Luckily, we put, um, we put— what do you call it— uh, all of our payments go on like a virtual— not a virtual credit card, but we use this company called RelayFi, and RelayFi allows us to create these like separate accounts. And so we can, uh, we can essentially, you know, we could cancel the card if we wanted to. All right, so got it, got it, got it. Yeah, okay, so what— actually, I'll make this a little bigger. So what it's doing is it's generating these examples for this, like, this library of mock examples for our generative UI app, right? So these are probably gonna go inside the widgets. Hey, that looks familiar. Hey, so again, this is, this is all for a mock demo. So we're gonna— we're moving quick, quick towards our 5-hour limit. Yeah, it's very similar to Ramp, Drake. Very similar to Ramp. Yeah, um, yeah. Oh man, we're gonna We're going to blow our 5-hour limit here. I'm going to zoom in real quick. Drake, to catch you up, what I did first was I went in Hermes and gave it the task of saying, hey, you understand this foundation platform repo that we have. Right? And it understands like what we're building over there. And I said I want to do this generative UI thing. And so— and you and I were kind of talking about this earlier— and so I went through and I just gave it this kind of big long explanation of what I wanted, right? Came back— excuse me— and gave me my mock scenarios that I wanted, wrote some files. I told it basically I wanted more mock scenarios and like gave it some more tacit knowledge. Right, gave it even more. So then it built me some more and essentially helped me like catch up, um, Claude on this. And so, and then it generated me this, which I didn't love, but that's fine. So then what do we got over here? It's still not, it's still not much better, but it, it's not bad, right? I should also when Claude takes its next stop. I haven't really given it a brand guideline, so I'll probably give it a brand guideline so that it— because I don't want this to look like every other vibe-coded thing, right? Like, I don't want to look actually like this. I want it to look— I mean, I suppose from a demo perspective, people seem to like stuff like this, but I actually wanted to have more of a, um, Or like this, more like this kind of color palette. Hey, um, Drake, not sure if you have this yet. So this I can use to monitor all my various models. So like, where am I at for my usage on everything? It's called Codex Bar. It's pretty sick. And yeah, Max, this, um, this is basically what we're doing is we, um, we basically just are going along the concept of like, um, Tony Stark probably just had unlimited, unlimited Opus tokens, and that's why he could have any user, any user interface he wanted at any time. And so it's like, how do we get— how do we get it so that we have this, right? Like, we want this. I hate Pinterest. Suck it. So we're doing this whole concept of like— I mean, obviously Tony had like an infinite UI canvas, right, in that it was a hologram, right, in his office. But the concept remains is that like you have, you have this whole canvas of your screen to work with. And just like how you have in Claude, you know, we have— this is essentially generative UI, right? It's, it's a code block. You could have the same thing in here you know, you have essentially— you have a code block, right, in this example. But then you could also have an image generation block like it had right here. So then it put all of these image generation blocks here. And I mean, you could have other UIs, but it's always in the center, right? So if you think like you know, whether it's this big or this big, you have the same thing. But if you have a screen this wide, right, why does it have to be like— I could zoom in, of course, but if I zoom out, right, like, this is still legible. And if I pick this picture, it zooms in. So why couldn't you have something like this, but it be Company Cam, and instead of it existing right here Why couldn't your company counter be over here, and then you have the weather over here, and then you have a job calendar front and center, and then you still have your chat bar here, right? So you can still work with it. And what's this? Oh, one background task. Yeah, so you can kind of have your own kind of controlled UI, and that might be something we add to this, right? Like just like how here you can, you can say I want this and this, right? But that's only because we as human beings, we see the user interface that we're used to. We're used to having kind of actions on the left and like secondary important things over here on the right, and then like the main thing that we're working on. But when we go look at every, you know, What was that one that we looked at earlier? You and I are joking about it. Like, when we look at every, you know, Vibe-coded CRM— was this— what is it? Is it Mac only? Do you have to give it a key? You have to give it keys? What are we talking about? What is what? Give what keys? You're gonna have to clue me in here. But yeah, so like, while I'm waiting for you, Drake, um, this here is a— I'm actually just gonna go like this so I can make sure I see the comments. Um, but like, this is every UI, right? And then when you click on something, it might slide something over from here. Oh, the token usage thing. Oh, Codex. Yeah, you give it, uh, you give it keys. Yeah, you give it your keys. You go codex bar And then I, I don't— I, I'm not sure if it's Mac. Yeah, it's Mac only. Sorry, buddy. But yeah, so then you can give it your, your keys, and then you can kind of— I forgot. Yeah, you're a Windows guy. But yeah, so you can give it your API keys, and then— or your— and it's a system key, right? Like, it's not the It's not your individual API key, it's like a system admin key, and then it can essentially monitor your usage. Now I have like multiple, um, OpenAI accounts. So like this one, it's not a lot because I have my Adamant Roofing Business Partner OpenAI account and I have my Adamant Roofing Business Partner, um, AI account. So you can kind of switch between them. But yeah, it's pretty cool. Oh, we're creeping up on 15% of our 5-hour limit. I've been storing up, I've been storing up my, uh, my, my weekly limit. I haven't had a chance to dive into Fable since it got released. So this is where I'm— this is where I'm living. What is this? I'm burning the last of my usage before limits reset tomorrow. Yeah, all right. So I'm wondering if it's like figuring this out, because like if you look up generative UI. There's actually some people who have done it. CopilotKit has actually built, I believe, created open source version of this. So if it's like I'm curious if it'll— what it'll do. Amazing. Does it not work? This is more like not really a user thing. I don't even think they are actually— they might not even be where I'm at. Yeah, Drake, I was thinking, I was considering that because I have my ChatGPT Teams account and then I have my like personal ChatGPT Max for using with Codex. And, um, if I get myself into a mess, I might have to, um, get a Claude Max plan tonight. And if I run into my— if I run into my limit tonight, I might just buy a CloudMax and then open up this same— but the thing is, it's, it's doing this cloud-based replicating, so I would have to commit it and then reopen it. Shad CN is good for this too. Yeah, I mean, so what he's saying, Shad CN, it's like these are all the— these are all the— essentially all the elements that you can get, or components. So when you're looking at most When you're looking at most the apps that are like made by Lovable, this is like kind of what you're seeing, right? Is it's mostly just building with these components, right? So all of this is what it kind of pulls from. Are they sponsored by Vercel? I mean, it would make sense because they have V0, I think it was called. So the whole idea was like, that was— this was used by them a lot. Examples of stuff that was made with it. I wonder if they have something here generative. Yeah, see, this is so new that like most people don't really have any live examples. It's kind of building something I haven't built. Okay, so what do we got? Okay. Okay, so we're gonna get the Design MD file. I thought I had this. Yes, you're good to go on phase 1. And just so you know, I'd like to use the Design MD file I just uploaded for the design of the app and have a light mode, dark mode option. I know that's not part of this phase, but I just want you to kind of add it for this function so there's more of like a parchment, you know, elegant feel, not the usual, you know, ChatGPT vibe code kind of look to everything. I want to be more elegant and upscale. Oh, I got some Facebook messages too. One sec. Um, doesn't this auto-commit to branch? I need to pull domain. Just have it start saying branch again. So for anybody who's here, I would love to hear where you're from, what you're doing, what you're interested in, um, talk a bit more about like what we got going on. It's what you're building, you know, stuff that you're interested in. Like, I don't just want this to be Adam Sand show. It's kind of cool. I do 3 webinars a week, but it's more like private. This is, you know, and it's not a YouTube video. We put out lots of YouTube videos, but this is kind of an opportunity to actually really connect with the people in the live stream and hear what you guys think is interesting or what you guys want to see or what you guys are working on. Um, because I don't expect these to be super great out of the gate. Like, I'm not an experienced live streamer. That's why I do them late at night, because I expect them to not be very good. But if you guys have, you know, cool things you want to see or you have questions, I'm happy to like jump into some of this stuff with you. And Drake, I appreciate you being here because you I've had more time with Fable than I have, so— and, um, you've actually built your app, and so you've got these— you've got more experience actually building a purpose-built app because I'm more building like different things, right? Backends, I would say, is more what we're doing, either for clients or for ourselves. Although we do, you know, have fun and get to build videos like Florida Man or the Three for the Crown project that you guys are going to see soon. Chris, what are we building? Okay, so yeah, Chris, so what we're building today is essentially when we look at like Tony Stark, right? What is it we know is what Tony Stark's environment— he He has unlimited Opus tokens, right? Like, he, he, he could generate his, like, whatever project he was working on, right? He had, like, the ability to kind of generate a user interface based on what he's doing. And so I was kind of talking about the, the different, uh, everybody's like a vibe coding, uh, guy building a CRM today. And no shade towards these guys, they're just the ones I was picking on today. Like kind of all these, you know, I am building a CRM that changes the world, they all kind of look like this. And then what I'm postulating is that we're using the AI of today to build the tools of yesterday, right? Like even his own thing, it's like the schedule job button is like offset. So he's selling this product, his testimonials are like not even here, so he didn't even like quality check his own website, but he's out there saying, hey, you should like run your business on my software. And again, I don't want to throw shade at this guy, I'm just saying like we're doing the wrong thing. We're asking the wrong question. It's not about can we make a better version of JobNimbus or AccuLyx. What we're saying is that, like, we should be able to generate our own user interface based on the project or the job that we have. And so for this roofing CRM, you know, we're not really building a CRM, right? There's a bunch of functions. So this is a project I've been working on for about 2 years, and the reason it's been 2 years is because someone that I take pretty seriously said, don't, Adam, don't build what you can build today. Like, don't build within the limitations of AI. Build towards where, you know, what would be possible if AI cost one-third of what it costs today and its capabilities were 10 times better than they are right now. Build that, because that way you'll be ready when the technology becomes capable. And so that's what we've been building and we're just now getting to a point where that's possible. And this has all been like backend agentic layer on top of the roofing industry, essentially. It's like just like not like an agent, like a voice agent, like I mean like true, you know, hybrid work atmosphere. And so today we're building the generative UI canvas. So what we started with was, um, oh, didn't we do that? But we start— oh gosh, so what we started with was I said, hey, I want to build this generative UI concept, right, where— and we're going to do a generative UI, meaning like, what problem are you solving? If you're working towards, um, if you're— I'm just going to get off that screen— and if you're working towards, say, like, okay, I need to reschedule jobs, right, for the roofing company. Well, when you click a day on the calendar, it shows the weather for that day, and it shows the client contacts and the CompanyCam photos. And it, it can, it can show you whatever module you want based on the task. So it's not about going to your software and be like, okay, I'm going to the schedule module, right? Because it's like, okay, we have a bunch of buttons along here and you click this and you click this and it's like, that is the thing that you're in, right? Like you're in that thing and you have this user interface It's like what, um, it's like what you want, right, is actually generated live, right? And so it's not a matter of like, okay, I want to make a better version of what exists today, but I want to build something that generates live in the field, right? And so then when a human is interacting with it, it's more like you're interacting with Claude Code, right, where it can— but where it generates whatever it needs in the user interface. So like it can generate this but you're not really looking for this. You're looking for something that can move these tiles around, very similar to like Tony Stark, right? So Chris, what are you building? So I'm doing right now in 3 days, I built what would have cost me $200,000 with a 10-person dev team 7 years ago. Yeah, I mean, that's kind of the whole concept. And, and the challenge, of course, right, that I would caution everybody against, not to like— is, is it like So can everybody else, right? So you have to think, are you building for yourself or are you building for everyone? Because HubSpot also has these tools, Salesforce has these tools, ServiceTitan has these tools, um, Zooper has these tools, and they also have a 10-person dev team, right? So it's like, are you— if you're trying to, like, are you building for yourself or are you building for everybody else? Because what every tech founder learns, um, on their kind of first go is that building the tech is easy, actually selling it to 1,000 users is the hard part. Of course, absolutely. Yeah, that's, that's very true. And that's kind of what, that's kind of what we So are you doing this for roofing? What are you doing this for? Like, what industry? I'm assuming it's the industry that you're in, because if you understand the problem, the solution, the problem flow— oh no, what are you, what are you building for? This is the crazy thing, is like how much just the sheer volume of code that this thing cranks out. Ooh, I like it, I like it. What, Chris, what industry are you in? Gonna send some photos to these guys, a couple of, couple of friends. What do we got? What do we got? I've got 4 projects on the whiteboard, one getting close, one fully concept, not coded, the other 2 like 80%. I'll link the first one shortly, just let me push one more graphic update I was working on. Perfect. Okay, yeah, I'm excited to see it, man. It's good to have you here. Like, it's, it's cool to have somebody outside the industry, um, to kind of just see different ideas, what people are working on. Okay. Okay. So one piece of feedback that I would give is that right now it currently assumes that the ability for the canvas. It seems like it has a confined 2x2 canvas. I want to assume it's a little bit more zoomed out and you would be able to have like a 1x1, a 2x3, a 4x4, a 4x5. Like, it would be able to have more— I think of it like widgets, right? On a phone or on the Mac where you can have different widgets of different sizes and that way you could, you could kind of have more. So just currently from what I'm seeing, you have a 2x2 and it kind of assumes that it's going to fill that, but we should have the widgets be able to be kind of any size depending on what makes the most sense for the particular module or generated UI. And if possible, we would be able to pin a module so that even if you change the conversation, you could choose to keep something up like the weather or a particular contact card. And so I want it to be able to be a little bit more, more generative in its design theory. If you feel like we can move on to phase 2, or should we stay here? And I think I got some Oh, you're off to bed? Yeah, it's kind of late. It's late here too, but this is my time to get cranking. But yeah, I'm excited to see what I get together. Drake, it was good having you here, man. I'm assuming this is not building yet. Oh, okay. I don't remember my password to this thing. Because it would have been— yeah, I would need to sign into the actual one. It's not pulling up my autosave. Let me pull it over here so I can reveal my password. Yeah, no, that's Roof Claw. That's not the right one. Chris, I'm excited for you to share your project. Great feedback. Time is perfect. Second decision phase, he locks in. So I'll fold it in. Okay. Hang staying put. Widget size module dense, free-flowing board. Okay, small, medium, large, wide, tall. You're spending 12-column grid instead of fixed 2x2 layers plus panga widget. So we survive scenario changes, the rigid layout field dies, the each module displacement declares its own size. Moving to phase 2 now. Okay, perfect. Okay, so there was my pinned widget. So I guess while we're waiting for anybody to throw a comment in, let's continue to see if we can find a Generative UI example. Oh, yeah. We should add this. I'm trying to see an example, but even this one didn't work. Show me hotels in New York City. Isn't even that cool. So what we would be building is this is definitely much more of a— this is what we call declarative, right? So there's controlled, right? Um, so but this is actually— so it has— we're getting to the point of having a, um, fixed catalog and fixed schema, right? This is more clear. It's not fully open because fully open would be like where you have like that, um, that MCP in Claude where you can kind of say, okay, we have the image section, right? So where it generates images with text field up here, right? Where it generates UI, like user interface components right here, right? What we're really saying is on the spectrum of generative UI, you know, it's declarative. Now, that doesn't mean we couldn't get to this point, right? But we're probably like, this is essentially the concept, right? So internal enterprise, long tail customer, right? We're living more in this declarative space. But if you were using another roofing software or thing like an EagleView or even a— like if you had, say, Sales Rabbit, which was like being used out in the field, but you want to report what's going on in Sales Rabbit, then you'd probably get to this part of the spectrum where you'd have a Sales Rabbit MCP so you could pull data from that app, right? And pull in that kind of stuff. And so I think where I'm identifying this is like probably like right here, maybe here, but we'll see. Okay, I wish this is bigger. Why can't it be bigger? Dude, that's awesome, Drake. I don't know if you're still here, but picture you sent me is really neat. Okay, so So we're actually going to ask it, based on this article, where do you think we're sitting? I think that we are sitting kind of on the spectrum of declarative, um, borderlining on the MCP apps. I don't think we're quite open, on the generative UI spectrum. I would say we're declarative. The only reason I say we're getting into the MCP app section is because there may be examples where we would connect to other apps with an MCP and allow for the interactivity of pulling the data from that MCP, like a, um, you know, like even something like Google Ads or Facebook Ads or, um, something like that. So based on what you're building, where would you say that we sit Spectrum before we start on to phase 3. Oh, we're getting up there, 30% of our 5-hour limit. Oh, got some more pictures coming through from Drake. What's he got? Oh, Chris, did we get your Sorry, just got, just got back. Kid woke up. Oh man, I hear you. My kid just went to bed. Um, yeah, show me your, show me your project. I'll load it up on the screen. If you have, uh, some kind of preview or, or anything like that, shoot it, shoot us a link. Even if it's a Loom video, we'll watch it, we'll share it, share it with the world. Okay, I'm having read the title of my analysis. You serve my one more question. What's wrong today is control generative UI and there's built-in graduates declarative In phase 6, okay, which one important comment what MCBL section means in their taxonomy. Articles define who assembles the UI at runtime. Declarative means the agent composes novel trees from catalog primitives. Controlled means the developer predefines what renders, the agent merely selects. Our 9 scenarios are hand-authored compositions, module sets, sizes, and weren't written by me in scenario. Okay, so terms keep mentioning there's not even a module in the loop yet, probably puts us below level 1 of the taxonomy. Access, but it's control that deterministic selects. That's not an access, the Breeze deterministic-first guardrail. Because a flaky generation can't be allowed to stall a live demo. That's true. The widget board feels generative, but the compositions are pre-baked. Why the architecture shows declarative-shaped? Everything in phase 2 locked in is precisely the declarative pattern described in the article. Module registry is typed catalog of building blocks. The widget size vocabulary is the layout grammar, and a composition is now pure data. The distance from here to genuinely declarative is one move. In phase 6, have a module emit a scenario-shaped JSON for an unseen prompt, validate it with Zod, and add it to the same canvas grid. Nothing about the board changes. So I phrase it as we run as level 1 and we're architected for level 2, with the upgrade being a fallback path rather than a rewrite. On MCP apps, a distinction worth making in Google's taxonomy— MCP apps means embed third-party UI surfaces, sandboxed iframes. In their Excel example. Your Google Ads, Facebook Ads idea is MCP as a data source. Agent calls the Ads MCP server and renders results in our widgets in our parchment design language. That keeps us firmly in controlled declarative territory. The only, only the data origin changes. And honestly, that's a better position for this product. The moment you frame— but if you manage to own UI— yeah, you're right, you're right, you're right. I actually agree with that. That said, the widget frame is natural. What should we ever do on true MCP? It. One more module type whose content happens to be a sandbox surface, the architecture doesn't foreclose it. What we deliberately aren't open-ended generation agent writing logic that would break both reliably and design language, I'd argue against. Yes, I agree with you. It's pretty okay. So I actually completely agree with your assessment, and I would stick to that. Concept. Where do we go next? Are we still wrapping on phase 2, or do we jump forward into phase 3? Also, can you generate a new username and password? You can just use, um, test@roofingbit— or use that— use, um, you— adamsandltd@gmail.com as the username. And genuitest26! for a password. Okay, so this— so I'm selling, buying RVs, and I want more leads. Essentially, the store is lead gen tool, but now it's tool for buyers to find an RV that matches what they want. And very difficult to navigate to their websites to find what you're looking for. It's functional but not audited. Landing page is finished, the first of the Find RVs almost done, the rest is raw. Oh, I see. Well, if you have a landing page, let's see it. Would love to share it with everybody, be kind of cool, especially We're trying to help people find RVs. The other guy in here is from Calgary, so I think if Damo's in here, he's from Edmonton and might be in the market for an RV someday. Uh, no, I cannot see the link. Did you type it in the comments or did you send to me as a DM? Oh, there it is. I just got it right now. All right, I'll go to it right now. PerfectRV.ca. Oh, I love those Winnebago Echos. I like Rebel a little bit better. I would want— what is your tow vehicle? I'm not towing anything. No shit, and it got my province. Oh, only Travel Traders Flush though. Okay, let me see that. Okay. Very smart, very cool, very cool. Good idea, man. Can you make it— can you see more pictures? But I mean, the fact that it's working, that's pretty cool. Oh, the menu, menu kind of gets shoved up. You need a larger, um, what's the word? Oh, why am I not— padding, more padding around this module. Yeah, okay, it just jumps into Gmail. Very cool, man, good job. Okay, so your login is live. All right, if you can open up Plotting Chrome to the canvas with my username password prefilled, that would make things easy. And I think jumping into Phase 4 sounds good. Yeah, man, it's baby steps. I mean, not necessarily baby steps now that this Fable's out. This is pretty wild. I mean, the fact that I've used 30% of my 5-hour limit in an hour and 45 minutes is pretty crazy. I'm double chewing it down double. And if I was running multiple instances, that'd be pretty crazy. Oh yeah, I'm— buddy, I'm beyond max. I'm on Ultra Code. So if I go new session here, you can go Fable 5, and then you can go all the way to Ultra Code. So max is down here. UltraCode on Fable 5. And if you've, never seen this, this is a cool trick too. This codex bar, you can keep track of all your models and where you're at on all of them. What I, do I have? No, I don't, I don't have my Adam Sand live still. I would do it, I think I did. I want to check that out. I didn't think I still had my Claw— if I still have my Claw Max plan, I'm paying for it, my personal one, I'll be pissed. Really? No. If I was still paying for Cloud Max and I didn't realize it— oh no, yes, I don't— yeah, I don't— I didn't think I did. Oh, um, I'm on a Cloud Teams account, um, because my whole company has Cloud, so we're on Cloud Teams. We spend probably around $8,000 to $10,000 a month on Claude, another $2,000 on, $2,000 on CodexGPT, and then we have probably another $1,000 on Gemini because it's like an add-on to your— so like a few people have the Gemini Ultra plan that use anti-gravity. Oh, what's this? I'm curious where our buddy, um, where our buddy Drake is at for his GitHub token use, for his, uh, lines of code. Where is it here? You go here and I'm looking for Drake Sigma. I always forget how you find your friends on this thing. I go to my profile. I know he's following me. Send him a picture. I'm actually using the desktop PowerShell console running locally. It's how AI taught me to use Clubhouse. I don't know about the difference between one and— yeah, are you using like CMux? Like this? This is a pretty cool tool. I don't know, what is that, the PowerShell? I've never used that. Is that a Windows thing? Is it kind of like this where you can open up multiple terminal windows inside of one— inside of one— in one software? This is cMox, there's tmox, there's Ghosty. Is that kind of like what you're talking about? Okay, so it's adding the weather demo week. So this is just building up our library of mock data. Do you get auto mode in this cloud code? In which one? In this? Yes, you see down here, auto mode. That's what it looks like, just one window. I open two individual ones so I can multitask faster than two. Ah, so the cool thing about that C-Mux where I had the four windows open is like, one, you can have a browser open inside the window, um, and that, and then your So you can kind of, and then you can have like, so let's say you're working on like 4 work trees or 4 branches in your project. You could be working with like 4 Cloud Code instances on 4 different parts of your app. So if you're looking back at your app, so what was it? It was like free RV or what was it? RV, perfect RV. So you could be working on the— like, you could essentially be working on all four, whatever, five, what was it. So you could essentially open up a work tree for the fifth wheel, a work tree for the toy hauler, work tree for the destination, a work tree for the motorhome, right? And, um, and you could be working on all four of those pages at once as like independent projects. And then you could have a browser tab, so you would have— so if I went into C-MUX again you could— so I could go grand shift D and split this. And so then you could have Claude, Claude, Claude. So you could have, like, um, 4 windows open, work on 4 different branches, right? And, um, independently be planning on different things. And then you could have the browser and you could say, okay, I want you to go to— like, you would have like find or perfect rv.ca in there. But then you would have like your Vercel preview link or whatever. But then you'd have like you know, you'd have like motorhome, and then you could switch between the various, the various examples, right? And so that way you could be like, open this one up in the browser, boom, it would open up browser. Okay, open up this one in the browser, boom, it open up a browser. And so you could be working on 5 different pages at a time if you want, on 5 different work trees. That's kind of the, the perk of, of that. And then you, and you can split them up any way you want. Like if I go Command D, I got another one there. If I Command D, then I gotta split them open here. So if I go to a whole new workspace, like, here. So this is like one window. Right? So go Command D. Now I've got two. I go Command D. I got four— three. Command D. I got four. And I can be working on four different things at a time. This is sick. I think it was on 5, right? Yeah, I zoom in on this. Okay, one-click access. So let's go have a look. We What was it? What was that password? All right, well, let's test it out. Um, check weather was for the week. Okay. Weather module. Need to be able to open up that. I click a job. See there. See all the photos. What is the size of John? Or can you load up the quote for John? Martinez. Okay, so it's still not quite right. All right, so I have to give it an example of a quote. I'm recording a little video for The boys. Okay, so if I go back here— oh, okay, so let's go to which jobs are at risk. I haven't assembled that part yet. See, schedule this week's jobs. Okay, so this is— that one works. Yeah, yeah. Yeah, and then we look at Lisa. Got it. Try schedule this week's jobs. See, does it work to say move Lisa to Friday? I don't imagine this is hooked up to an LLM yet, so it's not going to work. Lisa to Friday. Yeah, preform. Great. Yeah, so it's not, not doing it yet. To sales manager. Yeah, so it's still, still building, but we're getting there. Okay, so there's the demo week. Okay, so one real— so if I go in here, simply answer the incoming phone call, makes the phone ring, answer it. Okay. So assuming I have to go inside sales. This is ridiculous. That's awesome. Okay, we gotta do— we gotta do that again. We're gonna do this on Loom. All right, so let's test it. Hey, oh, this— there we go. All right, so pick a role. Let's go production coordinator. View the pictures. Click here. Do that. Go here. Thanks for calling Reliable Roofing. This is Maya. How can I help? And captured. Dana. Phone number's captured. Bingo. I found it out, I believe. Where did I first notice that? That's the entry storm, the bottom of the garage. It's actually dripping for a while. Single home, two-story. Okay, it's two-story, bedroom above garage. That's really helpful. When the ghost is going to stay in the middle close to the wall, stays in the south house, just along one of the beams towards the garage door. Doesn't make sense. Stays right where the house wall is. That's cool. Okay, couple points of feedback from Phase 4. I think it generates the image too quickly for the demo. It basically is diagnosing the problem before it happens. I think we need to kind of diagnose in multiple phases. You might need to generate multiple image concepts for the demo so that it slowly reveals what it thinks by, um, by analyzing the call. So at the right step of the call, that's when the leak diagnosis pops up. Also, we need a functionality to, um, perhaps adjust the size because some of the UI elements, like you can't see all of the weather in the city on the weather module. So either the user needs to be able to adapt the size of it live in the pane, or they need to be able to click it to expand it and close it. So like it could pop up a modal window to let them see more, or it just needs to think a little bit smarter about how it actually reveals stuff so you can see the full thing, um, or be— yeah, something like that. And if it's booking availability, it should open up another module for a calendar and maybe get rid of another module so that when they're booking an appointment, it would show the calendar. And what they suggest is based on like the calendar showing green slots on the next, you know, say 4 days, showing booked times that are not available and available times that could be suggested on the call. And then it picks up what you say on the call and it books the appointment on the calendar. And it would be by sales rep, right? So it needs to kind of have like if there's like 3 slots available because there's 3 sales reps, and it should show like, you know, red blocks where 2 sales reps are available but a 3rd one is available. So then that one would be able to get booked so that the user is recommending a time and saying, okay, I do have a time with Chris, or I have a time available with, um, Sarah, right? I think we should touch a few things of those up before we move on to the next modules because I think this will help you before you generate the rest. How many people do we have watching still? If you guys are still around, I'd love to hear what's going on, what you guys are thinking, what you guys are seeing. But I mean, overall, I'm pretty happy with what we saw. Curious what other ones were built. Yeah, because it's still very clicky, right? It's not like generative yet, but I think we're getting there. We just have to say, okay, like, now I want the large language model. We'll have to connect LLM to it to allow it to actually function. But let's see how far we get. We still got, we still got 40% of our, our left. We still have 91% here, so we'll see. I should probably check my Cloud Plans to make sure I have enough extra usage. Check it over here. Usage. Where am I at? Not unlimited. I might be running into a limit soon, so I should hurry up, reload. We got an accident context to us. It's overrides. What did it say? All 3 points, the right call on their spine level improvement is worth doing before phase 5. Applies module count. Here's— I'm running them. It's a size menu, live resize on the board, and a maximize button. Oh, perfect. Yeah, new booking counter module, call the call itself, adds to the board, swapping out the address map. Okay. If you guys are just joining, we are building a Gen UI, generative user interface, for the roofing industry. So for example, like, based on what you type, the user interface is different. So like, if the phone rings, you know, you go, oh, phone's ringing, and then you go answer, and it would essentially generate a live user interface that changes depending on the task. So think Tony Stark in Iron Man. He could like, you know, depending on what, you know, like whether he was building the hand for the Iron Man suit or, you know, he's building something else, or he's trying to find where Ultron is based on the gamma radiation, blah blah blah. He was able to kind of make the user interface be what he wants it to be when he wants it to be that. And, you know, when he says something like, as this phone call is being transcribed it's diagnosing the leak with a degree of confidence, or it's filling out the CRM. So you're not talking to the customer and trying to type, it's filling it out itself. Or if you're a production coordinator and you're like, okay, I need to schedule this week's jobs, or the production manager and you're like, what are my active jobs, it generates the UI. But you don't have to actually— like, this is just where you would go based on your role, but when you type things, the mod— the modules would just change. Right? And so it's like, oh, I would do this. But you don't actually have to go to this screen. You would just type something like schedule this week's jobs and it would do that. So that's just the idea, is that these are like quick prompts, but you can just type what you want here, and then depending what you ask for, different things are going to pop up. That's what we're building today. We are essentially testing out the new Fable 5 Ultra code, maxing out some tokens and testing something. So if you're new here, you just popped in, I'd love to hear what you're working on. And, uh, yeah, if you have something that you'd like to see or a question or just something about using AI, I like talking to people, like seeing this. These live streams are very experimental in nature. It's not me reading the latest model host, it's me saying, okay, let's actually, um, you know, play with it, build stuff, maybe have stuff go wrong like this, right? Or something can actually go wrong. The idea is like, how do we actually build something and test the— test the functions of it, right? And if you're just hanging out to lurk, that's cool too. I, uh, it— again, because this isn't like a webinar or like a YouTube— like, if you want to watch like a YouTube video that's scripted, I got lots of those on the channel. Um, this is more for like just actually working on something, and so we're you know, 30%, 50% through our 5-hour limit here. But this is my first time testing on Fable 5 and seeing what we're actually doing. And so the idea is like, okay, how do we generate this? How do we generate this thing that like this— the whole like the concept is like everybody's building a— using the AI of today to build the software yesterday, No, no shade towards these guys, you know. This is a, uh, another one of the many roofing apps that are coming out, right? And the idea is like, okay, great, you know, it's, it's got the same old thing, right? A menu on the left, you click it, it's very controlled in— it's like you go to the clients section or the jobs section or the photos section and you kind of choose the thing that you're gonna do, right? And like, these people are selling the software, but their testimonials aren't really it. So I kind of pick on them. Um, but the whole idea is like, why are we building yesterday's software with today's AI? Where like, even in the demo, it's like, you know, the— but like, this stuff isn't even aligned, right? It's like, this is what we're selling is like stuff that isn't even— if I go, I believe it was right here, scheduled job— it's like, it's not even aligned on the picture. And so you know, we're building yesterday's software and we're building it like— we're building it like ramrod, right? Like, we're building it too fast. And the whole idea is like, how do we build something that is the user interface of tomorrow? And that's like my idea of like Tony Stark, right? Like, you actually— he actually has the user interface that he needs for the project that he's working on, you know. So it's different every time. Now, obviously we're not a billionaire, we don't have unlimited Opus tokens probably holograms, but what's the thing on the way here, right? And so for about 2 years I've been working on this, um, this repo. And the reason it's taken 2 years is because we designed it with the, um, with the concept of like, well, what would we do if AI was a third of the price and 10 times as powerful? Let's start planning for that rather than building for what exists today. And so I figured, well, this is a perfect time to finally see that dream come true because apparently Fable is incredible. And so far it has been quite incredible. All right, so all 3 touch-ups are built and verified and pushed, screenshots attached. So resize and expand on every widget. Each widget kind of— Chrome now has a size menu. Booking calendar with call summons. Okay, the quiet one is mutate board is exactly the Protos phase 6 agenda. Okay, so all right, yes, let's roll into phase 5. Always gotta say thank you once in a while. It's gonna eventually be a robot that takes over the world, so you gotta say thanks so it remembers that you were one of the nice ones. 15+ modules. Okay, so he's bringing the rest of the scenarios together. Perfect. So see a couple more people hopped on. Thank you guys for being here. Um, we are just building today with Fable, uh, first time trying it out. And so we are building a generative UI concept, and so it's for a roofing industry. And so the whole idea is that it is a— and again, this is just kind of in a testing atmosphere right now. But actually, I think if I can refresh this, we would now have the ability. We'll see. This might not be the newest branch, actually. I'm sure we'll go over here, over here, over here. I have to remember, what was that? Nice. And we are able to click this. Tall, go large. Okay, go hero, small, wide. Cool, tall. Then we can just go like that. Cool. Oh, hero. Okay, cool. So I'm probably gonna have to go load up a proposal. So I'm gonna need to find a single quote example. It's been a while since I've done— since I've done one. Oh my gosh, where would I find one? Um, true, it's been so long since I've— I need to like find an old roofing proposal from our SumoQuotes. Where would I find one? I haven't built one in so long. I'm gonna be struggling here. Um, well, we're gonna have a look. Let's see if Gemini can find me one. I'm looking for PDF examples of a roofing proposal. I think I have some real examples from Bay Valley Roofing, Rhino Roofing, Bumble Roofing, TruWorks Roofing, or Oberg Roofing. There might be something in our drive somewhere. These are examples of quotes for a roof. And since I don't know if that's actually going to bear fruit, I might just go looking for myself. I'll split these windows out so I can see both at the same time, see who finds it first. This would be a PDF file if you found it. It might say SumoQuote, or it might be in a folder about SumoQuote. It might also be in folder names of the company names. Okay, let's go ShareDrive, certain projects. See, almost. Let's see here, who would I My brothers might have one. No, why are there no files in here? Here we go. It's a decent one. Let's look at— they're all pretty old. Yeah, let's use this one. Okay, download it, and we're going to get rid of this, and we'll hop over to Cloud Design. We're gonna have to generate this in the branding. Where did it go? Son of a gun, let's go to where I downloaded it. Okay, so we're gonna have to go back and do that again. And if you guys are hopping in, love, uh, so I waited for it to actually download. There we go. Okay. I want to pull the design elements out of this PDF and essentially rebrand it to the Foundation Project design standards using the design colors. But keeping the hero pages intact. So the company that this proposal represents is Two Works Roofing, and their colors are the green and black. So you need to kind of strip out the green and black branding and adapt everything to the Foundation project branding. And let's go opus. Well, you know what? Let's, Yeah, let's, let's not burn too many credits. All right, so we're gonna let that cook. If you're hopping in, I'd love to hear where you're from, what you're working on. We're testing on Fable 5 today. We're building a generative UI, and I got to this point, I realized, yep, we're gonna have a proposal in here because we were talking about financing up here. I was like, right, it's going to need an example of a proposal. And so I will need to give it an example of what a proposal will look like so it can generate that, because it's probably gonna put a proposal in Yeah, yeah, yeah. So we're kinda gonna have to wait for this now to generate our proposal. So I'm taking an example proposal from another customer and saying, okay, just strip out that proposal as it existed. So if I pull up that proposal from our downloads— so I basically said, okay, this is the example proposal from a client that we built. I kind of said, okay, the colors are like the green and black, so you need to get rid of the green and black and rebrand it to the brand standards that align with the rest of this. And the whole idea is that we have like an example design. I'm going to take it out in HTML, not a PDF. So I'm going to say, okay, I want to regenerate this in a PDF or an HTML format after Claude Design kind of rips it and changes, changes all the branding. And then I'm going to say, okay, I want this. Then I'm going to say, okay, for this tool— then this is, this is a little old like that. I mean, our design's got a lot better since here. I may even— I might wish I did another proposal because this is actually— this is like the third company we ever built a SumoQuote for. So that's not even the nicest ones we ever made, but yeah. So then I'm going to say, okay, I want you to have the option— because the one thing we don't have is like a proposal in here. And so the idea would be like, we want to be able to show what a proposal would look like and then have the customer be able to live modify their financing, because that's one thing we want to do. Because then that— because that option that I gave it, there was multiple options if I remember correctly. We have good, better, best. Yeah, we got Marquee Vista, Legacy. So we got a 2-option quote, so this is good. But the unfortunate thing is, is it wasn't priced properly. That's okay. And so this— in this example, the user interface actually modifies based on the chat. So like based on whatever you ask, it's going to— you have either preloaded modules or you, based on what you ask, the UI changes. So it's not like you go into a particular page, it's just based on whatever you're talking about, the user interface adapts, modifies. Kind of like the— if you've been here for a while, you've already heard this a couple times. The idea is like going to most CRMs people are building, we're using today's AI to build the CRM of yesterday. When we should be saying, like, what did Tony Stark have, right? Like, what does the user interface look like in the future? It's probably gonna be, you know, sans holograms, but like, it's probably gonna be like whatever Tony Stark wanted to work on, the screens changed based on what he was doing, right? So you could even have two screens. You've loaded up this canvas two times and you could have your one screen that has this, your other screen has this, but based on whatever you're trying to do, the user interface would change. Before we move into phase 6, do I have the ability to give you an actual API key so that this could not only be a kind of mock example, but so that we could actually query a language model and switch the models or modules based on the prompts given. I'm just curious if that's possible or if that would be a phase that we add on to the end. Where's Claude Design at? I want to do slash, by the way, in here. No. So if this is something cool you're interested in, let me a comment, let me know, um, if your fingers ain't broken. Plus it just helps with the YouTube algorithm. I don't do live streams all the time, but when I do trying to make them like real working sessions, like where I actually try and work through something real and say like, you know, could we do this? So today it was just a test of Fable 5. I want to see what— I haven't got a chance to test it yet. And so for everybody's sake, I thought I would try and build this concept and just throw a, uh, throw a big task at Fable 5 Ultra Code. So if you see here, if you haven't used Fable yet, there's this Ultra Code mode and we're trying to use it out. And so, and you know, basically right on time, we're just over 2.5 hours and we're at 50% of our token limit and 62% of our 5-hour usage limit. So making pretty good time. Okay, so we got some questions. So, um, The goal is to have something come out in HTML that we can modify. So I think of it as a modern scrolling web document that we can later modify. If it's possible, extract the photos from the actual proposal. Change it to a different class of roofing company. Change it to a different class of roofing. Okay, so, uh, it isn't an add-on phase, actually a base fix designed to be everything built so far. The chunkbar keeps current behavior. Smart matches, or calls a Cloud API using structured outputs, turn juice on matching. That was on. Okay, I gotta go give it an Anthropic API key, so we're gonna have to go API keys, generate a new one. Um, we're gonna go, uh, I'm off to get a safe link. Well, I appreciate the support of you guys watching all this time. I just wish I knew what you guys were thinking. I don't know if maybe you guys are commenting on a different platform that doesn't come through. I get Facebook, LinkedIn, YouTube, and X on here. So if you guys are commenting and I'm not seeing it, then I, uh, I apologize. I'm missing them. Well, this thing seems to be coming along. Hopefully it's not getting anything yet. Okay. Once we have this, then we can download this HTML. We should be able to put it into the proposal— proposal. We should be able to get it to essentially have the proposal in there. Oh, what do we have? Why do we have a task failed? You're installing the Anthropic SDK. If anybody should know how to do that, it should be you. We're wasting my tokens. Oh no, oh no. Damn it, my Claude Design task jumped me way up. No, I might have to go buy a Claude Max plan just to— Approaching session usage limits. Stop it! Oh man, well, 2 and a half hours to 2 hours and 47 minutes to hit my 5-hour limit. Yeah, tracks. Damn it. Well, we might be cutting the show before we get to finish, guys, unless I want to hang out for till 2:40 in the morning, 3 hours. Yep, I killed my, killed my, killed my limit opening up Claw Design. Son of a gun. But who knows, is it going to finish this SDK? And because is it going into phase 6 as Well, I believe it is going into Phase 6. Yeah, yeah, it is. Yeah. So what this is, basically, this is the system prompt for the, for the Generative UI agent to say, okay, based on the intent of— so you have this catalog of modules, this is a little bit bigger, then these widget sizes. This is, okay, based on the intent Right, each module reads, writes. Okay, so you're going to basically wire up this mod— these— fill these modules. You're not going to just fill space, you're going to only fill with the modules that align to the intent, right? And so the whole idea is— and then this is how it basically composes those. And what is this? Configuration server route. Okay. Okay. So it pulls out context key values. So he says, like, based on what we said, right, it will get those models— modules to the place. And this is the module catalog that is referenced down here, up here. So, yeah, this is catalog lines, right? And that is this. This is the catalog of modules that are available. Nice, nice. We're getting— so, okay, so we're starting to get a style. I mean, I really appreciate the support of you guys hanging out live. This is a good— is good for the algo, but wish I could converse with you guys. There's a private chat on here. Is anybody private chatting? No, no. Okay, so what is this? I guess this is pushing the kit. Live and unseen prompt: angry voicemail about their unpaid balance. Composed by Claude. An angry voicemail. Okay, so then that Canvas now genuinely generates UI. All 6 phases of the brief are complete. Screenshot attached. Proof. Okay. First, our fetch only hit. Okay, so nothing was lost. Protection setup. Okay, free text router can't match. Now goes to server route. Okay, the catalog, the model. Okay, response is constrained by structured output JSON schema. The model, module IDs and context keys are enums. The model cannot return anything unrenderable. Revalidated was on, handle the same canvas grid that handles the hand-built scenarios. The catalogs.schema and API schema are all generated from one set of runtime race, so they can't drift. It's key optional. No key, composer offline. Toast and chips remain the past. A live demo can never stall. Okay. The live results, we have two unseen prompts, both composing itself. Thank you. Ready for Monday standup. What's on deck and blocked? —give me everything before I read— okay, that's what it is. The R keyword was substring matching, so it was like prepare and hijacking the intensity of counting scenario. Ah, okay, I get it. This container is ephemeral, so the key here only powers local testing in this session for the Composer work on the Versa preview. How to drop a key to the Intensive for Sales Product environment. Okay, so I'm going to give this to another agent. So we're going to go— should probably go off screen for this one, so I'll pull this over here. Are you able to add a API key to a Vercel project and environment variables for me? Stay over here working. This thing is still working. What do we have for session limit? Yikes. Yeah, we're gonna run out. Oh, I wonder if I'm gonna get this back before my session limit gets hit. Okay. I love how everything picks that picture. I believe we had a Phase 7. If I go up far high enough, man, that's a massive chunk of work. I'm amazed. Like, this thing is legit different. So where was it? 7 phases. I might be allowed to keep going. Because of my extra usage, I'm wondering if it locks me out of my 5-hour limit or if I can keep going. How does this— I forget if this thing had a upside sales. It did not. So if you just— I just saw the user count went up by one. If you're just hopping in, we're building a, building a generative UI roofing canvas app, not for canvassing but for actual, like, an actual canvas. Um, so where the UI adjusts based on the role, so it function kind of like this. So based on what's happening, it actually like tries to diagnose a leak live on a call based on a transcript. It's live, but this user interface could change based on, you know, whatever is actually happening in the app. So for this one, we answered the incoming call Now this runs like this, right? We're just testing out Fable 5. When I hit my session limit, we're going to see if we can actually, um, just go like this. I just want to just go in here. Oh, I need to see— actually, I have on this other window. Okay, so I need to go slash— this would be the one link to the Foundation project. And yes, you can run the Vercel login on your machine, and then we can add this key to it. Also, if possible, can you unzip and add the zip file that I just gave you and add those files to the branch that I'm on, which is So my current session has access to it. I'm working on another screen. That's what you guys can see it. It's the safety screen so that we don't get ourselves in trouble. What was that sound from? Okay, so what's Hermes doing? Okay, so, okay, I will airdrop it to you. Share, airdrop. And I guess I gotta switch to the Hermes machine over here. So if you guys don't know, I have like everyone— so it's accepting. What? —mouse right there. All right, there we go. No problem. I actually AirDropped the folder to your machine as Trueworks Rebranding Guide. That's the folder I want uploaded to that repo. 3 hours going strong. Okay, this is ready to go. So yeah, so this proposal is ready to come into here. So basically using Cloud Design to replicate, build a proposal template And then this is what we're going to bring over into our canvas so it can— we can add a sales rep module, and that way our canvas setup would work, but it'll also have the ability to generate and send these proposals. To see if we logged into Vercel on this other machine. Hasn't tried the Vercel login just yet. That's on the Hermes machine. Okay. Just gonna go get the exact repo link. And you can use this branch on this branch. Do not optimize any of the images, that's fine. Oh, no PR is needed, it can just be on the number 11 PR. Then run the Vercel login. What is my day like tomorrow? How tired am I going to be? Ah, it's not too bad tomorrow, actually. Hermes is working. Leave it open. Is it commit to PR 11? Open up a new PR. Yeah, I did. Oh, I'm starting to get tired, boys and girls. Faye will wipe me out, but I really want to get this last bit in there. I can just get this Vercel key uploaded. And then do the— and then do the proposal bit, I think we're good for the night. Okay, there's Marcel. I approved it. You should be good to go. Oh, you know what? I wonder if I need to add Yes, please. Oh, we're finally starting to see people drop. Sorry guys, I know this is boring. I'm, uh, I'm just trying to get this project done, but I got API keys and stuff I'm doing on another screen. I got my Hermes agent over here doing some work in Vercel, and this screen is kind of boring right now. I know that. I apologize that it is— you're dealing with that, really, I do. But I promise we're gonna move on to something cool here in a second, as long as the, uh, as long as my cloud limit holds up. And for those of you who are still around, again, I haven't— I, I know this is boring right now. I feel bad, but figure out— keep it open just in case somebody actually wants to see the cool thing next. But if you, uh, if you're here, you know, throw a comment in the chat. Love to see what you guys are working on because you guys are clearly up doing something too. And the values are already accepted. Just need to send an empty line for all preview branches. So only— still only production appears. Call on branch is real thick. Provide the branches and arguments. There's no second let me check your Purcell. We have flags, CLI takes git branch positional arg, so preview branches, okay, got it. It's just banging around inside Purcell. That probably would have been faster if I did it myself, but I thought if I could coordinate Hermes and everything on this side, it would just be faster, but it clearly was not. So for those of you joining, I apologize, the screen's a little boring right now. We're working with Fable 5. Um, I've been working on it for about 3 and a half hours and developing a generative UI canvas. Um, so basically whatever you chat down here, it can load up a different UI based on what you actually want to do. And so, you know, or you can make them bigger, you can pin a view, you know, you can adjust the size. But it basically, whenever you chat, it will, um, it will load. Like, I've got it preloaded with some options just to see. Like, if you said, like, you know, do something, it would load up the screen that you want to see. Or load up the UI that would help you. And then we are just at the phase now, so we're at phase 6, and we're at the point now of building in the roofing proposal so the roofing proposal can be generated in here. So we're adding another user type to the canvas, but basically the idea is, is depending on the user and then depending on the questions the intent will generate a custom UI. So if I go start over, like, these are some example intents, which is like, who do I follow up with today? And it would load these up. We've actually since redone this, so I don't know, I'm on an old, um, deployment, but the idea is that these are actually filled out now. But the idea is that you have, rather than designing an app like the yesterday, right, where it's like you just have like buttons on the left pre-designed user interfaces on the right. The idea is that you're— whatever you're doing, you get a live— you get a live interface, right? And it's based on role, it's based on the intent of the query, and it can modify the UI as you go. Okay, and so I'm gonna give this here. Okay, so bring my mouse back to the— this main unit. So here. All right, the Vercel API key is now live and it is currently building a fresh deployment. That is from my coding agent. Oh, I ran into an error, but All right, so do we have— it's just finishing up. That's my coding agent. It was running the Vercel deployment for me. It's just wrapping up, and I refresh this. I also want to add a another user type which is outside sales, and we want to have the ability to have the proposal and create a engaging experience on site that allows the customer to pick the roofing option that they want, and based on questions that you ask the customer at the house actually get financing programs. So you could essentially imagine yourself as an outside sales rep sitting at the kitchen table with the customer and just being like, hey, Mr. Customer, you know, obviously this $12,000 roof is expensive. How much can you afford every month? And so then the customer would say something like, oh, I can afford $200 a month. And then it would say, hey, based on, you know, the budget of $200 a month, which financing package would work? And there will usually be dealer fees built in, so it's like, say, 0% for 12 months, or 4.9% for 24 months, or 9.9% for, let's say, 72 months, or 16.9% for 120 months. And so when we're in the financing section, we're not talking about the total price, we're talking about the total price plus the dealer fees. So we kind of hide the total price and just talk about the finance payment. And so we're trying to create a financing experience with the ability to pick from the upgrades and have the upgrades just modify the monthly payment and not show the final price. The whole idea is we're trying to create an in-home sales experience that allows the sales rep to demonstrate the proposal and then get to the point of having presenting both options and create a dynamic financing experience for the customer where they can also pick the upgrades and then click apply for financing. I've attached an example proposal that's on brand that you may need to modify, but it's a good starting point. We added the files on this push. All right, we're cooking now. Going into our— I think we're going into our extra usage at this point. Is this still working? So I guess we do get, um, Babel on extra credits, so this is good. Well, let's go look at the new version. What is it like? What the hell is that password? It's like finding a needle in a haystack now. Nice. Invoicing Amanda Foster, 29 days overdue. So now Sec. Oh man, I'm getting no sleep tonight. I think it's about time I cut this live though. I think that we've kind of had our fun. Um, if you're interested in more stuff like this, if you enjoyed this video, if you actually made it to the end of this video, um, and you think this kind of generative UI concept is pretty cool and you want to learn more about what we're up to, uh, hit me up in the comments or reach out to me at roofingbusinesspartner.com. We will talk to you again soon.










