SPEAKER_00 0:22

Today, we're going to get in vibe coding, and not only are we going to talk about it in theory and the implications of it, but we're actually going to do it live on the episode. So you might want to watch this one on YouTube. Once again, welcome to the Digital Customer Experience

Why Vibe Coding Matters

SPEAKER_00 0:35

podcast with me, Alex Turkovich. So glad you could join us here today and every week as we explore how digital can help enhance the customer and employee experience. My goal is to share what my guests and I have learned over the years so that you can get the insights that you need to evolve your own digital programs. If you'd like more info, need to get in touch, or sign up for the weekly companion newsletter that has additional articles and resources in it, go to digitalcustomer success.com. For now, let's get started. Hello and welcome back to the Digital Customer Experience Podcast, the show where we talk about all things digital in CX. I'm Alex Turkovich and I'm so glad you're here with me this week as we're talking about vibe coding. Now, um, if you attended the Customer Success Uh Summit in Austin, you'll know that I did a live vibe coding session on stage where we built a customer value uh story generator. Super cool uh use case. Um, and so I wanted to actually bring some of that content into the podcast uh so that you can also partake if you weren't able to attend that event. So um before we actually do a live demo, and yes, you know, I'm gonna vibe code something on the podcast today so that you can watch it. Again, you may want to resume this episode um on YouTube going, you know, going forward from this point because I am gonna be sharing a bit of content, a couple slides that I shared as well, and then you know, again, you I'm gonna basically take you over my shoulder so that you can watch some of this stuff. I think there's some discrepancy out there or maybe some misunderstanding about what vibe coding really is all about. And one of the metaphors that I like to use is essentially a construction industry metaphor. The point being

Architects Not Bricklayers Metaphor

SPEAKER_00 2:23

that coders of tomorrow are not gonna be construction workers, they're gonna be the architects, right? So when you think of traditional coding, um, you think of, you know, hands on keyboard, folks writing code line by line, and those kinds of things, that is essentially in construction akin to somebody hauling bricks or mixing mortar or doing those kinds of things. Whereas in vibe coding, you know, you're essentially becoming the architect. Um, and this is happening right now in software development, but it's also happening right now outside of software development. Uh so you're not necessarily hauling bricks around and actually doing the construction work. You're making the decisions about what you want the building to look like after it's done. And, you know, to some extent in the process and making adjustments and those kinds of things. So, you know, AI, the construction crew, so to speak, handles the construction and the implementation, and you handle essentially the vision and the vibe of what it is you want to build. Now, there are some implications here. I've consumed a lot of content about this in recent months, and the implications are essentially boiled down to three things. First off, we're going to start seeing a lot more niche uh micro-SaaS

Three Big Business Implications

SPEAKER_00 3:41

software out there. Things that are developed to do a very, very specific thing in a very, very specific way. Um, because you can now essentially code or you know create these kinds of um software applications, web pages, all those kinds of things that do a very specific thing. The second implication here is that teams are now gonna have the ability to essentially solve their own problems instead of immediately looking for a vendor, a software vendor doing an RFP to solve their problems. Um you're gonna have teams that develop tools and applications that help them with a business process and help them with a business process in the way that they want to operate that process. And that leads to the third implication that, you know, in the not too distant future, the days of bending your own processes to the way a specific software operates are somewhat limited, to be honest. Now, of course, we're not getting rid of Salesforce.com or HubSpot or Gainsight or Vitally or any of the CSPs or any of those big platforms anytime soon. There is a lot of inherent complexity and functionality and infrastructure built around these uh fundamental platforms that you're not just gonna go vibecode, right? Let's kind of shove that to the side. That's not to say in 10 years you won't be able to, or maybe less than that. What I'm talking about, though, are all of those other things where you are manually doing things in spreadsheets and you know, docs and other places that could be an application or an automation. It could be something that feeds data and information into one of those platforms like a Salesforce or a HubSpot or works collaboratively with them via the API or whatnot, right? So we're somewhat limited right now in terms of our imagination of what could be built with this kind of technology. And obviously, also there are some security implications here because you know with generic kind of vibe coding, you're just kind of putting stuff out there, not necessarily in a secure way, right? So what I'm not talking about right now is things that handle sensitive customer data, although you can definitely do that. And if you, you know, if you hire somebody to vibe code that does have some engineering background, at that point you can you can probably build something securely. But for your everyday, what what I'm here to really talk about is just everyday usage and potential implications for vibe coding in your day-to-day. When we talk about vibe coding, there's really a uh kind of an iterative loop process that we follow when we write something or when we vibe something. And this iterative loop essentially takes four steps. First

