One-Shot Prompting an Agent

[00:00:00]
>> Sabrina Goldfarb: Now let's move on to our Prompt Library, and let's use a one-shot prompt in our Prompt Library. I'm going to open up a new chat just to keep it clean and easy to read, and we are going to go back and see we still have just our scaffolding that we had from before. Now, let's use one-shot prompting, and we are going to build a rating feature in our prompting library. What do I mean by a rating feature?

[00:00:28]
I mean, one to five stars, right? Let's say we want to be able to rate our prompts, one to five stars. We saw that in our reference project. So let me get started with this, and again, you can find this in the extension if you would like. You are helping develop a Prompt Library application. Here's an example of how to analyze and implement a new feature. Okay, so here is where we can see we are initializing this one-shot prompting.

[00:01:04]
I said, here's an example of how to analyze and implement a new feature. I'm going to copy the rest, and then I will go through it with you all as well. Okay, let's go up and take a look. Implement a new feature. Oh, I'm going to get rid of this extra space. Example feature request: add a favorites and bookmarking system. We are not building a favorites and bookmarking system. This is an example of a feature that we may have built and how we decided how we're going to build it.

[00:01:40]
So we had an implementation plan in our example. Here's the user story: as a user, I want to mark prompts as favorites, so I can quickly access my most used prompts without scrolling through the entire library. Then we give it technical requirements to build this feature. Add a heart or bookmark icon to each prompt card, right, which is a really good general example for adding a five-star system because bookmarking also uses icons in some ways, right?

[00:02:10]
Store the favorite status in local storage or in a database. Create a filter to show only favorited prompts. Visual indicator when a prompt is favored, so filled versus outline. Again, this will be helpful because when we're creating a star rating feature, we're going to want it filled versus not. And then three, code structure, right? So I'm really giving a bunch of information in this example, just because I want to show you all of the things that can go into one-shot prompt, and this code structure is talking about the JavaScript, so the data model, how we want to update it in a certain way, how we want to create some new functionality and some JavaScript functions, to give it some examples of how we might do this, and then I also give it some UX considerations.

[00:02:58]
Place the favorite icon in a consistent location in the top right of the card. Use intuitive icons like a heart or a star. Provide visual feedback on click, and add a favorites filter tab in navigation. And we can see I use these three lines, and I'm using some markdown right now syntax to kind of separate that this was my example, and now this is where I want, you know, GPT-4o to take over and look at its task.

[00:03:24]
So now your task, analyze the following feature requests using the exact same format as the example above: a user story, some technical requirements with bullet points, code structure with JavaScript examples, and UX considerations. Now, the feature request I am asking for is add a five-star rating component to rate prompt effectiveness. I'm going to let this run, and we are going to see that it's going to come up with this whole feature story that we're looking for, right?

[00:03:56]
An entire feature story. So I'm going to give it just a moment. Now here you can realize that we did ask for quite a lot of this, right? You don't have to go this explicit with your instructions. This is just kind of to show us examples of all of the different pieces that we can add into this. But now I want to take a look at actually what came out from this output, and you'll notice that no code has changed, right?

[00:04:19]
Because the first thing I wanted to do with this one-shot prompt, and this is a way that I use one-shot prompting a lot in my codebase, is I wanted a plan. I didn't say just let's jump in and implement this, right, even though I gave you an example of how you could. I want a plan. I want to know if all of a sudden the AI assistant I'm using is like, also we could do this, also we could do that. Like, no, you know, let's go through the plan together.

[00:04:47]
Let's make sure we agree on this plan and then let's implement it. Let's get some better code quality implemented by first saying we can pare this down and then implement it. So the user story: as a user, I want to quickly rate how effective a prompt was, one to five stars, so I can remember which prompts work best and prioritize high-performing ones in future sessions. So far, looking good. Technical requirements, add a five-star interactive rating control to each prompt card, hover and click selectable.

[00:05:23]
Nice. Store the user's rating persistently, local storage for now, easily swappable for an API later. Perfect. Display the current user rating, filled stars, and allow updates to overwrite prior rating. Support clearing a rating, okay, great. Extend the data model to include user rating of one to five or null, and optionally aggregate stats: rating count, rating sum, average rating for future multi-user support.

[00:05:53]
Now, these are the things where I'm saying we can start to pare things down if we start to say, do we really need that, right? And that's going to help us because we saw with the standard prompt and even with our zero-shot prompt, we had very little control over any of that. But now we can utilize this to first come up with a plan, pare down the plan to keep the code quality really high, and then keep going.

[00:06:17]
But just because I kind of like it for now, we'll leave it in for now. Let's see what else though, to make sure. So provide accessible semantics, keyboard operable keys. Nice. I really like accessibility, so I definitely want to leave that in. Prevent layout shift while loading, render placeholder state before value resolves. Nice. Optional debounce save if switching rapidly, future optimization. Gracefully handle corrupted stored data.

[00:06:45]
Trigger UI refresh after rating change, okay, and allow sorting/filtering by rating. That's pretty nice. Now we can see it's also given some code. Sure. So it's taken a look at our data model and said, what do we need in this data model to make this happen? And we can see now we have this user rating that I mentioned, we have a rating count optional, a rating sum optional, and a get average rating.

[00:07:13]
Okay, so now we have all of this control already of how our code is changing that we didn't have before. We have storage helpers to help load the prompts and save the prompts, rating update logic. We have a simple approach to rendering stars. We have it integrated into our card creation. Great. So build prompt card appending the child, so we can see that we're going to be appending this to the child, which is great.