The Four Step Vibe Loop

SPEAKER_00 6:49

is the prompt. You describe what it is you want. That's pretty self-explanatory. And of course, good prompting equals good results. Uh, the reveal, which means AI builds it somewhat instantly. It takes, can take seconds, can take minutes, depending on what you're building. Then comes the vibe check. You look at it and you say, okay, change the functionality of this button, or you know, this field doesn't look quite right, or you know, the the colors are a little bit off, or whatever the, you know, whatever your feedback might be, you work iteratively with your preferred vibe coding tool to make those changes, and it'll make those changes, which is essentially the refinement step. You're you're vibing back and forth with the AI so that it matches hopefully the picture in your head. And again, the better you are at prompting up front, um the easier it is. And and I've got a huge unlock for you here in a second that um that will make that first initial prompt pretty much like it'll get you 80% of the way there. Now, quick note if you're building something very complex, I'm talking about um building you know, a web app with multiple tabs and sections and databases and all that kind of stuff. Um, and by the way, you can vibe code spreadsheets as well. Claude is especially good at that, where you can build a very complex um spreadsheet or model, or you know, I've used it for a staffing model, for instance. Um the more complex it is, the more you're gonna want to take things in bite-sized chunks, just like a software developer does today. In other words, you're not gonna want to vibe code the entire thing all at once. Um, but you are, you know, it's good to get a general layout, but then you're gonna want to focus on quote unquote feature by feature. Uh, focus on building certain functionality out and then moving on to the next rather than just you know vibing on the entire thing itself. We'll jump into this here in a second, but one of the things that I wanted to give you some practical advice on and just kind of a lay of the land on is what vibe coding tools are out there and and and do so in order of sophistication, so to speak. Now, I can't take total credit for this, although I have amended it a little bit, but um, Sabrina Romanoff, if you don't follow her on socials, she's all over TikTok and Instagram and YouTube. Sabrina Sabrina Romanoff is a

Tool Stages From Beginner To Pro

SPEAKER_00 9:29

fantastic AI educator. I've spent a lot of time consuming her content. And so she has these four stages essentially of vibe coding tools. The first one being you're essentially you're a non-technical beginner, you're just getting in, you're kicking the tires. Maybe you want to build a simple landing page, a lead funnel, simple tools. You're gonna want to look for a tool like base 44, for instance, which is you know very, very simple, but also somewhat limited. Uh Google AI Studio as well, if you're in the Google Suite, check out Google AI Studio because it does it allow it does allow you to do some vibe coding, but it does a lot of automation type stuff too. Um, if you happen to be on a WordPress instance and you want some WordPress done, um those three tools kind of fall into this stage one category. So if you don't even know what vibe coding is and you want to just kind of figure it out and build some simple stuff, um, check out base 44, Google AI Studio, 10 Web. When we move to stage two, we add a little bit more complexity and a little bit more capability into the system where you know you can have most of these tools allow you to manage, you know, either your own database or use their native uh databases, for example. Um, these tools can be a little bit harder to fix bugs or make edits without just burning through credits. And so again, that points to what I alluded to earlier, where you're gonna want to spend a little bit more time up front making sure that you are prompting really well from the get-go. Um, but some of these tools are emergent, lovable is probably the biggest one out there that a lot of people know about. Bolt.new and replit are among those in this category. Not the only ones, but those are kind of like the front runners, so to speak. So that's kind of that stage two intermediate vibe coder. Stage three is where you're moving if you do have some technical background, but maybe you're not a software engineer, but you have some code level familiarity. These essentially AI-powered IDEs allow you to much more easily refine and debug and expand on code that was generated in earlier um stages. And you know, it's it's pretty common for you to maybe do a prototype in a stage two tool like Lovable, and then move over into, you know, let's say Cursor or Google's Antigravity to do some more enhanced uh coding and revisions with these kinds of tools. So again, cursor AI, Windsurf AI, and Google's Anti-Gravity, which is super cool, um are essentially in that stage three. Now, stage four is this is is going to be your your highest quality uh and and highest bang for your buck um output in terms of being able to build code in a truly kind of agentic way. Um and and you know, stage four is essentially what software engineers are using today to build like production level high-quality code. Uh, it does require some technical oversight and know-how to be able to manage and maintain the code as well as to implement security features. But this is, you know, this is the stage you move to when you have hundreds and thousands of users and uh, you know, a complex code base to maintain. Uh, you're gonna basically use cloud code for this. Now, there is a relatively newer intermediary here in the anthropic slash cloud claud ecosystem called um cloud co-work, which essentially what it does is it combines claud code with just claude chat um and is is uh acting as an interface, so to speak, between claud code and claude, so that you can get those kind of claud code outputs um using natural language, so to speak. But um again, if you're if you're really advanced or whatnot, a lot of folks are going to be using claud code um probably within something like Visual Studio. So those are the four stages of uh vibe coding tools. Again, shout out to Sabrina Romanoff for the baseline of this. What we will be doing here in a second is I'll break into a screen share and we can start vibe coding. The process that I like to follow, and this is probably the biggest unlock for getting the best results possible from your first iteration, is that, well, first off, you're gonna want to gather your context. So, you know, whatever

The Prompting Unlock And Template

SPEAKER_00 14:20

tool you're building or spreadsheet you're building, or whatever it is you do, you want to gather as much context and details about what it is you want to build as possible. Because the clearer you are up front with it, the better your result is going to be. So, what are you gonna build? What's the problem you're trying to solve for? What do you want it to look like? What features do you want to incorporate? What aesthetic are you going for? What do you want it not to do specifically? Those are the kinds of things that you'll want to gather when you're doing this. Now, um, here's where my biggest recommendation comes in is do the initial prompt or produce the initial prompt outside of your vibe coding tool. So you're gonna use whatever you use on a regular basis or prefer ChatGPT, Gemini, or Claude to generate that initial vibe coding prompt for you that you're gonna then put into uh that vibe coding tool. Now I am gonna give you that that prompt that I'm gonna show you shortly so you can you know use it as a baseline foundation. Um but essentially what you're asking ChatGPT or Gemini or Claude for is you know, give me a ready-to-go prompt that is, you know, that I can plug into lovable. Let's say we're gonna use lovable today, um, so that I can get the best result possible. So what we're gonna actually do here shortly is we're going to go into one of these tools, we're gonna ask it to give us the vibe coding prompt, and then we're gonna go into the vibe coding tool, we're going to pop that in and get uh, you know, and and watch it essentially build something for us. Now, in terms of what you want to build, this is where the infinite possibilities essentially open up where you can and okay, I gotta be honest, it it took a pretty big mindset shift for me to start thinking about how I could incorporate this into my daily life. So, I mean, look, one of the first things that I vibe coded for myself was a tool to help me publish these episodes that you're listening to. Um, because what you don't see

Real Use Cases For Daily Work

SPEAKER_00 16:43