[00:07:42]
We want to make sure that it's added within our prompt node already, right? And then we have optional sorting by rating, cool. And then a styling hint like pseudo CSS. Let me know if you'd like a React/Vue web component version, ARIA support, or aggregation logic for multi-user scenarios. Happy to extend. And this is where I am always extra thankful that I've been like, let's plan this first because the one time that I don't say just implement with HTML, CSS, and JavaScript, GPT-4o is only too happy to recommend that I add React, Vue, or other web components, right?

[00:08:24]
So while it probably wouldn't have and wouldn't realize not to, now I can prompt with just a standard prompt to say, this all sounds good. Maybe if I was trying to change this a little bit, I could mention that, but I think this all sounds pretty solid for now, so I'm going to say this sounds great, but please only implement in HTML, CSS, and JavaScript. So we can see that we still needed to prompt again to actually have these changes take over.

[00:08:57]
But now we've gotten this better flow of understanding what's going to be happening and how it's going to be happening, and now we can see what happens from here. And I just want to, while we're doing this, show you this restore checkpoint. So remember when I showed you that we were able at the bottom of the screen to click that little get rid of everything? Well, here would be that checkpoint. So if we want to get rid of everything up to here, then we do that.

[00:09:24]
It'll show up when this is done. This isn't done yet, but these are your checkpoints, which are really helpful because then any time I make a change, I can click into here and make a change and it'll affect everything going down. So that's pretty amazing. So now we're going to let it just implement our five-star rating system. I did let it get a little bit creative in terms of other things that we were going to add to that five-star rating system, but I think that's totally fine for today.

[00:09:56]
Like I said, today is less about the perfect code and more about finding the perfect techniques for us to write code that we are really proud of, or maybe write perfect techniques to get us cover letters or whatever else we might be doing. Something that I use pretty commonly with these models is I really try and utilize them in studying. But I kind of do it a little bit differently than a lot of people do, I think.

[00:10:22]
So I have ADHD and I, if anyone's interested in Myers-Briggs, I'm an INFP, so that's why I talk a lot, right? Because I'm super creative and I just love communication, and I'm that person, if you give me your phone number and you're like, text me, I'm going to send you a 12-paragraph text and you're going to have to read it every single time and you're going to be like, why did I even talk to you?

[00:10:44]
So LLMs are my best friend because I can talk to them so much and give them so much context, and that's pretty rare, right? With tools, being more verbose is better, but actually with these tools, sometimes being more verbose is better. So when I do use these tools when I'm doing something like studying or making a plan or I'm trying to do an architecture decision or something like that, and I need to learn, I actually prompt it with those details about myself.

[00:11:16]
Like I'm an INFP, I have ADHD. Can you create a prompting or a study plan utilizing those details? And I'll often use one-shot prompting to actually use those details and say, this is actually a way that I study really well. So here's an example. Ask me a question, I'll give you an answer. Rate my answer as either correct or incorrect, and if it's incorrect, add a blurb of what's incorrect about it.

[00:11:39]
So now I've used one-shot prompting to actually make my perfect study guide for myself because now I don't have to start, you know, saying, okay, well I was incorrect, let me Google what was wrong. Now I can just get a very concise paragraph that's written in an explain like I'm five situation maybe, or explain like a newbie to whatever it is, right, situation, and I can utilize that really well to kind of make my own best plan.

[00:12:10]
So now let's see what actually changed within our code, and we've selected and added all of our changes. Let's move over to our Prompt Library. I'm going to delete this one just to kind of get fresh, right? So we're going to say one-shot prompt, and we will copy over some of our one-shot prompt. I'm just going to copy over a part of it, enter in our prompt, save prompt, and we can see that now we have added our star rating system.

[00:12:39]
And for some of you, this might not have the hover, for some of you it might. Kind of depends on the plan that you and your AI assistant created, but we can see that I can click it, and I can add stars. So maybe I would want these to be more filled in, ideally, right? Maybe it's a little bit confusing because it's not filled in and maybe I want to do that. I can just use simple standard prompts for now to then say, hey, I don't love the way this looks.

[00:13:09]
Let's just update it. Or if I had a small bug, hey, this is a bug, fix it, right? Sometimes I don't need to go past that standard prompt once I've done the complex work with one of my more complex prompts. So that is basically it in terms of the one-shot prompt. The next thing we're going to be going over is few-shot prompting, but I wanted to take a pause here and see if there were any questions about one-shot prompting or anything else that we've covered yet today.

[00:13:39]
Have you used AI to create the prompt itself or help crafting the prompt? Yes, absolutely. AI is phenomenal at actually crafting prompts for itself. There is a research paper. I don't have it within the slides today. That's actually about AI being a great prompting crafter generator. And it's a pretty interesting research paper. I would highly recommend reading if you're interested in doing that, but I especially will utilize these models and say, okay, I have this really complex task.

[00:14:07]
Help me break it down into smaller tasks and then help me prompt it. And is there a specific technique that may work best for this? Or maybe I know what technique I want to use. Maybe I want to use one-shot prompting for it. You can literally say, hey, this is the feature that I want to build. Can you help me create a one-shot prompt with a really good example that shows a general case, right? These large language models, these AI assistants are incredibly capable at creating these prompts for us.

[00:00:00]
So definitely don't be shy to just use a standard prompt and be like, hey, can you help me make a fancier prompt, right? Or maybe you say, okay, maybe I didn't need all of that. So help me parse down what's in my prompt to make it the most efficient.