coming out of recording these episodes is all of the post-production work that goes into it. Um, yes, you gotta edit the show and do all that kind of stuff, but then you know, you've got to have your show notes ready for YouTube. You have to have your um, you know, chapter, chapters and timestamps ready, uh, as well as your description. You gotta have your show notes ready for you know the podcast platforms, uh, you got to have some LinkedIn posts ready to go, you gotta have some a newsletter companion ready to go. Like it's there's a bunch of outputs uh that we can generate pretty easily now uh with the input of let's say a transcript, for instance. So what typically what I'll do is I'll get this episode edited, I will export the transcript with timestamps, I'll plug into this tool that I vibe coded, and the tool in I don't know, 10 seconds or so gives me all of those outputs so that I can then proofread them, make some edits, pop them into whatever tool, YouTube or um, you know, podcast platforms or whatever, so that I can, you know, really quickly get that content updated and I'm not spending a ton of time writing. Now I know there are some people out there that will be like, hey, he's just, you know, you're using AI-generated content. And um, yeah, I I take issue with that a little bit because the content is all mine. The transcript is not AI. This is me talking, this is me sharing ideas, this is me talking about these things specifically. I'm I am using artificial intelligence to, you know, create the outlines of things and to identify key moments um along a podcast's kind of episode and story arc, so to speak. Um, and you know, I'm I I am a big kind of advocate for having artificial intelligence do 80% of the work for you. I am not an advocate of just having AI do stuff for you and then you blindly posting stuff because I've seen that done and it does not look good, and you can tell. Um, so you know, whenever whenever you use artificial intelligence just in general to create content, you always gotta give it that human eye and you always gotta make sure that, you know, this is actually what you want to say. So I'll get off my soap soapbox around that. But point being, that was one of the first things that I vibe coded was a web app that helps me take a show from transcript to a bunch of different assets that I can then take, edit, and implement in a fraction of the time that it took me before artificial intelligence. When I first launched the show, I would spend a half day basically um, you know, pull listening to the episode, pulling out things that I wanted to make sure were in there and those kinds of things. So that's um that has been a huge lifesaver. Um you know, it when when we were uh debating on what to vibe code during the conference last week, there were a lot of ideas uh that were brought up in that in the process of doing so. And those ideas um were kind of all across the board. A lot of it was like personal. Somebody said, hey, let's vibe code like a kid's chore chart uh or a chore tracker or something like that. So you can, you know, you can identify those little moments within your daily life where you're like, hey, it would be cool to have kind of an app for that and to you know really figure out how you can, you know, build something to make those kinds of daily activities or weekly activities easier to do. So for the purposes of this demonstration, um, what I've chosen to do is something a little bit different. Um, it is essentially a live poll or vote app. So it allows you to essentially collect answers

Live Demo Plan Polling App Idea

SPEAKER_00 20:38

in real time that are displayed with you know things like animated charts or whatever. Um, uh the reason why I I thought about this is because, you know, we in the in the conference we did use a uh you know a polling app, ones that you see kind of integrated into uh PowerPoint, for instance. But I thought, hmm, we could probably vibe code something similar on our own and and see if that works. And so what we're gonna do live on the podcast is just you know see if we can live code something like this. And it may fall completely on our faces or it may not. And it may be a really cool thing. Either way, after this episode, I will give you access via the show notes to a link where you can view the app, but then you can also download the the prompting that I used to get to that app. So we're gonna switch over to screen share and uh we're gonna get to some vibe coding. Okay, so what you're seeing here is a Google Doc that I um came up with and already have a misspelling on, which um it gives us our first prompt. I went ahead and pre-wrote it because you don't want

Clarifying Questions In Gemini

SPEAKER_00 21:48

to watch me like write a prompt for this, right? But um, I'll walk you through some of the key points of the prompt. First off, um like any good prompt, you're gonna want to essentially give AI a role to play. In this case, I said act as an expert in live polling survey technology. Kind of broad, but okay, cool. Uh with a high proficiency in vibe coding with level, then I gave it uh basically some context and what I want to build. Um I Said what I want it to do. So I would like you to produce a detailed prompt that I can enter into Lovable to get the best result possible for the first iteration. I gave it a primary goal for the app, which is essentially to run live polls with web browsers, either with an audience or on live streams, for instance. I gave it some specifics on specific features, right? So I said, hey, let's do two views. So let's do a host view and an audience view. Gave it a few specifics there, but nothing too crazy. I said the host should have the ability to display a QR code to allow the audience to scan via mobile phone. The audience view should be responsive so that it can be displayed on a variety of devices. I said the dashboard and the audience view should update in real time based on votes being cast. I said use animated progress bars and vote count tickers. Then I said, hey, you know, features don't need to be limited to the above, but definitely contain the above. And I said, use your practical knowledge of other live polling apps, core features, to determine additional functionality that might be needed. I said, this is going to be interesting. I said, um, basically look at my website and copy some of the aesthetic there. So I'm having it, I'm having, in this case, Gemini go and crawl digitalcustomer success.com to try and pull out some um, you know, some some color language there, maybe. Um, now here is basically the thing that I include in most any prompt these days. I actually just you know copied and pasted it over. But I include this because it's a great method to get even more detail out. So I said, ask me clarifying questions one by one until you're 100% sure that you can deliver this request to a high degree of accuracy. Um, here's something I've been um adding here recently a lot, which is provide me with a confidence score with each question that you ask. Once your certainty score reaches 100%, produce the lovable prompt for me. Do not produce a new lovable prompt after each clarifying question, but wait to produce it once you have that complete certainty. That last bit is something I've been doing recently because a lot of times what it'll want to do is produce a whole new prompt with every question that you answer, and it just wastes a whole bunch of time and tokens, and it's just not useful. So um, yeah, but I always have it ask me clarifying questions. I like seeing the confidence score because it tells me roughly how far we are until 100% certainty. So that's basically the prompt that I'm gonna start with. And again, this is the prompt that I'm feeding either ChatGPT, Gemini, or Claude to get that initial lovable prompt. So I will copy and paste that. And for this example, we're gonna use Gemini for no real reason other than I had it pulled up, I guess. Um, you could totally use ChatGPT for this. I think you can totally use Claude for this as well. I think it just kind of depends on what you're most comfortable with. Um, you know, I am going to use Pro because why not? But whatever you have the most history in and whatever, you know, knows you knows the context of you most, uh, you can use. Claude is a whole different beast. And I might do a future episode on Claude Co-work because there's some cool kind of vibe coding kind of things that you can do in Claude Co-work and Claude Code as well. So that's kind of specifically why I didn't choose Claude for this particular exercise. Anyway, um, we fed it that prompt and we're gonna let it chug for a second. So I just clicked show thinking. Of course, it sounds like a fantastic project. Current confidence score is 70%. First clarifying question: how do you want to handle authentication and vote integrity? That's a cool question. Okay. Uh, should the host have a have a login system to have their polling sessions for future use? I think it would be cool to do a login, but for the for the sake of this demonstration, I think we'll just leave it open. And in fact, I'm gonna put it on the um I'll host it on my website so that y'all can go play with it. How about that? Um, so we're just going to uh for number one, oops, for number one, we're going to leave it open for anyone to access. Okay, number two is for the audience, should they remain completely anonymous using browser local storage cookies simply for the Vogue in twice? Or do you want them to input a name, nickname before voting? Let's do this. Uh let's say that name entry can be optional in the case that a name isn't entered. The audience member who voted will remain anonymous. And I see I misspelled member, but that's okay. Gemini's smart enough. Um let's see. Do we need to say anything else about that? I don't think so. So we're gonna submit that. We're gonna see what the confidence score is next. But you see how we kind of um get all of this out of the way before we go into the vibe coding tool. Um, because these are all things that I would need to A, first think about and ideate on, um, and then implement in later stages in the vibe coding tool. This way we're coming to the vibe coding tool with a very uh kind of well-thought out plan and a super detailed plan. Next clarifying question: what types of question polls should we support? I like it. Uh strictly multiple choice or single answer, multiple answer, word cloud free text rating slide scale. Um for this first iteration, why don't we just do for first iteration? Let's keep it to multiple or single. I can't type today. Multiple choice or single answer um questions where the host has the ability to select which type of question they want to ask. Use the check boxes for multiple choice and radial button or yeah for single select. Cool. Let's see where we end up next. Identifying color palette, current confidence score 92%. That's very specific. Perfect. Uh single answer radio buttons. Um, okay. There's one final set of clarifying questions to get me 100% aesthetics. Do you have specific primary, secondary hex codes for the digital customer brand that you want me to include in the prompt, or should I instruct Lovable to use modern clean B2B SaaS aesthetic? Good place. So I did not necessarily pick up on the colors from the website. I didn't really think it would, but um poll lifecycle on the host dashboard. Do we need the ability to create a queue of multiple questions in advance so that you can toggle them live one by one? Okay, this is cool. So yeah, that second question with the poll lifecycle, obviously that introduces complexity, right? And so at this point, you may decide to reduce complexity and just do a single question at a time. Or in this case, we're just gonna throw caution to the wind and essentially have it build the ability to create multiple questions that it then uh allows the host to move through. Okay, so I have grabbed my colors, primary and secondary from the website. It's that annoying orange that you see everywhere, and uh that green secondary color that I use. And for the poll lifecycle, we're just going to say let's create a queue where the host can pre-define multiple questions that they can cycle through live during the event. Okay, this might get us to 100%. We shall see here shortly. Okay, current confidence score. 100%. That is exactly what I needed. I know. Okay, cool. Uh since I have all the details. Okay, and so here what you'll see is a prompt that I can copy and paste into Lovable to start vibe coding this app. Um, now we're not gonna spend a ton of time on this for the sake of this demonstration. Okay, this is interesting down here, by the way. Um, it says Superbase setup. For those of you who may not be familiar with Superbase, it is essentially a um a database platform that Lovable partners with. And so they have a very tight integration. And for something like this, the app is going to want to create its own database so it can store the questions and the responses and all that kind of stuff, right? Um, and so a lot of times the reason why lovable is so approachable is because you don't have to create your own database and whatnot. It will essentially do it for you, uh, which is super cool. And then it is telling me that I can essentially iterate um with lovable from here on out, which is yeah, it's exactly what we're gonna be doing. But point is I'm gonna copy and paste this. Um, what I would normally do actually is put this into like a doc. In fact, I may do that. So this is the document that I will be sharing with you, or that is shared in the links down below in the show notes. So go grab it. I'm going to add another tab. And this is where I'm going to put in the initial, the uh say first lovable prompt. Cool. And so you see, it does put a very clear prompt before you. This is if we were to just go lovable and start prompting like we did in Gemini, uh, we would be further behind because this is what it's actually, it's actually starting to predetermine what some of the requirements are for the data table and the back end essentially. So it's saying that you know you're gonna need a uh a poll table and options and votes and whatnot. But for the most part, you can directly attribute a lot of this back to you know the prompting and the questions that we got. Um, so just quick scan. I don't see anything crazy that we need to change. What I would do normally is go through this with a fine-tooth comb and just kind of add remove things just based on you know what the image in my head is of this thing. I'm not seeing anything crazy that we need to omit. And there's even some interesting choices here. For instance, ensure

Build In Lovable With Supabase

SPEAKER_00 36:13

real-time changes feel magical. That's kind of cool. We'll see what magical uh we'll see what lovable thinks magical is. Uh, but we're just gonna run with this, right? We're just going to take all of this and we're gonna go over to lovable. This is what lovable looks like. Um, and I'm gonna just paste that prompt in there while we're talking. One thing to note is with lovable, you know, much like a lot of other um, you know, tools, you can uh, you know, predetermine certain connectors you want to use. This is where I could, you know, tell it some of my design choices as well. You can attach files, spreadsheets, whatever it may be. In this case, we're not doing any of that. Um, there is another interesting feature that lovable does have, which is this plan mode. What's cool about that is you can essentially plan the app a little bit with lovable before you actually vibe code the app. Again, this is this would be another thing that I would actually recommend you do, where you're going into plan mode, you're iterating on the plan a little bit before it actually builds it for you, so that then you know you're not iterating after it's already built it. In other words, you're iterating on it so that you're not spending a bunch of tokens iterating in real time on an already built app. In this case, we're just going for broke here, right? So I'm gonna hit submit on that, and we're gonna see what it comes back with. Now, one of the first things it's probably gonna ask me here is for permission for it to build the back end, um, which should be popping up right here, but um, you will start to be able to, as it initializes, you'll be able to start getting more details on what it is actually doing. And so, yep, just like we thought, enable cloud. This is essentially us giving permission to enable SuboBase to be set up on our behalf in the background. I don't have it set to just always allow just because I like that kind of control, but I've just allowed it to. And so now what it is doing is it is establishing the database and it is going to start writing this app before our very eyes. And once it gets a little bit further along, we're actually going to be able to get some details in terms of what is actually happening live. And so, yeah, you start to see those kinds of things populating. And so, you know, if you like watching this kind of thing, you can definitely get the details, or you know, you can close the details if you want to. Uh, this is asking me for some changes it needs to make to the database. This might get annoying if it asks me to do that a lot. Alright, so we're starting to see a little bit more detail populate here. And it basically just told me you're creating a very unsecure app, which is kind of true. So, yeah, it's starting to essentially create the back end, and you can see what it is writing and editing in real time. Okay, so um a couple things. This is about five minutes or so that this has taken me, and um, you'll see we are now seeing a live preview. It has described essentially what it has built, and uh the colors are kind of cool. I kind of like how it flipped at the primary and the secondary. Well, the secondary, I guess, used for a background, right? So cool. Um built the back end. It did have a quick issue, which it essentially fixed itself. But now we have a live kind of view of the app that I mean, okay, cool. It's a landing page. You can go to the host dashboard or you can go to the audience vote, which the colors on this little bit suspect, so we're gonna need to address that. Um, but if we go to the host dashboard, it's super simple, which is cool. What is your favorite color? We are going to select a single answer option. We're going to say red, yellow. We're going to add an option of blue. So now we're basically what we're doing here is we're just testing this thing. Um, and it created a question. Uh, and it is in draft, which I don't really know what that means, but I'm assuming that I can either trash it or I can go live with this question. Okay, the question is live. There is a QR code, and there is a link to go to that question. I will copy that link and I will paste it in this second tab. Okay, so there's my name. Uh, here's red, yellow, blue. We're gonna submit the vote, and now we're waiting for the next question. And I would assume that somewhere over here. So this hasn't come back yet. So look, I mean for a first iteration, this isn't bad. I don't know what I just did. I think I just got uh I don't know. It's closed for a first iteration, this isn't bad. Now, what I would do next is you know, as I'm kind of testing this, what I would be doing is essentially jotting some things down that aren't quite right. So, you know, the button on the front where it said audience, I think it was answer questions, something like that. Uh the colors were all weird here. Now, here I don't see any kind of ability to see answers. And maybe this is because we haven't published it yet, but um, and we can maybe publish it and see if that works. Now, publishing here, you can provide your own URL and things like that for for for you know these kind of instances. You know, I'll just use lovable's URL and we're gonna publish this public and see. Okay, we're just gonna publish this bad boy. And then maybe it'll work, right? So, you know, you can essentially do some testing, and then if you want to iterate on it, um, you're just gonna ask lovable. So um, you know, I would probably start with that button on the front page and say, hey, need to change the um the colors of that. Um, and then two, I would also say, you know, I don't see necessarily where I can view the different questions and the answers coming in and those kinds of things. Now we we've just published it, so we might test it out live here. I'm gonna go back to the host dashboard. What's your favorite color? Is closed. See, and I can't go back and edit it. So that might be an iteration. We say, hey, if a poll is closed, I'd like to be able to reopen it, for instance. Okay, so and you'll also notice that because we didn't don't have the live preview and the sidebar here, that the app is responsive and so it is kind of you know moving things around. We're gonna do um, I don't know, have you ever gone fishing? Single select, we're gonna do yes, no, create poll. Let's maybe create

Testing V1 Fixes And Iterations

SPEAKER_00 44:25

two of them. And maybe let's do a multiple choice and see what that looks like as well. Which of these is your favorite number? Three or four. Create poll. Okay, so now we have a couple more. Um, looks like we are going to launch one of these, perhaps. Okay, so it did update this page, which is super cool. Uh I'm gonna say yes and submit my vote. And then maybe, oh yeah, okay. So now because we published the app, it is basically seeing what's happening on the back end, right? And then if I go and I launch maybe the second one, it'll automatically close that first one. So the point I'm getting at here is that for a V1, this is a really great result. And you know, this is a somewhat complex app, but the point is you can build these things, and it's relatively simple. Now, what I would be doing next is going through taking note of you know what it is I need to fix and essentially having a conversation with Lovable to fix certain things. I would iterate upon it and I would keep iterating upon it until I get to the point where it is what I want it to be. You update the published version and you're good to go. So I'm gonna get out of screen share. Real quick, and then we'll wrap this episode up. When I first did this with the audience at the CS Summit in Austin, uh one of the things I did was I polled the audience in terms of their familiarity with vibe coding. And I was surprised to see that more than I'd say more than half the room didn't really know about vibe code coding. And I, you know, I guess that makes sense. It's it's a relatively new thing, right? And um, it's not necessarily mainstream, but it is incredibly powerful and it is the way that software is going. Whether you're a developer or you're not a developer, it's a thing. And it's a powerful thing. And so my goal for today is for those of you who are vibe coding, kudos to you. That's awesome. That's great. I would love to hear about the projects that you're working on. For those that aren't vibe coding, hopefully this kind of demystified it a little bit and maybe gave you the impetus to go try it out yourself. Now, here's a couple of caveats that I'm going to give you, and then we'll say goodbye. First off, you're not going to want to do this right now with sensitive information, customer information, company information, unless you are a thousand percent certain that the environment you're doing it in is a secure environment, right? Please don't go and create a bunch of like uh, you know, calculators or and things that ingest, you know, data in from your CRM and those kinds of things without really knowing what you're doing and without putting some guardrails around these systems because the chances of exposing that information elsewhere are pretty high if you don't know what you're doing. Second is we didn't really talk about integrations and things like that, but you can build these things in such a way to where they can integrate with all of your data, right? And so again, you're gonna want to do that in an enclosed environment and in a safe environment where that data is being transferred. Third, and kind of relating to all of that, a lot of you operate in a corporate environment that is incredibly locked down. I mean, that's the truth of it. Um, some of you are operating in like a startup and it's a little bit more free, and you can do these kinds of things. So, uh a couple of um words of advice here. First off, build tools. Um, one of my CSMs built a renewal calculator using an existing spreadsheet we were using, we just you know turn it into a web app. The inputs are manual, the inputs are not anything like identifiable from a personal information standpoint. It is literally a tool that outputs things way quicker than you know, actually manually typing things or grabbing screenshots and whatnot. So the the point is build tools, build tools that aren't reliant on your data and go into your day and your week analyzing those opportunities where you can potentially build some efficiency in your day by just vibe coding a tool. Second, do this for your own personal life. Like if there's something that you're passionate about, if you're passionate about gardening, for instance, and you're doing seedlings, you can build a vibe coding app that helps you keep track of where your seedlings are on the trays as they you know sprout. Like, I mean, go nuts because you can you can do this stuff now. You can make these apps that are um that are personal to you and that work like you want them to. Third thing I will tell you is have fun with this. It's it is super fun. Play with it, get to know with it. You don't have to solve a massive problem, you don't have to build a great tool. You just need to know that this exists and how to go about doing it. Because this is going to be one of those durable skills that you need to have in your tool belt in order to really stay ahead of the curve and stay relevant. And again, you don't need to be an expert here. You just need to know what the deal is so that you can have intelligent conversations about it and you can suggest, hey, maybe we should vibe code something like this. So look, I hope this has been helpful. Um and I hope it didn't scare anyone, and I hope it um brought you some excitement about what the possibilities are because it literally, you can literally

Security Caveats And Next Steps

SPEAKER_00 50:40

make anything you want these days for the most part. So I'll leave you with that. Let me know if you have any questions. I'd love to hear from you. If you're doing this stuff, what are you doing? And um we'll do more of this on future episodes, maybe in different little ways. I hope you have a great rest of your week. We'll talk to you soon. Thank you for joining me for this episode of the Digital CX Podcast. If you like what we're doing, uh consider leaving us a review on your podcast platform of choice. If you're watching on YouTube, leave a comment down below. It really helps us to grow and provide value to a broader audience and get more information about the show and some of the other things that we're doing at digitalcustomersuccess.com. I'm Alex Drogovic. Thanks so much for listening, and we'll talk to you next week.